- 新しい開発環境構築の選択肢として登場したdevboxを試している記事を書いています。
- 今回はdevbox0.4.7で追加されたProcess Compose機能を利用してDocker Composeのように開発環境の管理をサービスとして簡素化する方法を記録いたします。
環境
- macOS Ventura 13.1
- devbox 0.4.7
手順
対象プロジェクトの準備
- 以下のコマンドを実行して、devbox環境及びnodejsプロジェクトを作成します。
# devbox環境作成
$ mkdir sample; cd $_
$ devbox init
$ devbox add nodejs-19_x
$ devbox shell
# devbox環境シェル内
(devbox)$ node -v
v19.5.0
# nodejsプロジェクト作成
(devbox)$ npm init -y
(devbox)$ npm i express
(devbox)$ touch app.js
- 実行後、作成された
app.jsを以下の内容にします。
app.js
const express = require('express')
const app = express()
const port = 3000
app.get('/', (req, res) => {
res.send('こんにちは')
})
app.listen(port, () => {
console.log(`${port}ポート開始`)
})
Process Compose機能の有効化
- その後Process Compose機能を利用するため、以下のコマンドで
process-compose.ymlを作成します。- ※Process Compose機能とは、
process-composeという非コンテナ環境を管理するためのOSSをバックグラウンドに利用したTUIアプリケーションです。 - ※docker-composeのようにyamlに宣言的に記述することでサービスとして簡易的に環境の管理や実行を行うことが可能です。
- ※Process Compose機能とは、
touch process-compose.yml
- 作成後、
process-compose.ymlの内容を以下にします。- ※細かい記述内容はこちらを参照
process-compose.yml
version: "0.5"
processes:
app:
command: node --watch app.js
availability:
restart: "always"
サービスの起動
- 記述後、以下のコマンドを実行してyaml内の
processesに定義したserviceを立ち上げます。
devbox services up
- 実行後、以下のようにProcess ComposeのUIが表示されることを確認します。
- 上記の画像でステータスやログなどの実行プロセスが確認できます。
- 上記の画像で
STATUSがRunningとなっていることを確認したら、localhost:3000にアクセスして簡易なアプリケーションが表示されていることを確認します。
- 確認後、
app.js内のこんにちはの内容を任意の文字列に変更して、Process ComposeのUIのログ及びlocalhost:3000の表示内容が以下のように変化していることを確認します。
- このようにProcess ComposeのUI上で立ち上がっているプロセスやログの確認が可能です。
- Process ComposeのUI上での主な操作一覧は以下です。
| キー | 説明 |
|---|---|
| F3 | サービス内容確認 |
| Ctrl + S | ログの選択内容をEnterキーでクリップボードにコピー |
| F9 | 選択サービスの停止。yaml内のrestartにalwaysが設定されているとrestartが走る |
| Ctrl + r | 選択サービスの再起動。 |
| F10 | シャットダウン。Quitボタンをクリックすることでサービス及びUIの停止が可能。 |
- サービスを停止するときは上記の操作一覧に従ってF10キーを押下すれば、UI画面が消えて
localhost:3000も表示されなくなります。 - 以上です。
補足
-
docker compose up -dのように、UI画面が必要なくサービスをバックグラウンドで実行したい場合はdevbox services up -bとうつことで可能です。 - その際のサービス確認は以下のように
devbox services ls、停止はdevbox services stopで実行します。
