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
630

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
80
Gradleとちょっと仲良くなろう
Avatar for Kazuhiro Seo kazuhiro1982
0
65
JavaとWebAssembly
Avatar for Kazuhiro Seo kazuhiro1982
0
88
SpringBoot 3.0 のNative Imageを試してみた
Avatar for Kazuhiro Seo kazuhiro1982
0
380
セッションデータの管理にSpring Sessionを利用する
Avatar for Kazuhiro Seo kazuhiro1982
0
2.6k
AWSのLake Formation Governed Tablesを触ってみた
Avatar for Kazuhiro Seo kazuhiro1982
0
380
SpringBootをコンテナで動かしてみる
Avatar for Kazuhiro Seo kazuhiro1982
0
390
Serverless FrameworkでWebサイトの更新を検知して通知する
Avatar for Kazuhiro Seo kazuhiro1982
0
490

Other Decks in Technology

See All in Technology
10分で学ぶ、RAGの仕組みと実践
Avatar for Marimo supermarimobros
0
740
3D生成AIのための画像生成
Avatar for 伊藤光祐 kosukeito
2
580
AI-in-the-Enterprise｜OpenAIが公開した「AI導入7つの教訓」——ChatGPTで変わる企業の未来とは？
Avatar for CUSTOMER CLOUD CORP. customercloud
PRO
0
110
Dataverseの検索列について
Avatar for MiyakeMito miyakemito
1
170
ガバクラのAWS長期継続割引 ～次の4/1に慌てないために～
Avatar for ひよこインフラエンジニア hamijay_cloud
1
580
企業が押さえるべきMCPの未来
Avatar for TakaakiKakei takaakikakei
0
260
Aspire をカスタマイズしよう & Aspire 9.2
Avatar for neno nenonaninu
0
360
勝手に！深堀り！Cloud Run worker pools / Deep dive Cloud Run worker pools
Avatar for iselegant iselegant
4
620
地味にいろいろあった！ 2025春のAmazon Bedrockアップデートおさらい
Avatar for みのるん minorun365
PRO
2
550
AIコーディングの最前線 〜活用のコツと課題〜
Avatar for PharmaX（旧YOJO Technologies）開発チーム pharma_x_tech
4
2.9k
ビジネスとデザインとエンジニアリングを繋ぐために 一人のエンジニアは何ができるか / What can a single engineer do to connect business, design, and engineering?
Avatar for 株式会社カミナシ kaminashi
2
860
OpenLane-V2ベンチマークと代表的な手法
Avatar for Kazuyuki Miyazawa kzykmyzw
0
150

Featured

See All Featured
BBQ
Avatar for Matthew Crist matthewcrist
88
9.6k
CSS Pre-Processors: Stylus, Less & Sass
Avatar for Bermon Painter bermonpainter
357
30k
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
329
24k
ピンチをチャンスに：未来をつくるプロダクトロードマップ #pmconf2020
Avatar for Aki / @LoveIdahoBurger aki_iinuma
119
51k
Site-Speed That Sticks
Avatar for Harry Roberts csswizardry
6
530
Let's Do A Bunch of Simple Stuff to Make Websites Faster
Avatar for Chris Coyier chriscoyier
507
140k
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
81
9k
Writing Fast Ruby
Avatar for Erik Berlin sferik
628
61k
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
29
920
Code Review Best Practice
Avatar for Trisha Gee trishagee
67
18k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
10
780
Being A Developer After 40
Avatar for Adrian Kosmaczewski akosma
91
590k

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