2019/03/30 コメント追加 やっぱりgitpodに乗り換えましたw
2019/03/13 コメント追加 Coderに乗り換えました
前置き
わたくし公私共にChromebook使いなので基本的に全てChromebook上のクラウドツールで済ませたいと思っているのですが、開発に関しては仕事上ネイティブAPIを叩くelectronアプリを試作する必要もあり、Visual Studio Code @Windows(electron)、cloud9@chrome(Web/electronのUI)、Monaca@chrome(Cordova)と使い分けていました。この中のお気に入りはVS Codeだったのですが、electronベースに関わらずオンラインバージョンは無く、VS Codeで環境統一できたらいいなーとずっとモヤモヤしていたところ、VS Codeを一部利用したTheiaのニュースを見たので、環境構築してみました。
手順
なにかマシンを用意する
これ用にubuntu18.04のEC2のスポットインスタンスを1つ立てました。
(ホントはECSを使おうかと思ったのですが、不慣れで意外と設定が大変そうだったので今回は断念しました。きっと誰か素敵な記事を書いてくれるはず!)
オフィシャルドキュメントに従いDockerのインストール&テスト
編注 ここらへんはオフィシャルドキュメントの更新頻度も高いので、本家当たるのをおすすめします。久しぶりにやろうとしてやってみたら変わったりしてたので、、。
sudo apt-get install apt-transport-https ca-certificates curl gnupg-agent software-properties-common
curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo apt-key add -
sudo apt-key fingerprint 0EBFCD88
sudo add-apt-repository "deb [arch=amd64] https://download.docker.com/linux/ubuntu $(lsb_release -cs) stable"
sudo apt-get update
sudo apt-get install docker-ce docker-ce-cli containerd.io
sudo docker run hello-world
コピペです。ちなみにDocker初めて使うので、検索上位サイトに書いてあったインストール方法で行なったのですが、古いのがインストールされたっぽく、無駄に1時間ハマったりしていました、、。ドキュメントはまず公式ドキュメントを当たりましょう、、、。
プロジェクトフォルダを作成
- 開発に使うワークスペース用のフォルダを作成
mkdir myApp
後でここに何かソース突っ込みます。
- permissionを追加し移動(777でなくても良いかも)
chmod 777 myApp
cd myApp
- Theiaコンテナの立ち上げ
オフィシャルドキュメントにあるコマンドをそのままコピペ
sudo docker run -it -p 3000:3000 -d -v "$(pwd):/home/project:cached" theiaide/theia:next
ちなみにDockerhubで探すといくつかの種類のコンテナが見つかります。theiaide/theiaは本当に最低限なので、本格的に使って見るには theiaide/theia-full あたりが必要かもしれません。
https://hub.docker.com/search?q=theiaide&type=image
これでコンテナにアクセス http://hostname:3000 すると無事動作していることが分かり、おぉぉーとなります。で、このままだと認証が無いので認証を追加、、しようとしたのですが、ここにもある通り、Theia自体には認証機能を持たせる計画が無いらしく、前段に認証機能持たせる必要があるみたいです。
リバースプロキシを置く
ALB配下にあるインスタンスなのでALBの認証機能を使ってみようかと思ったのですが、OCID等ちゃんとした認証用でこれまた設定が大変そうだったので、いったん簡易的にベーシック認証だけを行うリバースプロキシを置くことにしました。せっかくなのでこれもdockerでやってみます。
※ここでホスト名は host.example.com とします。
ベーシック認証用ディレクトリ・ファイルを作成
htpasswd用ディレクトリを作成し、apache2-utilsでhtpasswd形式ファイルを作成します。
mkdir ~/htpasswd
sudo apt-get install apache2-utils
htpasswd -c -b ~/htpasswd/host.example.com ユーザ名 パスワード
リバースプロキシとTheiaコンテナを立ち上げなおす
さっきのコンテナはいったんkillします(docker kill プロセス)。
その後コンテナを立ち上げなおします。
sudo docker run -d -p 80:80 -v /var/run/docker.sock:/tmp/docker.sock:ro \
-v /home/ubuntu/htpasswd:/etc/nginx/htpasswd \
jwilder/nginx-proxy
sudo docker run -it -p 3000:3000 -d -v "/home/ubuntu/myApp:/home/project:cached" -e VIRTUAL_HOST=host.example.com theiaide/theia:next
※ちなみにこの後ポート3000は外部アクセス不要なので閉じます
これでhost.example.comにアクセスするとベーシック認証付きでTheiaを使えます。業務用にはもうちょっとちゃんとしたほうが良いとは思いますが、個人用で楽しむものとしてこんな感じで設定してみました、の話でした。
Theiaをgithubから起動できるGitpodについて
重たい処理が走らないプロジェクトならgithubでソース管理しつつGitpod.ioを利用する、というのも結構良いとは思います(かなり便利なので契約してしまいました)。なんだかんだいってサーバーをそれなりにセキュアに保ったり、ポートの設定したりするのは面倒なので、気持ちよく契約してしまうのもおすすめです。