Gitpod は vscode extend Remote-Containers とは違う

Vscode の拡張機能 Remote-Containers を使用した開発環境を作成とGitpodを使用した開発環境の作成を行います。

Remote-Containers について

VS Code からDockerコンテナを開発環境として使用できるようにします。
これにより、コンテナ上から Visual Studio Codeを利用することができます。

ワークスペースのファイルは、ローカルファイルシステムからマウントされるか、コンテナにコピーされ、異なるコンテナに接続するだけで、開発環境全体をシームレスに切り替えることができます。

• 公式ドキュメントは以下

• 構成
  

インストール準備

1.ローカルPC に VS code をインストール

2.インストール後、VScodeの拡張機能から Remote-Containers をインストール

3.Docker-desktop のインストーラをダウンロード

MicroSoft サンプルコードから試す

まずは、以下のサンプルコードを使用して、Remote-Containers で起動したコンテナの vscode を開きます。以下GitHubのサンプルコードをダウンロードしてファイルを展開します。

VScode を開き、ワークスペースへ展開したサンプルコードを追加します。

左下にある、>< ボタンをクリックし、コマンドパレットから Remote in Container を選択します。

イメージのBuildが開始されます。初回は少し時間が掛かります。

Buildが完了すると、docker run が実行されます。
Docker-Desktop からも起動が確認出来ます。
VScode の >< が Dev container に切り変わります。
また、ローカル端末が Windows の場合、Powershellを使用されているかと思いますので、ターミナルを表示した際に、bash が表示されます。
この状態から Remote-Containers からの起動したコンテナのvscodeを操作している事が確認出来ます。

Gitpod

VS code を使用した Remote-Containers は、ローカルにBuildしたdockerコンテナに vscode を含んだ開発環境を作成したものとなります。

これに対して Gitpod は ローカル上のコンテナは動作を行わず、ブラウザから任意のワークスペースに対して開発環境を作成するものとなります。
クラウドIDEと呼ばれ、DaaSとして機能するような開発環境という認識でいます。

私は触るのは初めてなので導入から実施し、メリットを理解していきます。

セットアップ

以下からログイン可能です。
GitLab / Github / BitBuckets いずれかのアカウントに連携してログイン出来るようです。

GitPodのダッシュボードです。
ここから WorkSpacesの管理画面から新規で作成する事が可能です。

WorkSpaces を開くと、VScode ライクなIDEが開きます。
Theia をベースとした VScode ライクなコードエディタで、VScode との違いが無いくらい同じ印象でした。

なお、一つのWorkSpaces 毎に .gitpod.yml が存在し、これを Dockerfile としてBuild 時点で独自な環境を作ることが可能なようです。
以下は Python djangoフレームワークをテンプレートした workspaces です。.gitpod.yml には pip で Django がインストールされているようです。

次に既存の GitHub のリポジトリをgitpodで見てみましょう。
Github のリポジトリURLの先頭に gitpod.io/# と付けるだけで良いらしいですが、Chrome ユーザーであれば拡張機能をインストールすると、GitHub の画面上に Gitpod が表示されるようになります。

開いてみると、先ほど同様のIDE環境が開き、レポジトリに公開されているソースコードが再現されます。

Gitpod のダッシュボードを見ると、新しいWorkspacesが追加されていました。

先ほど、Gitpodから作成したWorkspacesは図の下部にあたり、Docker コンテナから新しいWorkspacesを立ち上げたものになります。
Github からGitpod を立ち上げたworkspacesは図の上部に当たり、これはgit clone としてコンテナが立ち上がったものかと思われます。(既存のリポジトリとは別環境)

Pricing

ドキュメントに記載があります。
個人で使う分には Free で50時間/月まで使用が可能なようです。
また、Freeで privateのリポジトリが作成可能なため、個人の開発環境としても十分に発揮できそうです。
無制限で使用出来る Professional も $25/月 なため、Visual Studio Codespaces などのオンラインツールと比較しても、そこまで高くは無いかと個人的には感じました。

Gitpod 使うメリット

業務用のローカルPCと開発環境は分離したいと思っていたところにクラウドIDEに出会えたのは非常に良かったです。
使用して間もないですが、本格的にこれから GitPod を使っていこうと思えました。
以下、Gitpod を使うメリットを個人的に挙げてみました。

***- Workspaces の作成に制限が無いため、スクラップ&ビルド的な使い方が可能。

• ローカルPCに過剰なリソースを使用せず、かつローカルにファイルを持たずに開発環境を作成出来る。
• Workspaces を分けて使用出来るため、一つの Workspaces上でプロジェクトが複数に渡るような事も無く、よくあるファイルやディレクトリ、パッケージなどの煩雑化を未然に防げる。
• ブラウザからコーディングするため、調べものが多い人にはクイックな動作を行える。
• GitHub との連携により、既存のリポジトリを直ぐに有用する事が出来る。
• コンテナ(Workspace)のBuildが高速。
• VScode の拡張機能も多く使えるそう。
• 無料枠でも開発環境として十分に使えそう。***

以上となります。