Todo ウェブアプリを作ってみよう

開発環境を準備する

まずは、Todo ウェブアプリの開発環境を準備しましょう。

必要環境

Todo ウェブアプリの開発には、次の環境が必要になります。

この Getting Started では、開発に必要な環境をそろえた Docker イメージ(以降 Worker 開発環境)を用意しています。Docker の環境さえあれば、すぐに開発が始められます。

ここでは、この Worker 開発環境を使用する前提で解説します。

Docker および Docker Hub アカウントの準備については、「ウェブアプリを作ってみよう 」の「開発環境を準備する 」を参照してください。

Worker 開発環境を使用しない場合は、RubyRuby on RailsMySQL および magellan-cli をリンク先の情報を参考にして、準備してください。

Worker 開発環境の準備

それでは、Worker 開発環境を準備しましょう。

Worker 開発環境は、magellan/development-env-rails という名称で、Docker Hub に登録しています。この Worker 開発環境を使用する大まかな手順は次のとおりです。

Worker 開発環境の使用イメージ

  1. docker run コマンドで、Worker 開発環境仮想マシン(Docker コンテナ)を起動
  2. docker exec コマンドで、Worker 開発環境 Docker コンテナに接続
    この接続したターミナル上で Worker を開発します。

この手順の内、Worker 開発環境の準備は、1 の部分になります。ここからは、ターミナル(Windows は、コマンドプロンプト)での作業となります。

Worker 開発環境コンテナの起動の様子 (↑クリックで拡大表示)

作業用ディレクトリの準備

まず、作業用ディレクトリを準備します。既に「ウェブアプリを作ってみよう 」で作業用ディレクトリを準備している場合は、次の「Worker 開発環境仮想マシンの起動」へ進んでください。

Docker コンテナ内で作成したファイルやディレクトリは、Docker コンテナが消えるとなくなります。作成したファイルやディレクトリは残したいため、Docker のボリューム機能を使って、この作業用ディレクトリを Docker コンテナのファイルシステムと共有します。ウェブアプリ用のファイルやディレクトリは、この共有した作業用ディレクトリに作成することで、Docker コンテナが消えた後もウェブアプリ用のファイルやディレクトリを残します。

ここでは、次のディレクトリ構造で、作業用ディレクトリを準備します。~ は、ホームディレクトリです。ディレクトリ構造は、自由に決めて構いません。これはあくまでも一例です。

~
└── workspace
    └── learning-magellan

mkdir -p コマンドで、作業用ディレクトリを作成します。

mkdir -p ~/workspace/learning-magellan

Worker 開発環境仮想マシンの起動

作業用ディレクトリの準備が完了したら、cd コマンドで、その作業用ディレクトリに移動します。

cd ~/workspace/learning-magellan

Todo ウェブアプリでは、フルマネージドの MySQL データベースサービスである Cloud SQL を使用します。先に、docker run コマンドで、MySQL サーバー用仮想マシンを起動しておき、このあとで起動する Worker 開発環境仮想マシンと連携させます。

docker run --name mysql -p 3306:3306 -e MYSQL_ROOT_PASSWORD=s3cret -d mysql

ここでは、Docker 公式の MySQL イメージを使用しています。オプションの詳細は、Docker 公式の MySQL リポジトリ を確認してください。

docker run コマンドが終了したら、docker ps コマンドで、MySQL サーバー用仮想マシンが起動しているかを確認します。

docker ps

次のように、IMAGE 欄に mysql の行が表示されていることを確認します。

CONTAINER ID        IMAGE               COMMAND                  CREATED             STATUS              PORTS                    NAMES
94d27c3db974        mysql               "/entrypoint.sh mysql"   23 seconds ago      Up 22 seconds       0.0.0.0:3306->3306/tcp   mysql

つづいて、docker run コマンドで、Worker 開発環境仮想マシンを起動します。

docker run --privileged --name worker-devenv --link mysql:mysql -v $(pwd):/workspace -p 3000:3000 -d magellan/development-env-rails

-v $(pwd):/workspace の部分が、ディレクトリ共有の指定です。作業用ディレクトリを Docker コンテナ内の /workspace ディレクトリにマウントしています。

Docker のボリューム機能使用例図解

Docker コンテナ内の /workspace ディレクトリ以下にアクセスすると、ホスト PC の ~/workspace/learning-magellan ディレクトリ以下にアクセスすることになります。

docker run コマンドが終了したら、docker ps コマンドで、Worker 開発環境が起動しているかを確認します。

docker ps

次のように、IMAGE 欄に magellan/development-env-rails の行が表示されていることを確認します。

CONTAINER ID        IMAGE                            COMMAND                  CREATED             STATUS              PORTS                    NAMES
b4b08a7738e7        magellan/development-env-rails   "startup"                23 minutes ago      Up 23 minutes       0.0.0.0:3000->3000/tcp   worker-devenv
94d27c3db974        mysql                            "/entrypoint.sh mysql"   51 minutes ago      Up 51 minutes       0.0.0.0:3306->3306/tcp   mysql

tips用アイコン

もし、docker run コマンド実行後に、

docker: Error response from daemon: Conflict. The name "/worker-devenv" is already in use by container *****. You have to remove (or rename) that container to be able to reuse that name..

のようなメッセージ(***** の部分は、CONTAINER ID)が表示された場合は、別の Worker 開発環境が起動しています。

次のコマンドを実行し、その Worker 開発環境を停止&破棄してから、再度 docker run コマンドを実行してください。

docker stop worker-devenv && docker rm worker-devenv

もしくは、docker run コマンドの --name worker-devenv オプションで指定している worker-devenv を別の名称に変えてください。その場合は、以降の worker-devenv の部分をその変えた名称に読み替えてください。

これで、Worker 開発環境を使って、Todo ウェブアプリを開発する準備が整いました。「シンプルな Web API を Worker に実装する」へ進みましょう。