AWS Cloud9 のPHP/MySQL を 7.1/5.7 にしてみる

[PHP Advent Calendar 2017](https://qiita.com/advent-calendar/2017/php) の9日目です。

Docker を絡めた内容にすると予告してましたが、がらっと変更してしまいました・・・
新しく選んだテーマは、「AWS Cloud9」です。

# AWS Cloud9 とは

「AWS Cloud9」とは、今年の11月末から12月頭にかけて開催された「AWS re:Invent 2017」で発表された新しいサービスです。

Cloud9 自体は以前からサービスされていたもので、2016年7月に Amazon に買収されて、とうとう AWS に統合されたという流れです。

Cloud9 は、ブラウザ上で動作する IDE で、複数の開発言語に対応し、共同作業が可能という特徴があるサービスです。それが、AWSに統合されたということで、IAMベースのユーザ管理や、ネットワークの制御等もできるので、より細かい管理ができるという形になります。

# セットアップしてみる

とりあえずは、AWSのアカウントが必要なので、もし持っていない場合は作成する必要があります。アカウントの作成が終われば、「AWS Cloud9」の環境構築となります。

「AWS Cloud9」は現在以下のリージョンのみで提供されています。

- EU(アイルランド)
- アジアパシフィック(シンガポール)
- 米国東部(バージニア北部)
- 米国東部(オハイオ)
- 米国西部(オレゴン)

残念ながら、東京リージョンには来ていないので、今回は「米国東部(バージニア北部)」(us-east-1)で試してみます。

## welcome 画面

![Welcome to AWS Cloud9.png](https://qiita-image-store.s3.amazonaws.com/0/111934/19f8fed5-86b3-495a-902a-ecda6a5fb8b3.png)

まずは、「AWS Cloud9」のサービストップの「Create environment」をクリックします。

## Step1 Name environment

![step1.png](https://qiita-image-store.s3.amazonaws.com/0/111934/c52e8521-9c6b-43a4-6a52-7a62dcb7340c.png)

Step1として、環境名(Name)と説明文(Description)を入力して、Step2へ行きます。

## Step2 Configure settings 

![step2.png](https://qiita-image-store.s3.amazonaws.com/0/111934/881ab1b5-439e-038c-ec50-b082018c3fbf.png)

Step2では、 作業するための環境設定を行います。

Environment Type としては、以下の2つを選ぶことになります。

- 新しい EC2 インスタンスをこの環境用に起動する
- 既存のサーバーに SSH 接続して作業をする

今回は、新しいインスタンスを立てますが、既存サーバーへの接続での共同編集というのも面白そうですね。

Environment Type で新しいインスタンスを使うことを選択した場合は、EC2 のインスタンスタイプを選択します。

また、コストを抑えるための設定があります。デフォルトでは、IDEを閉じてから30分後にインスタンスが停止され、再度IDEを開くとインスタンスが再起動するというものです。

それ以外の設定として、使用する IAM role と ネットワークの設定が行なえます。特に設定しなければ、Cloud9しか制御できない IAM role で、新しい VPC ネットワーク が設定されます。

ちなみに、既存のサーバーに SSH 接続する方を選択すると以下の選択肢になります。

![step2-ssh.png](https://qiita-image-store.s3.amazonaws.com/0/111934/81fcb016-5756-0844-77f9-6ae9779203f4.png)

## Step3 Review

![step3.png](https://qiita-image-store.s3.amazonaws.com/0/111934/f6f41c07-810e-fc23-6a6d-e70cf7693e33.png)

確認画面です。内容に問題がなければ、「Create environment」ボタンを押して、環境作成を開始します。

この画面では、以下のような注意が表示されます。

![step3-info.png](https://qiita-image-store.s3.amazonaws.com/0/111934/dd389aa2-6c5a-0e53-d6c8-181b6649c988.png)

「Create environment」ボタンを押すと、環境作成中画面ということで次のような画面になります。環境は、だいたい 2 〜 3 分くらいで作成されました。

![build-cloud9.png](https://qiita-image-store.s3.amazonaws.com/0/111934/c023c532-d795-8472-cdb0-ad7b2e954c28.png)

# 「AWS Cloud9」 IDE 画面

![cloud9.png](https://qiita-image-store.s3.amazonaws.com/0/111934/2c38a4a7-ef93-6500-fd61-8fbb687b5b4b.png)

IDE の画面としては、オーソドックスな画面で、左側にソースツリー、右側の上部のメインとなる部分にソース等の表示がありますが、右側の下部がターミナルになっているというのが面白いですね。

ここで、起動したインスタンスの情報を見てみるとこんな感じでした。

![uname.png](https://qiita-image-store.s3.amazonaws.com/0/111934/64a063f1-b970-35b0-aea2-a7674c38012c.png)

さらに、起動したインスタンスの PHP と MySQL のバージョンをみてみると・・・

![default_php_mysql_version.png](https://qiita-image-store.s3.amazonaws.com/0/111934/0f5c4377-7a9e-7d9a-dacf-28dd324a60b7.png)

PHP はともかく、MySQLが 5.5 というのがちょっとつらい。

というわけで、アップグレードするためのシェルを準備しました。以下のものをターミナルから実行するとPHPとMySQLがバージョンアップできます。

```bash
sh -c "$(curl -fsSL https://gist.githubusercontent.com/kunit/c2cc88d18d4ce9ad972bab2bdc3b6f3f/raw/27f538fe5d21d024f72a6dfbee7563dc7247ad46/aws-cloud9-php71-mysql57.sh)"
```

実行する sh の内容を貼っておくと以下のような感じです。

(2017/12/10 10:12 追記) 最初書いていたスクリプトは、わざわざ PHP 5.6を削除してましたが、 `alternatives` の機能を使えば、PHPの切り替えができたので、7.1をインストールして、 `alternatives` で切り替えるものにしました

https://gist.github.com/kunit/c2cc88d18d4ce9ad972bab2bdc3b6f3f

```bash
#!/bin/sh

sudo service mysqld stop
sudo yum -y erase mysql-config mysql55-server mysql55-libs mysql55
sudo yum -y install mysql57-server mysql57
sudo service mysqld start

sudo yum -y install php71 php71-cli php71-common php71-devel php71-mysqlnd php71-pdo php71-xml php71-gd php71-intl php71-mbstring php71-mcrypt php71-opcache php71-pecl-apcu php71-pecl-imagick php71-pecl-memcached php71-pecl-redis php71-pecl-xdebug
sudo alternatives --set php /usr/bin/php-7.1 
curl -sS https://getcomposer.org/installer | php
sudo mv composer.phar /usr/bin/composer
```

この sh を実行すると、以下のように、PHP 7.1.11 および MySQL 5.7.20 の環境になります。

![upgrade_php_mysql_version.png](https://qiita-image-store.s3.amazonaws.com/0/111934/65fb14b2-3976-2b97-6e6a-fc7b6da19789.png)

# では、実際のコードを編集および動作させてみよう

環境を作っただけで満足してしまいそうですが、実際のコードを動かしてみたいと思います。

サンプルとして使用させていただいたのは、[CakePHP Advent Calendar 2017](https://qiita.com/advent-calendar/2017/cakephp) 2日目の [@tenkoma](http://twitter.com/tenkoma) さんの記事、[CakePHP 3 のチュートリアルにユニットテストを追加する (1)](http://tenkoma.hatenablog.com/entry/2017/12/02/170644) のコードです。

AWS Cloud9 のターミナルから、以下のコマンドを実行し、ソースコードの取得及び compose install を行います。(us-east-1 で起動しているので、composer install もさくっと終わります)

```bash
git clone https://github.com/tenkoma/cakephp_cms.git
cd cakephp_cms
composer install
```

そして、サンプルを動かすために、MySQLにテスト用のデータベースを作らないと行けないので、以下のコマンドを実行します。

```bash
mysql -u root -e 'CREATE DATABASE test_cake_cms CHARACTER SET utf8mb4;GRANT ALL  ON test_cake_cms.* TO cakephp@localhost IDENTIFIED BY "AngelF00dC4k3~";FLUSH PRIVILEGES;'
```

あとは、Cloud9 の IDE 上から、 `cakephp_cms/config/app.php` のテストデータベースの設定部分を編集して、ターミナル上から phpunit を実行すると、次のようになります。

![edit_app_and_phpunit.png](https://qiita-image-store.s3.amazonaws.com/0/111934/69819e74-e4f7-adf4-b044-0f589d6aae4a.png)

ターミナル部分を拡大するとこんな感じです。

![phpunit.png](https://qiita-image-store.s3.amazonaws.com/0/111934/72c21d46-9070-7d7a-ec13-d641b97c9848.png)

# キーバインド

IDEの設定項目がありますが、最初に変更したのがこちら。

![keybinding.png](https://qiita-image-store.s3.amazonaws.com/0/111934/9044a5ae-7223-3002-f9e6-4ca2ae06c189.png)

プルダウンの種類的には、以下の４つでした。

- default
- Vim
- Emacs
- Sublime

# ダッシュボード

IDEを開いたタブを閉じても、ダッシュボードに行けば再度 IDE を開き直せます。

![dashboard.png](https://qiita-image-store.s3.amazonaws.com/0/111934/93f87938-b501-7881-3895-2a999463f9f2.png)

何もせずに、環境構築時に設定した時間が経過したらインスタンスは自動的に停止され、次にIDEを開いたときに再起動されます。

# AWS Cloud9 の料金

AWS Cloud9 自体は無料で、使用する EC2 インスタンスに対する課金のみとなります。そういった意味で、IDEを閉じたら、30分後にEC2を自動停止してくれるというのは結構ありがたいですね。

# 最後に

AWS Cloud9 ですが、ちょっとした共同作業の環境として使えるだけではなく、使いようによってはおもしろい使い方ができるかもと思っています。

普段 PhpStorm という超強力な IDE を使っているので、それとくらべて IDE としての使い勝手はどうなんだということも今後いろいろと試してみたいなと思ったりもしています。

AWS アカウントさえあれば、本当に簡単に起動できるので、みなさんも試してみるのはいかがでしょうか？

明日の担当は、[@hanhan1978](https://twitter.com/hanhan1978) さんです。