はじめに
こんにちは。X（クロス）イノベーション本部 ソフトウェアデザインセンター の山下です。
みなさんGitHub Codespaces(https://github.co.jp/features/codespaces) をご存知ですか？ 昨年一般提供されたGitHubで利用できる統合開発環境(IDE)です。
GitHub Codespacesは、ブラウザ上で動作する開発環境となります。GitHubから起動することができて、ブラウザが動く環境であれば、追加でソフトウェアのインストールを必要とせず、いつでもどこでも開発作業が可能です。
この記事では、その特徴、使い方、そして便利な点について解説します。特にチームの開発で開発環境を統一したい場合や素早く開発環境を用意したい場合には GitHub Codespaces を検討しても良いかもしれません。
GitHub Codespacesの特徴
GitHub Codespacesは、クラウド上に開発環境を構築し、クラウド上で完結する開発環境です。開発者はデバイスや場所に依存せず、どこからでもコードの編集や実行が可能になります。従来の開発環境では、各個人のPCに環境を構築する必要がありましたが、Codespacesを使用するとその必要がありません。Visual Studio Codeと完全に統合されているため、その強力な機能を利用できます。コードの補完、シンタックスハイライト、リファクタリング、デバッグといった機能はもちろんのこと、拡張機能をインストールしてカスタマイズすることも可能です。
この記事ではGitHub Codespacesの概要を紹介しますが、詳細は公式のドキュメントも参照して下さい。
https://docs.github.com/ja/codespaces
GitHub Codespacesの利用方法
GitHub Codespacesの利用はとても簡単です。GitHubのリポジトリページにアクセスし、"Code"ボタンの下にある"Open with Codespaces"を選択するだけでCodespaceを作成できます。
Codespaceが作成されると、そのリポジトリ専用にGitHubが提供しているクラウド上に開発環境が構築され、アクセスするとVisual Studio Codeがブラウザで立ち上がります。
しかもリポジトリのソースコードは既に git clone されていて、すぐにコードの編集やデバッグを開始できます。また起動したVisual Studio Codeはローカルで使用しているのとほぼ同じ機能が実現されています。普段からVisual Studio Codeに慣れている開発者であれば、普段通りコードの編集やデバッグが可能です。もちろん、コード補完、シンタックスハイライト、リファクタリング、拡張機能も利用できます。
GitHub Codespacesの便利な点
ここでは、自分がGitHub Codespacesを使っていて便利だと思った点をいくつか紹介していこうと思います。
Dev Containerを使った環境のカスタマイズ
GitHub Codespacesでは、Dev Containerを使った開発環境のカスタマイズを行うことも可能です。.devcontainer/devcontainer.json を作成して、Dev Container環境を作成することが出来ます。この設定ファイルでは、使用する基本イメージの指定、必要なツールのインストール、VisualStudio Codeの設定、ポートの開放などを定義できます。
先日、このテックブログにもDev Containerを使ったPythonの開発環境を構築する記事が公開されています。Dev Containerの設定についてはそちらが参考になるかと思います。
Dev Containerを使ってステップバイステップで作るPythonアプリケーション開発環境
Dev Container用の設定ファイルは、リポジトリに含めて共有することで、チーム全体で統一した開発環境を簡単に構築できます。
Dev Containerの設定については、GitHub Codespacesにも説明があるので確認してみてください。
https://docs.github.com/ja/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/introduction-to-dev-containers
GitHub Codespacesでの拡張機能の扱い
GitHub Codespaces上では起動した環境上でMarketplace から拡張機能のインストールが可能です。
もし普段、Visual Studio Codeの設定の同期機能を利用している場合であれば、GitHub Codespacesとも設定を同期させることも可能です。VisualStudio Codeの設定の保存にGitHubを利用している場合、起動したGitHub CodeSpacesに同期している設定が自動的に読み込まれます。この機能とDev Containerを組み合わせることで柔軟に開発環境を構築することが可能となります。Dev Containerではチームで使う拡張機能を共通でインストールして、Visual Studio Codeの同期機能で個人の拡張機能をインストールするというような運用が可能となります。
GitHub Codespacesのパーソナライズの項目に説明があるので確認してみてください。
https://docs.github.com/ja/enterprise-cloud@latest/codespaces/customizing-your-codespace/personalizing-github-codespaces-for-your-account
GitHubとの統合
GitHubとの統合も大きな特徴の一つです。起動したGitHub Codespacesの環境では起動した状態で git clone が実行されている状態であることは紹介しました。さらに、GitHub への認証が完了している状態で起動しているので、リポジトリへのコードの git push といった操作を行なう際に追加の設定作業は不要です。起動して、コードを修正して、テストして、すぐにpushするという作業に集中できます。GItHub用の拡張機能もインストールされているため、Pull Requestの作成、マージ、コードレビュー、イシューの管理も行えます。
クラウド上に開発環境があることのメリット
ここまでで、GitHub Codespacesの便利な機能を簡単に紹介しました。この他にGitHub Codespacesがクラウド環境に開発環境が構築されることによるメリットもあります。
開発環境の構築が高速
まず一つ目として、新規プロジェクトを開始する際に、従来のローカル環境と比べて環境設定の時間を大幅に短縮できる点が挙げられます。新たに必要なツールやライブラリをインストールする手間が省け、すぐに開発に取りかかることができます。
開発で利用するマシンが自由
二つ目として、異なるOSやデバイスでの開発が容易になる点です。たとえば、普段はMacを使って開発している人でもブラウザさえ起動できれば同一の環境がすぐ手に入ります。
開発環境の統一の実現
そして、最も大きな利点として、チームの効率化を挙げることができます。全てのチームメンバーが同じ開発環境を簡単に共有できるため、環境差による問題が大幅に減少します。また、Codespaceはブラウザ上で動作するため、どのデバイスからでもアクセスできます。これにより、場所にとらわれずに作業が可能となります。
GitHub Codespacesの注意点と制限
使用料金はリソースの使用量によります。無駄な費用を避けるためには、使用しないCodespacesは閉じるなど、適切な管理が求められます。Codespacesは開発環境を起動している時間と利用しているストレージの料金の2種類が請求されます。使っていない環境は自動的に削除されるので、無駄な起動時間の請求はあまり発生しないと思います。しかし、ストレージの方は自動的に削除されないため注意が必要となります。
GitHub Codespacesの利用料金は以下のページを参照してください。
https://docs.github.com/ja/billing/managing-billing-for-github-codespaces/about-billing-for-github-codespaces
また、一部のハードウェア依存の開発や、特定の開発をGitHub Codespacesでは行なうことが出来ません。例えば、高度な3Dグラフィックスを必要とする開発作業や、特別なハードウェアに依存した開発作業は、現在のところCodespacesではサポートされていません。
まとめ
今回はGitHub Codespacesについて紹介しました。GitHub Codespacesは、クラウド上に開発環境を提供することで環境設定の手間を省き、どこからでも安全に開発を行うことができる便利なツールです。ただし、料金や対応できない開発がある事など一部の問題を理解した上で使用することが重要となります。
私たちは同じチームで働いてくれる仲間を探しています。今回のエントリで紹介したような仕事に興味のある方、ご応募お待ちしています。
ソリューションアーキテクト執筆：@yamashita.tsuyoshi、レビュー：寺山 輝 (@terayama.akira)
（Shodoで執筆されました）
