みなさんごきげんよう。
ラクス Advent Calendar 2020 の17日目を担当させていただきますフジサワでごさいます。
昨日は、@skaji18さんのSeleniumの実行を自動化したはなしでした。
自分の担当日が今日だということを当日深夜に思い出して絶望しかかっていますがとりあえず気合いでなんとかしようと思います。
今回は、前々から気になっていたGithub CodespacesでLaravelの開発ができるのかどうかを試してみつつ、試しながらQiita記事を書いていこうと思います。
ちなみに、Codespacesは現在ベータ版のため、利用するためには、公式ページから「ベータ版に申し込む」をして、招待を受ける必要があります。
ちなみに私は「いつ申し込んだのか記憶にない」のですが、自分のGithubアカウントに招待が届いていたので、今申し込んでからどれくらいで招待が受けられるのかわかりません。ごめんなさい。
Github Codespacesってなんですか
Github Codepspacesはブラウザで利用できるクラウド開発環境です。
ソースコードや実行環境はクラウド上にあり、ローカルの端末はブラウザ上、またはローカルにインストールされたVSCodeで接続して開発を行うことができます。
Codespecesのデフォルト環境はUbuntuベースのコンテナで、Gitはもちろん、PHP, Java ,Python,Node,TypeScriptなど、様々な言語の実行環境がデフォルトでインストールされているようです。
コンテナの詳細については下記をご覧ください。
GitHub Codespaces (Default Linux Universal)
何がいいの？
費用がGood
ベータ期間中は無料で利用することができますが、正式リリース後の費用については、確定ではないようですが、こちらで次のように記載されています。（2020/12/17現在）
| インスタンスタイプ (Linux) | 1 時間あたりのレート |
|---|---|
| Basic (2 コア、4GB RAM、32 GB SSD) | $0.085 |
| Standard (4 コア、8 GB RAM、32 GB SSD) | $0.169 |
| Premium (8 コア、16 GB RAM、32 GB SSD) | $0.339 |
Codespasesはコンテナが起動している時間に対して費用が発生し、
30分間操作をしないでいると、コンテナが中断する仕組みになっています。
上位とは別に、ストレージに対して月額量が発生し、そちらは今のところ月額 $0.10/GBとのこと。
これ、すごいリーズナブルだと思いませんか？
例えば、週末だけPremiumプランで個人開発に利用するような使い方をするとして、
`(4時間 * 8日 * $0.339) + (32GB * $0.10) ≒ $14
なわけですよ。
使わなかったとしたら発生する費用はストレージの維持費だけですし。
個人利用だけでなく、ビジネス利用でも、必要な開発者の稼働分だけコストが発生するっていうのはいいんじゃないでしょうか。
ローカルPCに依存しなくてGood
ブラウザを利用するにせよ、VSCodeから接続するにせよ、実行環境がローカルに無いので、ハイスペックな開発用PCを保有する必要がなくなります。
最近は、Chromebookなど、安価なノートPCなどが出回っていますので、安定した通信環境さえ確保できれば、開発用PCのコストを抑えることができます。
また、開発環境自体がクラウド上にあるので、開発時に使用するPCをシーンに応じて切り替えることも可能になります。
例えば、普段はオフィスや自宅などで、そこそこしっかりしたデスクトップPCで開発し、時々、安価で軽量なノートPCを持ってカフェなどで開発する、といったことも簡単にできそうですね。
使ってみる
Codespase環境は、Github上のリポジトリに結びつく形で、1つ以上の環境が構築されます。
今回は、空のリポジトリを作成し、PHPでLaravelを動作させるところまでやってみようと思います。
1. 空のリポジトリ作成
2. codespaceeの作成
[Code]ボタン - [Open With Codespaces]を押すだけ。
ブラウザの画面が切り替わり、codespaceの初期化が行われます。
初期化が完了すると、次のような画面が表示されます。
普段からVSCodeを使っている方ならお分かりになるかと思いますが、VSCodeまんまです。
この時点で、画面左部のExprolerからプロジェクトのファイルの編集を行ったり、画面下部のTerminalからコマンドを実行したりすることができるようになっています。
お手軽すぎて鼻水が出そうになりそうですが、とりあえず先に進みましょう。
3. PHP入ってるかな？
入ってた。
codespace ➜ ~/workspace/codespase-test (main) $ php -v
PHP 7.3.21 (cli) (built: Nov 18 2020 04:18:44) ( NTS )
Copyright (c) 1997-2018 The PHP Group
Zend Engine v3.3.21, Copyright (c) 1998-2018 Zend Technologies
with Xdebug v3.0.1, Copyright (c) 2002-2020, by Derick Rethans
PHPのバージョンが7.3なのが気になりますが、とりあえず今回はこのまま進みましょう。
4. Composer入ってるかな？
入ってた。
codespace ➜ ~/workspace/codespase-test (main) $ composer --version
Composer version 1.9.3 2020-02-04 12:58:49
1系なのが気になりますが、とりあえず今回はこのままLaravelプロジェクトの作成を行いましょう。
5. Laravelプロジェクト作成
codespace ➜ ~/workspace/codespase-test (main) $ composer create-project laravel/laravel codespace-laravel
:
:
Application key set successfully.
composerが1系なので途中warning出たりしますが、Laravelプロジェクトの作成が成功したようです。
ブラウザのVSCode上でも、問題なくLaravelのプロジェクトファイルが存在していることが確認できます。
6.立ち上げてみる
codespace ➜ ~/workspace/codespase-test/codespace-laravel (main ✗) $ php artisan serve
下記のようなダイアログが出るので、「Open in Browser」を押します。
7.いつものロゴきました！
ここまで簡単すぎて顔面が鼻水まみれですが、ブラウザのURLが下記のようになっていることに気が付いたので、少しみてみましょう。
https://xxxxxxxxxxxxxxxxxxxxx-8000.apps.codespaces.githubusercontent.com/
Codespacesのポートフォワーディング
Codespace上でWebサーバーなどが起動すると、内部のTCPポートにフォワードするURLが発行されます。
画面左の「Remote Expolorer」から、ポートフォワードの設定を確認してみます。
上記の赤線の行を右クリックして「Copy Adresss」や「Open in Browser」してみましょう。
内部のポート8000番が外部から参照できるURLに転送されていることが確認できます。
ためしに、Laravelを停止し、ポートを変えて立ち上げてみましょう。
codespace ➜ ~/workspace/codespase-test/codespace-laravel (main ✗) $ php artisan serve --port=8001
すると、先ほどのポートフォワーディングの設定が自動で更新されることが確認できます。
環境をカスタマイズしてみる
ここまでで、Codespace環境を立ち上げ、Laravelのインストールと起動、動作確認ができることが確認できました。
ここからは、codespace環境をカスタマイズできるのかどうか試してみましょう。
aptコマンドを実行してみる
root権限でaptコマンドも実行できました。
試しにSqlite3をインストールしてみましたが、問題なくインストールできました。
codespace ➜ ~/workspace/codespase-test/codespace-laravel (main ✗) $ sudo apt-get install sqlite3
：
：
codespace ➜ ~/workspace/codespase-test/codespace-laravel (main ✗) $ sqlite3 --version
3.31.1 2020-01-27 19:55:54 3bfa9cc97da10598521b342961df8f5f68c7388fa117345eeb516eaa837balt1
任意のコンテナイメージを作成してみる
codespacesでは、devcontainer.json/Dockerfileを作成することで、任意のコンテナイメージで環境を構築することができます。
今回は、試しにphp8環境をcodespacesで構築してみます。
Githubのリポジトリの直下に、下記のようなディレクトリ・ファイルを作成し、pushします。
.devcontainer/
├ devcontainer.json
└ Dockerfile
{
"name": "Original Container",
"build": {
"dockerfile": "Dockerfile"
}
}
FROM php:8.0-cli
この状態で、再度Codespaceを作成します。
Codespaceは、リポジトリ直下にdevcontainerの設定があれば、そちらを優先して参照し、環境構築を行います。
Codespaceを作成する
devcontainerの設定が正しくできていれば、codespaceの初期化中に、下記画像のようにコンテナイメージをpullしている様子をみることができると思います。
codespaceが立ち上がった後、期待通り任意のコンテナイメージが作成できているか、PHPのバージョンを確認してみましょう。
root@codespaces_9316f6:~/workspace/codespase-test# php -v
PHP 8.0.0 (cli) (built: Dec 11 2020 07:23:38) ( NTS )
Copyright (c) The PHP Group
Zend Engine v4.0.0-dev, Copyright (c) Zend Technologies
期待通り、任意のコンテナイメージで起動することができていることが確認できました。
ここまでできれば、基本的にはありとあらゆる環境を構築することができるのではないでしょうか。
おわりに
さて、今回の記事では簡単にGithub Codespacesの紹介をさせていただきましたが、いかがだったでしょうか。
個人的には、今後のシステム開発の有り様を大きく変える可能性を持ったものであるように感じています。
正式リリースが待ち遠しいですが、皆さんもベータ版が無料で利用できる間に、一度お試しされてはいかがでしょうか。
※12/16 23:30執筆開始 -> 12/17 02:41執筆完了 とりあえずかけたので寝る。
明日は@t_okkanさんの記事をお楽しみに！
ではでは。