Cloud9でLaravel6(PHP7.3) + MySQL + node.jsな開発環境を最短で構築する

このパートではLaravelの開発環境を構築するために、Cloud9でPHPとMySQLが動作するように環境構築をします。

環境構築のゴール

Laravelのトップページが確認できる
MySQL上に初期テーブルが確認できる
npmコマンドが使える

といった内容をゴールとします。

いずれもCloud9のコンソールからコマンドで順番にインストールをしていきます。

ではさっそく環境の構築を進めていきましょう。

Cloud9とは

Cloud9はアプリケーション開発やデータベースなどをクラウド環境で利用できるサービスです。Cloud9を使えば、簡単にプログラミング開発環境を構築できます。

AWSアカウントを取得

Cloud9を使うためにはAWSアカウントが必要になります。

AWSアカウントを既にお持ちの場合は、AWSにログインしてください。

AWSのアカウントを持っていない場合は、下記のリンクからAWSアカウントを作成してください。

AWSアカウントの作成

AWSアカウント作成の流れに関しては公式のリンクが非常に分かりやすいのでこちらを参考にしてください。

AWS アカウント作成の流れ

AWSにログイン

AWSアカウントを作成したら、AWSにログインしてください。

ログインは下記のリンクからログインできます。

AWSコンソール

ログインができたら下記のような画面に遷移します。

もし右上の東京と書かれている部分が別の物になっていた場合は赤い囲いの部分をクリックして東京を選択するようにしてください。

この選択肢はリージョンと呼ばれる物になり、物理的なサーバーが置いてある位置を指定する内容です。日本で使う前提であれば、距離的に近い東京リージョンを選択しておくことをおすすめしています。

次に、画面中央付近にある検索ボックスから「Cloud9」と入力すると、Cloud9の開発環境を作成するためのページに遷移します。

Cloud9の開発環境を作成
ではCloud9の開発環境を作成していきます。下記の画面にある「Create environment」をクリックしてください。

次にNameのフォームの箇所にアプリ名を入力します。任意の名前を入力して、 Next step をクリックしてください。

次に下記の画像のような画面に遷移します。この画面ではそのまま「Next step」を入力してください。

次に下記の画像のような画面に遷移します。この画面ではそのまま「Create environment」を入力してください。

すると下記の画像のように表示されていればCloud9の環境構築ができています。（下記の画面が表示されるまでに1~2分かかることがあります。）

Cloud9のインデントを設定

LaravelはインデントをTabに設定するのが基本ルールなので、Cloud9の設定を変更していきます。

インデントの設定を変更するには、右上の歯車アイコンをクリックし、「Soft Tabs」のチェックを外しておきましょう。

1. php7.3のインストール

まずはターミナルからガンガンコマンドを打つので、以下の場所にどんどん入力していきましょう！

パッケージのアップデート

$ sudo yum -y update

PHP7.3および、拡張機能のインストール

PHP7.3と共にPHPからデータベースに接続するための機能や日本語を扱うための機能など、本記事の開発に必要な拡張機能も同時にインストールしますので、下記コードを全てコピーして実行してください。

$ sudo yum -y install php73 php73-cli php73-common php73-devel php73-mysqlnd php73-pdo php73-xml php73-gd php73-intl php73-mbstring php73-mcrypt php73-zip

PHPバージョンの切り替え

Cloud9にはデフォルトでPHP5.6が入っていますので、先ほどインストールしたPHP7.3にバージョンを切り替えるコマンドになります。

$ sudo alternatives --set php /usr/bin/php-7.3

PHPバージョンの確認

以下の画像のように

$ php -v

を入力した際に PHP7.3.* といった7.3系のバージョンが返ってくればPHPのインストールは完了です。

2. MySQL5.5の削除

Cloud9にはデフォルトでMySQL5.5がインストールされていますが、2019年時点では最新のMySQLと比較して文法などが古いため,MySQL5.7のインストールの準備として、MySQL5.5を削除していきます。

MySQL5.5の停止

$ sudo service mysqld stop

画像のように Stopping mysqld: OKと返ってくればOKです。

MySQL5.5のアンインストール

まずはアンインストールコマンドをターミナルに入力します。

$ sudo yum -y erase mysql-config mysql55-server mysql55-libs mysql55

次に以下のコマンドを入力して、アンインストールができていることを確認しましょう。

$ mysql --version

以下のように

bash: /usr/bin/mysql: No such file or directory

と返ってくれば上手くアンインストールができています。

3. MySQL5.7のインストールと初期設定

2項で古いMySQLを削除したので、続いて新しいMySQLをインストールします。ターミナルから以下のコマンドを入力してください。

インストール

$ sudo yum -y install mysql57-server mysql57

インストールが終わり次第以下のコマンドでMySQL5.7を起動します。

$ sudo service mysqld start

起動が完了したら、バージョンがアップデートされていることを以下のコマンドでご確認ください。

$ mysql --version

画像のように5.7と出ていればインストール完了です。

初期設定

では続いてMySQL5.7の初期設定を行いましょう。

以下のコマンドで初期設定がスタートします。

$ mysql_secure_installation

コマンドを実行すると対話式で設定が進みます。（ターミナル側から色々聞いてくる）

まずは y (yes)を入力します。

次にパスワードポリシーでパスワード強度を設定しますが、開発用なので一番緩い0を指定しましょう。

そうすると、rootユーザーのパスワードを聞かれますので、覚えやすいパスワードを入力してください。

*入力しても反応がありませんが、ちゃんと入力できています。

このパスワードは後々使用するため、忘れないようにメモしておいてください。

確認用の入力と合わせて2回入力してください。

残項目の設定

残りの項目については全てyesで良いため、yを入力してenterを押していきます。

以下の画像のように All done! と表示されれば初期設定の完了です。

MySQL5.7へのログイン

では最後に初期設定の終わったMySQLへログインしてみましょう。

$ mysql -uroot -p先ほど決めたパスワード

とコマンド入力していきます。 -pのあとはスペースを入れずに パスワードを入力します。

コマンド入力後、このように $ が mysql> に変わればMySQLにログインできたことになります。

MySQLにログインしたので、次章以降使用するデータベースを作成しておきましょう。

以下のコマンドを実行してください。

mysql> CREATE DATABASE laravel CHARACTER SET utf8mb4;

こちらのコマンドで laravel という名称で文字コードutf8mb4（マルチバイト日本語対応）データベースができました。

それでは以下のコマンドでデータベースが作成されているか確認してみましょう。

mysql> show databases;

データベースリストの中に laravelデータベースを目視できれば作成が無事できています。

最後に以下のコマンドでMySQLから抜けましょう。

mysql> exit;

4. composerのインストール

composerとは？

composerとは、PHPのパッケージ管理ツールです。利用するパッケージ（ライブラリ）間の依存関係も解決してくれます。

今後Laravelで開発を進めるにあたり、ライブラリを導入することも多々あるかと思います。

ライブラリなどを導入した際にプロジェクトメンバーとの共有やライブラリ同士の依存関係（ライブラリAがないとライブラリBが動かない等）を管理してくれるパッケージマネージャーと呼ばれるものです。

インストール

以下のコマンドでcomposer本体をダウンロード・インストールしましょう。

$ curl -sS https://getcomposer.org/installer | php

続いてどこのパスからでもcomposerコマンドを使えるようにしておきます。

$ sudo mv composer.phar /usr/bin/composer

これにてcomposerのインストールが完了したので、動作を確認していきます。

$ composer -v

でバージョンを確認し、以下のようにcomposerのアスキーアートが確認できればインストール完了です。

5. Laravel6のインストール

ではここからcomposerを使ってLaravelをインストールしていきます。

インストール

本記事ではLaravel6.0を使っていきますので、ターミナルから以下のコマンドを打ってください。

$ composer create-project "laravel/laravel=6.*" --prefer-dist laravel6

本記事では laravel6という名前のディレクトリでlaravelをインストールします。

ターミナルに緑の文字で successfully と表示され、左のファイル管理の部分に laravel6 というフォルダが生成されていればインストールが完了しています。

初期設定

このセクションではLaravelのトップページを表示させるために必要な初期設定を行っていきます。

ではまず以下のコマンドでLaravelディレクトリに移動します。

$ cd laravel6

ではまずデータベース接続設定を変更していきましょう。

環境設定ファイルは隠しファイルなので、以下のように隠しファイルを表示していきます。

このように .env ファイルが見えれば .env ファイルをクリックして開きます。

以下のように

DB_DATABASE : laravelに
DB_PASSWORD : MySQL初期設定時に決定したもの

に変更していきます。

変更が終わったら Ctrl + s もしくは⌘ + s で忘れずに保存しましょう。

次にディレクトリの書き込み権限付与を変更してbootstrapとstorageディレクトリにログファイルやキャッシュファイルを書き込めるようにしましょう。

以下のコマンドを実行してください。

$ sudo chmod -R 0777 bootstrap/
$ sudo chmod -R 0777 storage/

このコマンドを実行する理由としては、自分以外（ターミナル操作以外）でもディレクトリ内にファイルを書き込めるようにする必要があるからです。

Laravelは独自のログ（アプリの動作履歴）を storage/logs/ に書き込んでいくのですが、書き込みユーザーはapache（Webサーバー）なので、自分以外もファイルの書き込みをできるようにしておく必要があるためです。

動作確認

以下のコマンドを打つと開発用のサーバーが起動します。

$ php artisan serve --host=$IP --port=$PORT

注意点として、php artisan コマンドはlaravelのディレクトリ以外で使う事ができません。（laravel6ディレクトリに移動して使う必要があります）

6. テーブルの作成

マイグレーションとはデータベースの履歴管理の仕組みになり、PHPファイルでテーブルの定義を行うことができます。

デフォルトでいくつかのマイグレーションファイルが準備されているので、実行してみましょう。

マイグレーションの実行

マイグレーションファイルの編集が終わりましたら、保存してターミナルに以下のコマンドを入力してください。

$ php artisan migrate

php artisanコマンドとはLaravelが用意しているコマンドでLaravelに関わる便利な機能を簡単に使うことができます。

migrateはマイグレーションファイルの内容を実行するコマンドになるので、以下のような反応が返ってくればOKです。

ec2-user:~/environment/laravel6 $ php artisan migrate
Migration table created successfully.
Migrating: 2014_10_12_000000_create_users_table
Migrated:  2014_10_12_000000_create_users_table (0.03 seconds)
Migrating: 2014_10_12_100000_create_password_resets_table
Migrated:  2014_10_12_100000_create_password_resets_table (0.03 seconds)
Migrating: 2019_08_19_000000_create_failed_jobs_table
Migrated:  2019_08_19_000000_create_failed_jobs_table (0.01 seconds)

7. 作成したテーブルの確認

最後にマイグレーションで作成したテーブルが本当に存在するのか確認していきましょう。まずはMySQLに接続します。

$ mysql -uroot -p先ほど決めたパスワード

とコマンド入力していきます。 -pのあとはスペースを入れずに パスワードを入力します。

MySQLにログインしたら、まずデータベースを選択します。

mysql> use laravel;

次にマイグレーションで作ったreviewsテーブルの構造を確認してみましょう。以下のコマンドを実行してください。

mysql> SHOW FULL COLUMNS FROM users;

このようにテーブルの構造がターミナルに返ってくれば無事に作成できています。

また、マイグレーションが成功している時点で、PHPからMySQLへの接続ができている証拠なので、環境設定も上手くできています。

以上です！

8. node.jsのインストール

インストール

$ curl -sL https://rpm.nodesource.com/setup_8.x | sudo bash -

コマンドでnode.jsをインストールするので、下記コマンドを実行してください。

sudo yum -y install nodejs

動作確認

最後にnode.jsとそのパッケージマネージャーであるnpmが正しくインストールされているか確認していきます。

$ node -v
$ npm -v

これらのコマンドでバージョンが返ってくればOKです。

node.jsをインストールした理由

Node.jsをインストールした理由はvue.jsやreact.jsの台頭によって、Node.jsを使うことが圧倒的に増えたからです。

おそらく言語プログラミングを勉強していく皆さんはこういったモダンな JavaScript フロントエンド開発も行うこととなります。そのためすぐに使えるようにあらかじめnode.jsをインストールしておきました。

また、 Laravel6のフロントエンドにはデフォルトでvue.jsが設定されていることもあり、モダンなWebアプリケーション開発においてはnode.jsは必須でしょう。

以上でCloud9上にLaravel開発環境を構築する方法を記述しました。皆さん良きプログラミングライフを。

補足

ipadでエラーが出た方はこちら SafariでCloud9を使う時にCookieエラーが出た時の対処方法