yps並走備忘録　Task2 MySQL(5.7)~nginx(v1.18)~PHP(7.3)~Laravelインストール

#yps Task 2 アプリを動かす準備

**今回の流れ**
1. MySQLインストール
2. Nginxインストール
3. PHPインストール
4. Laravelインストール
5. VS CodeでSSH接続してサーバーにあるファイルを編集

-----用意するもの-----
[VS Code] (https://code.visualstudio.com/)
折れない心（笑）

##MySQL5.7のインストール＆設定
アプリでデータベース管理を司るMySQLをインストール、設定していきます。
###まずはインストール
`sudo yum localinstall http://dev.mysql.com/get/mysql57-community-release-el7-7.noarch.rpm`
`sudo yum install -y mysql-community-server -y`

###動作確認
`mysqld --version`
（正常に完了していればMySQLの情報が表示される）

`sudo systemctl enable mysqld`（MySQLを自動で起動する設定）
`sudo systemctl start mysqld` (MySQLを起動）
`sudo systemctl status mysqld` (MySQLの状態を確認、起動できていれば「active(Running)」という緑の文字が出てくるはず）
`sudo systemctl stop mysqld` (一旦MySQLを停止）

###MySQLへログイン・パスワード変更・文字コードを設定
`sudo cat /var/log/mysqld.log | grep -i root` （仮で設定されたパスワードを表示、root@localhost: xxxxxxと表示されるはず）
`sudo systemctl start mysqld`
`mysql -u root -p`と打つとPassword:という表示になる、ここで上記の仮パスワードを入力するのですが、**Linuxの仕様で入力しても何も表示されない**ので注意！
ミスタイプがないように打って、Enterを押すと、正しい場合はMySQLに入れ、表示が`mysql>`となるはず。

####パスワード変更
`SET PASSWORD = PASSWORD('パスワードをここに入力'）`
-------------注意事項-------------
- ８文字以上、英字の大文字・小文字・数字・記号を全て混ぜないといけない
- #はエラーに基になるので使用しない

変更できたら`exit`と打つとサーバーのターミナルへ戻れる

####日本語を扱えるように文字コードを変更
`sudo vi /etc/my.cnf`

最終行に`character-set-server=utf8mb4`を追記

`sudo systemctl restart mysqld`（MySQLを再起動して設定を反映）
`mysql -u root -p`（MySQLにログイン）
`Password:設定したパスワード`

`mysql> show variables like "chara%";`（文字コードの設定が反映されているか確認）

**MySQLのインストールここまで**

---------------

##Nginxのインストール＆設定
補足：nginxとは？　参考url:
###インストール
**1. インストール用のyumレポジトリ作成**
`sudo vi /etc/yum.repos.d/nginx.repo`
開いたファイルに以下を記述
`[nginx]
name=nginx repo
baseurl=https://nginx.org/packages/centos/$releasever/$basearch/
gpgcheck=0
enabled=1`

**2. 以下のコマンドを打ってインストール**
`sudo yum install nginx -y`

完了したらバージョンを確認
`nginx -v`

nginxを自動で起動できるように設定
`sudo systemctl enable nginx`

**3. AWSマネジメントコンソールからインバウンドルールにhttp、httpsポートを追加**
http = 80
https = 443

nginxを再起動して設定を反映
`sudo systemctl nginx`

ブラウザにEC2インスタンスのIPを入れてWelcome to Nginxが表示されればインストール完了

**4. nginxのrootディレクトリ変更**
`sudo mkdir /var/www` wwwディレクトリを作成
`sudo mkdir /var/www/html`　wwwディレクトリの中にhtmlディレクトリを作成
`sudo chown -R centos:nginx /var/www` /var/www以下の権限をcentosからnginxに移譲

**5. nginxの設定変更**
`sudo cp /etc/nginx/conf.d/default.conf /etc/nginx/conf.d/default.conf.org` 元々の設定をorgファイルでバックアップ保存
`sudo vi /etc/nginx/conf.d/default.conf` 設定ファイルを編集

--------編集する場所----------
rootのパスを変更
`#root   /usr/share/nginx/html;`　 ⇒　`root   /var/www/html;`

Nginx構文チェック
`sudo nginx -t`　何も表示されなければＯＫ！

Nginxを再起動
`sudo systemctl restart nginx`

ブラウザで再度EC2のIPアドレスを開いて（or更新して）403エラーになっていればＯＫ

**nginxのインストール＆設定ここまで**

-----------------------

##PHP 7.3のインストール＆設定
お次はいよいよPHPを動かせるように必要なものをインストールしていきます

###1. yum レポジトリのインストール＆アップデート
EC2にインストールするためのプログラムが古いのでアップデートします。
`sudo yum install epel-release -y`
`sudo yum install https://rpms.remirepo.net/enterprise/remi-release-7.rpm -y`
`sudo yum update -y`

###2. PHPのインストール
`sudo yum -y install --enablerepo=epel,remi,remi-php73 php php-devel php-mbstring php-pdo php-gd php-xml php-mcrypt php-fpm php-mysql php-mysqlnd zip unzip`

バージョンの確認
`php -v`で以下が表示されればＯＫ

PHP 7.3.20 (cli) (built: Jul  7 2020 07:53:49) ( NTS )
Copyright (c) 1997-2018 The PHP Group
Zend Engine v3.3.20, Copyright (c) 1998-2018 Zend Technologies

###3. PHPとNginxを連携させます

####php-fpmの設定
`sudo cp /etc/php-fpm.d/www.conf /etc/php-fpm.d/www.conf.org`　恒例、元のファイルバックアップ
`sudo vi /etc/php-fpm.d/www.conf` 設定ファイル編集

**変更する場所**
user = nginx
group = nginx
listen = /var/run/php-fpm/php-fpm.sock
listen.owner = nginx
listen.group = nginx
listen.mode = 0660

**php-fpmの設定ここまで**

---------

####Nginxの設定
`sudo vi /etc/nginx/conf.d/default.conf`

**まずは１０行目くらいにあるindexのところに追記します**
`index  index.php（←追記） index.html index.htm;`
**そのすぐ下に下記も追記**
`try_files $uri $uri/ /index.php?$query_string;`

**さらにlocation / 以下に下記を追記します**
`location ~ \.php$ {
    root /var/www/html;
    fastcgi_pass   unix:/var/run/php-fpm/php-fpm.sock;
    fastcgi_index  index.php;
    fastcgi_param  SCRIPT_FILENAME  $document_root$fastcgi_script_name;
    include        fastcgi_params;
}`

終わるとこんな感じ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/647015/e1828ebf-5d7c-c103-48f0-17f6a6caa316.png)

上記連携が終わったら…

配下のディレクトリもnginxへ所有者変更（使えるようにする）
`sudo chown -R centos:nginx /var/www/` /var/www/

php-fpmの自動起動
`sudo systemctl enable php-fpm`

nginx再起動
`sudo systemctl restart nginx`

php-fpm起動
`sudo systemctl start php-fpm`

ここまでできればあとちょっと！

テスト表示用のindex.phpファイルを作成
vi /var/www/html/index.php 

ファイルに以下を記述
<?php echo phpinfo();?>

:wqで保存したらnginxとphp-fpmを再起動
`sudo systemctl restart nginx`
`sudo systemctl restart php-fpm`

**ブラウザを更新してPHPのバージョン情報が見られれば完了です**

---------------------

##Laravelのインストール＆設定

###一時フォルダに移動
`cd/tmp`

###Laravelのインストールに必要なComposerをインストール
`php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');"`
`php composer-setup.php`
`php -r "unlink('composer-setup.php');"`

###Composerがどこでも使えるようにします
`sudo mv composer.phar /usr/local/bin/composer`
`sudo chmod +x /usr/local/bin/composer`

###Laravelを構築します
`cd /var/www/html`
`composer create-project --prefer-dist laravel/laravel yps` ※ypsの部分はもちろん任意の名前でＯＫ

※phpをインストールした時にzip unzipがちゃんとインストールされていないとここで躓く可能性があります

###無事Laravelの構築が終わったら設定をしましょう
`cd yps` Laravelのフォルダへ移動
`cp -p .env.example .env` 環境ファイルを作成
`php artisan key:generate` composerでlaravelアプリ用の暗号化キーの生成とセット

.envファイルの下記の部分を変更します
APP_URL=　EC2のIPアドレス
DB_PASSWORD=　MySQLのパスワード

###node.jsとnpm（パッケージ管理システム）をインストール
多分後日フロント周りをいじるとき用…かな？
`sudo yum install npm node -y`
`composer install`
`npm install`

###下記のコマンドを打てば設定は一段落
`sudo chown -R centos:nginx /var/www/`
`sudo chmod -R 777 storage/ bootstrap/cache/`

###laravelのWelcome画面表示
`vi /etc/nginx/conf.d/default.conf`

`/var/www/html;`
となっているところを
`/var/www/html/yps/public;`
に変更して…

nginxとphp-fpmを再起動
sudo systemctl restart nginx
sudo systemctl restart php-fpm

最後にEC2インスタンスのIPアドレスをブラウザに入力すればLaravelのWelcome画面が見られるはずです。

###さらにここからVS Codeで編集できるようにします
1. VS Codeを起動して、拡張機能のRemote-SSHをインストール
2. 左の「リモートエクスプローラーアイコンをクリック」
3. SSH TARGETSと書いてあるところにカーソルを合わせると出てくる歯車アイコンをクリック
4. 画面中央上部にSelect SSH configuration file to updateと出るのでC:\users\ユーザー名\.ssh\configをクリック

- **Host:** 表示名、後ほどコマンドプロンプトからSSH接続をするのにも利用できる
- **Port:** AWSで作成したPort番号
- **User:** centos
- **HostName:** EC2のIPアドレス
- **IdentifyFile:** .ssh/xxxx.pem（秘密鍵ファイル）

5. 入力後に右下の緑色の「リモートウインドウを開く」をクリック
6. Remote-SSH Connect to Host...をクリック 
7. 上記で作成した表示名をクリック
8. 画面中央上部にLinux, Windowsとか選択肢が３つくらい出てくるのでLinuxを選択
9. しばらくするとVS Code Serverが立ち上がる
10. 完了すると右下にHost名が出る
11. エクスプローラを開いてresources ⇒　views ⇒ welcome.blade.phpを開く
12. ８４行目にあるウェルカムメッセージを変更して保存
13. ブラウザをリロードするとウェルカムメッセージが更新されている（ハズ）

**以上でTask2完了です。**