【AWS】LaravelアプリをEC2デプロイ②【Route53編】

# 0. はじめに
大阪のLaravel初学者サウナーこと、kazumakishimoto([@kazuma_dev](https://twitter.com/kazuma_dev))です！
お名前ドットコムで独自ドメイン取得→`Route53`登録方法です。

## 0-1. 前回記事
- 【AWS】LaravelアプリをEC2デプロイ【まとめ編】

https://qiita.com/kazumakishimoto/items/e0e109fca443a4acd2a1

- 【AWS】LaravelアプリをEC2デプロイ①【CloudFormation / EC2 / RDS編】

https://qiita.com/kazumakishimoto/items/0859a5a365b226c1b43a

## 0-2. 全体の流れ
> [1.お名前ドットコム](#1-お名前ドットコム)
> [2.Route53](#2-route53)
> [補足](#補足)
> [Reference](#reference)
> [次回記事](#次回記事)

## 0-3. 本記事の対象者
- EC2パブリックIPデプロイ完了しており、Route53で独自ドメインを取得したい方

## 0-4. 事前準備
- AWSアカウント作成済み
- EC2(EIP)デプロイ済み
- リージョンはアジアパシフィック(東京)ap-northeast-1
- `grfl`や`hoge`はサンプル名なので適宜変更して下さい

https://aws.amazon.com/jp/register-flow/

## 0-5. 要件
- 独自ドメイン取得(お名前ドットコム)
- Route53登録(EIP)
- 独自ドメインのブラウザ表示

## 0-6. 本番環境
|ツール|バージョン|
|:--|:--|
|OS|Amazon Linux 2|
|nginx|1.12|
|PHP|7.4.28|
|Laravel|6.20.44|
|MySQL|5.7.37|
|Composer|1.10.26|
|Node.js|13.14.0|

## 0-7. AWS構成図
![aws](https://user-images.githubusercontent.com/68370181/178103075-eec5508a-4d29-409c-84f4-3f687fa9cd5d.png)


# 1. お名前ドットコム
## 1-1. 独自ドメイン取得
- `.com`が取得できなかったため、`.work`を取得(※お名前ドットコム2年目料金表要参照)

https://www.onamae.com/

https://qiita.com/yuusuke510/items/9b2e786d4f798a4c9660

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/016b0b16-0aa8-ce5d-fa9b-aa6bc1c9bed1.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/62e657a4-5ea4-9f19-f6d8-f2d5c05ccfc6.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/80a71dde-1398-08af-df7d-3d69165a2224.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/9b740da3-dea9-82dd-70ba-742d33f05b69.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/31d01373-ae1e-60d5-5a80-18da696413b2.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/21787206-b1a6-f54c-ddbf-783d9db617ee.png)

## 1-2. 自動更新解除
https://www.onamae.com/guide/p/19

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/da1dda9f-47d9-061c-a3e4-21acda4eed88.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/419461dd-2add-1dfe-b7de-fad8bddcb720.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/80c00f6a-05c1-a238-44f1-2cd15fa7ffe2.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/cac868ae-9aa6-6ced-b68d-af4e28a3b345.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/dc4751a2-9370-1b85-e6da-b40bf9d638fd.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/38ecde99-f460-3d98-b992-1732d5065b5e.png)


# 2. Route53
## 2-1. ホストゾーン作成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/1b6e57e7-16b1-16ec-3f81-0ba52fd76921.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/2e4fd18a-0b54-9c1f-5197-c7aba9d80c93.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/2b68bfb4-2e39-0233-85e1-a03f1bb6cdf9.png)

## 2-2. ネームサーバー変更
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/393b67d7-5688-4943-e22e-68d5e0bc54cc.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/15ce0371-9a24-79a8-6bb1-d9b96f11a0a8.png)

## 2-3. Elastic IP紐付け
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/d7cec2be-45d7-f5ec-1d1d-eb108e23107a.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/fb7666ec-0436-3aaf-f6e6-b45ec60610b2.png)

## 2-4. 動作確認
```terminal:local
$ dig grfl.work NS +short
ns-xxxx.awsdns-xx.org.
ns-xxx.awsdns-xx.net.
ns-xxxx.awsdns-xx.co.uk.
ns-xxx.awsdns-xx.com.
```
```terminal:local
$ nslookup grfl.work
Server:     xxxx:xx:xxx:xxxx:xxxx:xxxx:xxxx:xxxx
Address:    yyyy:yy:yyy:yyyy:yyyy:yyyy:yyyy:yyyy#53

Non-authoritative answer:
Name:	grfl.work
Address: xx.xxx.xxx.xxx
```

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/687994/2a0c1819-0272-0f28-910f-544e6e134e8d.png)

- ブラウザにドメイン名を入力して表示すれば完了

# 補足
## 開発環境（FW/ツールのバージョンなど）
|ツール|バージョン|
|:--|:--|
|Vue.js|2.6.14|
|jQuery|3.4.1|
|PHP|7.4.1|
|Laravel|6.20.43|
|MySQL|5.7.36|
|Nginx|1.18.0|
|Composer|2.0.14|
|npm|6.14.6|
|Git|2.33.1|
|Docker|20.10.11|
|docker-compose|v2.2.1|
|PHPUnit|8.0|
|CircleCI|2.1|
|heroku|7.59.4|
|MacBook Air|M1,2020|
|macOS|Monterey 12.3|
|Homebrew|3.3.8|

## ディレクトリ構造
```
【ルートディレクトリ】
├─ .circleci
│   └─ config.yml
├─ aws / CloudFormation
│   └─ ec2.yml
├─ docker
│   └─ mysql
│   └─ nginx
│   └─ php
│   └─ phpmyadmin
├─ src
│   └─ 【Laravelのパッケージ】
└─ docker-compose.yml
```

# Reference
https://www.techpit.jp/courses/11

https://www.techpit.jp/courses/78

https://qiita.com/yuuichimizuta/items/899251a9cb2dd61dabb0

https://qiita.com/yuuichimizuta/items/d56608a21891e4bbc296

https://qiita.com/yuuichimizuta/items/bd335c9af518560ca3d4

https://qiita.com/yyy752/items/0141d150d72a9a185e3f

https://qiita.com/r_saiki/items/bd49b7b7106bb0d85bd6

https://qiita.com/Jerid/items/d5dd3a29ed9a0e374493

https://qiita.com/r_saiki/items/6e8aefead1e2adebc43c

https://qiita.com/kawa-taro/items/5b2a3ca8e51620ac8387

https://qiita.com/yuusuke510/items/9b2e786d4f798a4c9660

https://www.onamae.com/

https://www.onamae.com/guide/p/19

# 次回記事
- 【AWS】LaravelアプリをEC2デプロイ③【ACM / ELB編】

https://qiita.com/kazumakishimoto/items/bdb07c6d4881384f7063

- 【AWS】LaravelアプリをEC2デプロイ④【CircleCI / CodeDeploy編】

https://qiita.com/kazumakishimoto/items/09b84473c44c5899ee57

- 【AWS】LaravelアプリをEC2デプロイ⑤【SNS / Chatbot編】

https://qiita.com/kazumakishimoto/items/b38c34a1275c4e9cd373

- 【AWS】LaravelアプリをEC2デプロイ⑥【S3編】

https://qiita.com/kazumakishimoto/items/d08894711bf59a4e21df

- 【AWS】LaravelアプリをEC2デプロイ⑦【API編】

https://qiita.com/kazumakishimoto/items/fd4afc02f9490ddb89e5

- 【AWS】お役立ちリンク集【随時更新】

https://qiita.com/kazumakishimoto/items/02e53cdf7b9887252040