Upgrade to Pro — share decks privately, control downloads, hide ads and more …

VS CodeとRemote Containerで開発環境もコード管理しよう

Avatar for Kazuhiro Seo Kazuhiro Seo
June 26, 2021
Technology
1
650

VS CodeとRemote Containerで開発環境もコード管理しよう

Avatar for Kazuhiro Seo

Kazuhiro Seo

June 26, 2021
Tweet

More Decks by Kazuhiro Seo

See All by Kazuhiro Seo
GitHub ActionsとAWSをOIDC認証で連携する
Avatar for Kazuhiro Seo kazuhiro1982
1
100
Gradleとちょっと仲良くなろう
Avatar for Kazuhiro Seo kazuhiro1982
0
68
JavaとWebAssembly
Avatar for Kazuhiro Seo kazuhiro1982
0
95
SpringBoot 3.0 のNative Imageを試してみた
Avatar for Kazuhiro Seo kazuhiro1982
0
390
セッションデータの管理にSpring Sessionを利用する
Avatar for Kazuhiro Seo kazuhiro1982
0
2.7k
AWSのLake Formation Governed Tablesを触ってみた
Avatar for Kazuhiro Seo kazuhiro1982
0
390
SpringBootをコンテナで動かしてみる
Avatar for Kazuhiro Seo kazuhiro1982
0
400
Serverless FrameworkでWebサイトの更新を検知して通知する
Avatar for Kazuhiro Seo kazuhiro1982
0
490

Other Decks in Technology

See All in Technology
CIでのgolangci-lintの実行を約90%削減した話
Avatar for KazukiHayase kazukihayase
0
340
知識を整理して未来を作る 〜SKDとAI協業への助走〜
Avatar for yyoosshh yosh1995
0
140
BrainPadプログラミングコンテスト記念LT会2025_社内イベント&問題解説
Avatar for BrainPad brainpadpr
0
150
AI技術トレンド勉強会 #1 MCPの基礎と実務での応用
Avatar for Nisei Kimura nisei_k
1
240
AIエージェント最前線！ Amazon Bedrock、Amazon Q、そしてMCPを使いこなそう
Avatar for みのるん minorun365
PRO
10
3.8k
Prox Industries株式会社 会社紹介資料
Avatar for Prox proxindustries
0
190
Liquid Glass革新とSwiftUI/UIKit進化
Avatar for Fumiya Sakai fumiyasac0921
0
120
Observability infrastructure behind the trillion-messages scale Kafka platform
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
130
20250623 Findy Lunch LT Brown
Avatar for Brown 3150
0
750
20250625 Snowflake Summit 2025活用事例 レポート / Nowcast Snowflake Summit 2025 Case Study Report
Avatar for K.Osawa kkuv
1
180
第9回情シス転職ミートアップ_テックタッチ株式会社
Avatar for forester3003 forester3003
0
130
ユーザーのプロフィールデータを活用した推薦精度向上の取り組み
Avatar for Yudai Hayashi yudai00
0
470

Featured

See All Featured
[RailsConf 2023 Opening Keynote] The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
29
9.5k
Docker and Python
Avatar for Tania Allard trallard
44
3.4k
Gamification - CAS2011
Avatar for David Bonilla davidbonilla
81
5.3k
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
330
24k
Improving Core Web Vitals using Speculation Rules API
Avatar for Sergey Chernyshev sergeychernyshev
16
940
Building Adaptive Systems
Avatar for Chris Keathley keathley
43
2.6k
Writing Fast Ruby
Avatar for Erik Berlin sferik
628
61k
Designing Experiences People Love
Avatar for Jonathan Moore moore
142
24k
Reflections from 52 weeks, 52 projects
Avatar for Jefferson Lam jeffersonlam
351
20k
A Modern Web Designer's Workflow
Avatar for Chris Coyier chriscoyier
693
190k
Site-Speed That Sticks
Avatar for Harry Roberts csswizardry
10
650
What’s in a name? Adding method to the madness
Avatar for Product Marketing Alliance productmarketing
PRO
22
3.5k

Transcript

  1. VS CodeとRemote Containerで VS CodeとRemote Containerで 開発環境もコード管理しよう 開発環境もコード管理しよう VS CodeとRemote

    Containerで - 開発環境もコード管理しよう

  2. 自己紹介 自己紹介 妹尾 一弘 札幌でシステム開発会社勤務 JavaDoスタッフ VS CodeとRemote Containerで -

    開発環境もコード管理しよう

  3. Visual Studio Code Visual Studio Code Microsoft製オープンソースIDE サポートされるプログラミング言語が多い VS CodeとRemote

    Containerで - 開発環境もコード管理しよう

  4. Remote Development Remote Development リモート開発環境にアタッチする拡張機能パック コンテナやSSH、WSLに接続して開発出来る 今回はコンテナの話 VS CodeとRemote Containerで

    - 開発環境もコード管理しよう

  5. Remote Containerの仕組み Remote Containerの仕組み 引用元: 引用元: https://code.visualstudio.com/docs/remote/containers https://code.visualstudio.com/docs/remote/containers VS CodeとRemote

    Containerで - 開発環境もコード管理しよう

  6. コンテナをビルド/実行 コンテナをビルド/実行 ※ 起動済みコンテナの利用も可能 ※ 起動済みコンテナの利用も可能 VS CodeとRemote Containerで -

    開発環境もコード管理しよう

  7. ソースコードをマウント ソースコードをマウント VS CodeとRemote Containerで - 開発環境もコード管理しよう

  8. VS Code Serverをインストール VS Code Serverをインストール VS CodeとRemote Containerで -

    開発環境もコード管理しよう

  9. Extensionをインストール Extensionをインストール ※ 明示的に指定したExtensionのみ ※ 明示的に指定したExtensionのみ VS CodeとRemote Containerで -

    開発環境もコード管理しよう

  10. 環境設定は 環境設定は .devcontainer フォルダ以下の .devcontainer フォルダ以下の devcontainer.json に記載する devcontainer.json に記載する

    VS CodeとRemote Containerで - 開発環境もコード管理しよう

  11. devcontainer.json devcontainer.json VS CodeとRemote Containerで - 開発環境もコード管理しよう

  12. buildセクション buildセクション VS CodeとRemote Containerで - 開発環境もコード管理しよう

  13. docker-composeも使用可能 docker-composeも使用可能 VS CodeとRemote Containerで - 開発環境もコード管理しよう

  14. 他のコンテナも参照出来る 他のコンテナも参照出来る VS CodeとRemote Containerで - 開発環境もコード管理しよう

  15. extensionセクション extensionセクション VS CodeとRemote Containerで - 開発環境もコード管理しよう

  16. settingsセクション settingsセクション VS CodeとRemote Containerで - 開発環境もコード管理しよう

  17. devcontainer.jsonをコミットしておくことで どんなコンテナを利用するか どんなExtensionを利用するか どんな設定でVS Codeを利用するか がチームで共有できる VS CodeとRemote Containerで -

    開発環境もコード管理しよう

  18. Remote Containerのメリット Remote Containerのメリット VS CodeとRemote Containerで - 開発環境もコード管理しよう

  19. 開発環境がコンテナ化される 開発環境がコンテナ化される Immutable 環境が壊れてもRebuildすれば戻せる 新規メンバーがすぐに開発を始められる VS CodeとRemote Containerで - 開発環境もコード管理しよう

  20. 環境セットアップに必要な設定を 環境セットアップに必要な設定を すべてコードで管理できる すべてコードで管理できる OSやライブラリはDockerfileで ExtensionやFormetter設定はdevcontainer.jsonで VS CodeとRemote Containerで -

    開発環境もコード管理しよう

  21. 開発環境のメンテナンスが 開発環境のメンテナンスが 通常の開発サイクルに乗る 通常の開発サイクルに乗る VS CodeとRemote Containerで - 開発環境もコード管理しよう

  22. 辛いポイント 辛いポイント VS CodeとRemote Containerで - 開発環境もコード管理しよう

  23. Docker for Mac/Windowsに依存する Docker for Mac/Windowsに依存する ファイル権限周り等がハマりやすい VS CodeとRemote Containerで

    - 開発環境もコード管理しよう

  24. メモリが必要になりがち メモリが必要になりがち VS CodeとRemote Containerで - 開発環境もコード管理しよう

  25. まとめ まとめ Remote Containerを使うことで Remote Containerを使うことで 開発環境を簡単に立ち上げ・再構築できる チームが同じ環境で開発が出来る 開発メンバー固有のトラブルが減る 開発環境メンテナンスの属人化を減らせる

    VS CodeとRemote Containerで - 開発環境もコード管理しよう

  26. ありがとうございました ありがとうございました VS CodeとRemote Containerで - 開発環境もコード管理しよう