# ワークショップ実施手順
###### tags: `SAiTech`

**本資料は，主にAWS EC2を利用した開発環境構築のワークを中心に補足するものとする.**

---

## オリエンテーション①

EC2インスタンスにおけるワークなし

---

## オリエンテーション②

[参考]

* [Amazon EC2 > Getting started tutorial](https://docs.aws.amazon.com/AWSEC2/latest/UserGuide/EC2_GetStarted.html)
* [Remote Development using SSH](https://code.visualstudio.com/docs/remote/ssh)

### EC2インスタンスの作成

1. AWSにIAMユーザーでサインインする.
2. EC2マネジメントコンソールを開く.
3. サイドメニューの"インスタンス"を押下する.
4. 東京リージョンで"インスタンスの作成"を押下する.
* ステップ1：Ubuntu Server 18.04 LTS (HVM), SSD Volume Type ami-0cc75a8978fbbc969 (64 ビット x86)
* ステップ2：t2.micro
* 確認と作成
* 起動
5. ポップアップウィンドウで"新しいキーペアの作成"を行う.
* 任意のキーペア名を入力
* "キーペアのダウンロード"を押下
* ダウンロードしたpemファイルを，ローカルマシンの `~/.ssh` 配下へ移動
6. ポップアップウィンドウで"インスタンスの作成"を押下する.
7. インスタンスIDのリンクを押下する.
次のインスタンスの作成が開始されました: xxxx
8. インスタンスに名前をつける.
ex) SAiTechEC2
すべてのインスタンスが同じ画面にリストされるため，本工程を確実に実施すること！

### セキュリティグループの作成

1. サイドメニューの"セキュリティグループ"を押下する.
2. "セキュリティグループを作成"を押下する.
* 以下の表に記載されたセキュリティグループを作成
| セキュリティグループ名 | 情報 | VPC | インバウンドルール |
| -------------------- | ---- | --------- | ------------------------------------ |
| SAiTech SSH | 任意 | デフォルト | **任意の場所**からの**SSH通信を許可** |
| SAiTech HTTP | 任意 | デフォルト | **任意の場所**からの**HTTP通信を許可** |
| SAiTech HTTPS | 任意 | デフォルト | **任意の場所**からの**HTTPS通信を許可** |
3. EC2インスタンスに，作成したセキュリティグループをすべてアタッチする.
（"アクション" -> "ネットワーキング" -> "セキュリティグループの変更"）

### VSCodeでEC2インスタンスに接続

1. SSH設定ファイルを編集する.

   # ~/.ssh/config
   Host [alias] # 任意のエイリアスを入力
       HostName [hostname] # マネジメントコンソールより，ホスト名をコピー
       User ubuntu
       Port 22
       IdentityFile [secretkey] # pemファイルのパスを指定

2. コマンドパレットで以下のコマンドを実行する.
※事前学習で"Remote SSH"の拡張機能をインストールしていることが前提！

   Remote-SSH: Connect to Host...

* 途中，コマンドパレットで入力を求められた場合は以下を選択
Linux
Continue

### Apacheサーバーのインストール

1. aptコマンドで必要なモジュールをインストールする.

   sudo apt install apache2
   sudo apt install libapache2-mod-php7.2

2. `mod_ssl` モジュールを有効化してApacheサーバーを再起動する.

   sudo a2enmod ssl
   sudo a2ensite default-ssl

   sudo systemctl restart apache2

3. WebブラウザでEC2インスタンスにアクセスし，`index.html` を表示する.

### ワークショップで作成したPHPファイルをサーバーのドキュメントルートへ転送

1. VSCode(Remote SSH)で，EC2インスタンスの `/var/www/html` フォルダを開く.
2. ローカルマシンで作成したPHPファイルをドラッグ＆ドロップで転送する.
3. WebブラウザでEC2インスタンスにアクセスし，転送したファイルの実行結果を確認する.

### EC2インスタンスとのSSH接続を切断

1. コマンドパレットで以下のコマンドを実行する.

   Close Remote Connection...

---

## オリエンテーション③

[参考]

* [Laravel 7.x Installation](https://readouble.com/laravel/7.x/en/installation.html)
* [Troubleshooting - Composer](https://getcomposer.org/doc/articles/troubleshooting.md)

### Laravelプロジェクトの作成

1. Laravelプロジェクトの作成に必要なモジュールをインストールする.

   # インストール前に既存パッケージを更新
   sudo apt update
   sudo apt upgrade

   sudo apt install zip unzip
   sudo apt install php-mbstring
   sudo apt install php-xml

2. Composerをインストールする.

   sudo apt install composer

   # インストールが成功しているか確認
   composer

3. スワップファイルを作成する.

   sudo /bin/dd if=/dev/zero of=/var/swapfile bs=1M count=3072
   sudo chmod 600 /var/swapfile
   sudo /sbin/mkswap /var/swapfile
   sudo /sbin/swapon /var/swapfile

   # メモリの使用状況を確認
   free -h

4. ニュースアプリのプロジェクトを作成する.

   sudo chown ubuntu. /var/www/html
   cd /var/www/html
   composer create-project --prefer-dist laravel/laravel laravel-news

5. プロジェクトルート配下のオーナー・パーミッションを変更する.

   sudo chown -R ubuntu:www-data laravel-news
   sudo find laravel-news -type d -print | xargs -i chmod 750 {}
   sudo find laravel-news -type f -print | xargs -i chmod 640 {}
   sudo chmod -R 770 laravel-news/storage/
   sudo chmod -R 770 laravel-news/bootstrap/cache/

6. WebブラウザでEC2インスタンスにアクセスし，Welcomeページを表示する.

---

## オリエンテーション④

[参考]

* [A Quick Guide to Using the MySQL APT Repository](https://dev.mysql.com/doc/mysql-apt-repo-quick-guide/en/)
* [Artisan Console Tinker (REPL)](https://laravel.com/docs/7.x/artisan#tinker)

### データベースの準備

1. EC2インスタンスにMySQLのAPTリポジトリを追加する.

   sudo apt-key adv --keyserver pgp.mit.edu --recv-keys 5072E1F5
   # もしコマンドが失敗した場合，以下のWebページに公開されているPGP PUBLIC KEYをEC2インスタンスに手動で追加する.
   # https://dev.mysql.com/doc/refman/8.0/en/checking-gpg-signature.html

   sudo add-apt-repository "deb http://repo.mysql.com/apt/ubuntu bionic mysql-8.0"

2. MySQL8.0をインストールする.

   # インストール前に既存パッケージを更新
   sudo apt update
   sudo apt upgrade

   sudo apt install mysql-server

   # rootユーザーの初期パスワードを設定
   # デフォルトの認証プラグインは，"Use Legacy Authentication Method (Retain MySQL 5.x Compatibility)"を選択

### CRUD処理の実行

1. データベースを作成する.

   mysql -uroot -hlocalhost -p
   # rootユーザーの初期パスワードでMySQLサーバーへ接続

   mysql> create database `laravel-news`;

2. テーブルを作成する.

   mysql> use `laravel-news`;

   mysql> create table posts (id int, title varchar(255), body text);

3. SELECT, INSERT, UPDATE, DELETEクエリを実行する.

   mysql> insert into posts values (1, 'title01', 'body01');
   mysql> select * from posts;

   mysql> update posts set body='updated!' where id = 1;
   mysql> select * from posts;

   mysql> delete from posts where id = 1;
   mysql> select * from posts;

   mysql> drop table posts;
   mysql> show tables;

   mysql> quit

### LaravelからMySQLへの疎通確認

1. .envファイルを編集する.

   # laravel-news/.env
   DB_CONNECTION=mysql
   DB_HOST=127.0.0.1
   DB_PORT=3306
   DB_DATABASE=laravel-news
   DB_USERNAME=root
   DB_PASSWORD=[password] # rootユーザーのパスワードを入力

2. tinkerでMySQLクエリを実行する.

   # MySQL用のドライバをインストール
   sudo apt install php-mysql

   cd [path_to_laravel_project_root]
   # ニュースアプリのディレクトリを移動していない場合，パスは"/var/www/html/laravel-news"

   php artisan tinker
   >>> DB::select('select 1');
   # MySQLへの接続に成功しているか確認

   >>> exit

---

## オリエンテーション⑤

EC2インスタンスにおけるワークなし

<br>

以上