ネットワークエンジニアのアレ

技術情報メインの備忘系ブログです

トップ > Git > GitHubから起動可能なWebIDE「Gitpod」を使ってみました。

GitHubから起動可能なWebIDE「Gitpod」を使ってみました。

Git Editor Dev IDE

Gitpod


先日のPublickeyさんの記事で知った、WebIDEの「Gitpod」。

VS Code本家のMicrosoftが提供しているVisual Studio Codespaces（以下、Codespaces）も以前使っていましたが、ブラウザ操作時の反応速度やセルフホステッド環境の不具合などで、最近は使っていませんでした。
 
気軽にブラウザで開発できる環境を探していたので「Gitpod」使ってみました。
 

 

※Codespacesとサービス統合が発表されたGitHub Codespacesのアーリーアクセスに申し込んでいますがなかなか招待されない・・。

Gitpodの特徴

特徴はざっくりこんな感じです。

  • 簡単にWebIDE環境を構築できる
  • DockerFile/Docker Imageで柔軟な開発環境を構築できる
  • VS CodeライクなUI
    ※オープンソースWebIDE「Eclipse Theia」がベースです
  • VS Codeの拡張機能が使える　※全部使えるかは不明
  • iPadでも使える（使えた）
  • 安価に使える
    ・無料で50 hours / monthまで使える（ただしPublicリポジトリのみ）
    ・$9で100 hours / monthまで使える（PrivateリポジトリもOK）
    ・$39で時間無制限で使える
    ・Self-Hostも利用可能（無料）

Gitpodの使い方

起動

起動はとても簡単。

ブラウザで「https://gitpod.io#」の後ろに開発したいリポジトリ（今回はGitHub）のURLを記載してアクセスするだけ。

https://gitpod.io#https://github.com/user/repository

Gitpod_Start

起動が簡単になる（リポジトリ画面から直接起動できる）ブラウザ拡張機能もあります。

Gitpod_概要_イメージ

chrome.google.com

addons.mozilla.org

 

環境イメージ

Gitpodの開発環境はDockerコンテナ上で動いています。
前述のURLにアクセスするとDockerコンテナ環境が用意され、その中にGitHubリポジトリがCloneされた状態で起動します。
 
構築された開発環境はWorkspaceといいます。
 

Gitpod_概要_イメージ

同じリポジトリで複数のWorkspaceを作ることが可能です。
Workspace（下記図の#1）で変更内容をGitHubにPushしていない場合、新しく作られるWorkspace（下記図の#2）には当然ですが変更内容が反映されません。
 
Gitpod_概要_イメージ
Workspaceで変更した内容をGitHubのリポジトリに反映する場合は、PC等で開発する場合と同様にPushする必要があります。

Gitpod_概要_イメージ

Workspaceのライフサイクル

Workspaceの停止

Workspaceは非アクティブ状態が30分続くと停止します。
（Unlimitedプランの場合は3時間）

タブを閉じている場合は3分で停止するようです。

 

停止したWorkspaceは管理画面から起動することが可能です。

 

Gitpod_概要_イメージ

Gitpod_概要_イメージ

Workspaceの削除

Workspaceは14日間非アクティブな状態が続くと削除されます。

 

Gitpod_概要_イメージ

 

ピンマークで固定されたWorkspaceは永続保持されるとドキュメントに書いてありました。

Gitpod_概要_イメージ

DockerFile or Docker Imageで環境をカスタマイズ

Dockerコンテナに環境が構築されますが、ベースのコンテナには最低限のパッケージしか入っていません。

自身の環境に合わせて環境構築する場合は、DockerFileかDocker Imageでカスタマイズ可能です。（.gitpod.ymlを編集します）

 

www.gitpod.io

VS Codeの拡張機能が使える

いくつかVS Codeの拡張機能を利用してみましたが、問題なく使えました。

拡張機能が検索しても出てこない場合は、VS Codeの拡張機能サイトでダウンロードし、ブラウザ画面上にドラック＆ドロップすればインストールできます。

 

GitPod_拡張機能

 

GitPod_拡張機能

 

iPadで使える

手持ちのiPad pro 11インチで使えました。

おわりに

いつでも、どこでも同じ環境で開発ができるのでとても便利です。

 

競合になるGitHub Codespacesの価格は公開されていませんが、既存のCodespacesの価格を見る感じGitpodよりは高くなる気がします。

 

今のところ不満もないので、GitHub Codespacesリリース後も継続して使いそうです。

 

www.gitpod.io

 
 

GitHub