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
730
1

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

Avatar for Kazuhiro Seo

Kazuhiro Seo

June 26, 2021

More Decks by Kazuhiro Seo

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

Other Decks in Technology

See All in Technology
GitHub Copilot Dev Days
Avatar for tomokusaba tomokusaba
0
140
GKE Agent SandboxでAIが生成したコードを 安全に実行してみた
Avatar for Lamaglama39 lamaglama39
0
180
20260428_Product Management Summit_tadokoroyoshiro
Avatar for tadokoro_yoshiro tadokoro_yoshiro
15
18k
変化の激しい時代をゴキゲンに生き抜くために 〜ストレスマネジメントのススメ〜
Avatar for KAKEHASHI kakehashi
PRO
4
770
AI バイブコーティングでキーボード不要？！
Avatar for Sam Akada samakada
0
680
カオナビに Suspenseを導入するまで / The Road to Suspense at kaonavi
Avatar for 株式会社カオナビ kaonavi
1
160
Building a Study Buddy AI Agent from Scratch: From Passive Chatbots to Autonomous Systems
Avatar for Patrick Eichler itchimonji
0
120
エージェント時代の UIとAPI、CLI戦略
Avatar for coincheck coincheck_recruit
0
120
FessのAI検索モード：検索システムとLLMへの取り組み
Avatar for Shinsuke Sugaya marevol
0
180
Oracle Exadata Database Service on Cloud@Customer X11M (ExaDB-C@C) サービス概要
Avatar for oracle4engineer oracle4engineer
PRO
2
7.9k
Oracle Cloud Infrastructure：2026年4月度サービス・アップデート
Avatar for oracle4engineer oracle4engineer
PRO
0
290
AIが自律的に働く時代へ Amazon Quick で実現するAIエージェント紹介
Avatar for こーへい koheiyoshikawa
0
170

Featured

See All Featured
Lightning talk: Run Django tests with GitHub Actions
Avatar for Sarah Abderemane sabderemane
0
180
Documentation Writing (for coders)
Avatar for Carmen Chung carmenintech
77
5.3k
Un-Boring Meetings
Avatar for Sebastian Deterding codingconduct
0
280
A Soul's Torment
Avatar for Nat Ma seathinner
6
2.7k
[RailsConf 2023] Rails as a piece of cake
Avatar for Vladimir Dementyev palkan
59
6.5k
Fight the Zombie Pattern Library - RWD Summit 2016
Avatar for Marcelo Somers marcelosomers
234
17k
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
135
9.8k
Designing for Timeless Needs
Avatar for Cassini Nazir cassininazir
0
210
Navigating the moral maze — ethical principles for Al-driven product design
Avatar for Skipper Chong Warson skipperchong
2
350
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
239
140k
Marketing to machines
Avatar for Jono Alderson jonoalderson
1
5.2k
Deep Space Network (abreviated)
Avatar for Tony Rice tonyrice
0
130

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で - 開発環境もコード管理しよう