210
133

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Gitpodが最強過ぎる件について

Last updated at Posted at 2019-04-06

Gitpodって何?

One-Click Online IDE for GitHub & GitLab

GitHub,GitLabのためのワンクリックオンライン IDE です。

GitHub や GitLab のページからすぐに使える使い捨ての VS Code ライクなクラウド開発環境を構築してくれます。

Theiaというオープンソースの IDE を動かしています、詳しくは Theia のサイトを見てみてください。

なんで最強なのか

  • 無料(50 時間/月、オープンソース)
  • アカウント連携だけで利用できる (GitHub,GitLab,Bitbucket)
  • 開発環境を使い捨てできる
  • VS Code と操作感が同じ(拡張機能も対応)
  • 自動で開発環境をセットアップできる
  • コラボレーション(ペアプロ)ができる
  • Git 統合されていて Pushは勿論のことGitHubなどのPRレビューまでできる
  • 多くのプログラム言語をサポート
  • ターミナルが利用できる
  • タブレットやスマホでも利用できる(現在調整中)

使い方

gitpod.io/#を GitHub,GitLab,Bitbucket のリポジトリURLの先頭につけるだけ

これだけで開発を開始できます!
(URLがIssuesだと新ブランチが作られた状態で、Pull Requestだとレビュー画面で起動するなどちょっとした小技があります)

また、Chrome 拡張機能をインストールし簡単にアクセスできるようにする方法もあります。(オススメ)

Gitpod をより便利にする方法

.gitpod.yml を設定する

  • DockerFile を利用できる
  • モジュール等を起動時にインストールできる

といった他の IDE では手の届かないところが使えます。

例:

# ワークスペースを実行するDockerイメージ デフォルト:gitpod/workspace-full
image: <your-workspace-image>

# 起動時に実行するコマンド
tasks:
    - init: yarn install
      command: yarn start
# 起動時に開くポート
ports:
    - port: 8000
      onOpen: open-preview

これで起動時にlocalhost:8000のプレビューが開いた状況を自動で用意します。

GitHub アプリを利用する

GitHub アプリを利用することで継続的インテグレーション(CI)のように自動でリポジトリの変更を検出しワークスペースを準備し始めます、起動を始める前に起動処理が終わるので少し時間のかかる起動時間が大幅に減ります。

こちらからセットアップ!

VS Code 拡張機能をインストールする

左側の拡張機能欄から検索してインストールします。

以下の動画を参考にしてみてください。
How to install VS Code extensions in Gitpod.io (new Open VSX search bar)

いつもの拡張機能がない場合

GitpodではMicrosoftの規約の影響によりVSCode MarketplaceではなくOpen VSXを利用しているので検索しても思ってる拡張機能が出ないことがあります。

VSCode Marketplaceから拡張機能をダウンロードしてください、そのファイルをGitpodにドラッグアンドドロップすると利用できます。

わかりにくいですがMarketplaceの右側にあるDownload Extensionからインストールしてください。

詳細:https://www.gitpod.io/docs/vscode-extensions/

環境変数を設定する

gp env foo=bar

とコマンドに打ち込む
またはダッシュボードから設定できます。

終わりに

2019年4月、βから本公開に移ったときこの記事を書かせてもらいました。
その後7月からGitpodに関わらせて頂いています。感謝🙇

追記:Gitpodの良さをもっと知ってもらうために記事を書いています、この記事に付け足すか新しく記事を作るかは未定ですが楽しみにしていてください(2020/09/10)

Gitpodに関してわからないことがあれば気軽に聞いてください、多くの人に必要そうな内容であれば追記させていただきます。

※指摘、質問があればコメント又はTwitterまでお願いします。

210
133
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
210
133

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?