AWS EC2にReactデプロイ環境を作成

背景

仕事でAWS EC2に環境作成する機会があったので作業の流れと参考にした記事のまとめ
プロキシ設定以外は通常のLinuxサーバーに構築するのと一緒

前提

• Reactプロジェクトは作成済み
• EC2インスタンスに接続する認証設定は省略
  ※PEMでSSL認証をしていたが手順をメモっていなかった・・・
• ReactはEC2インスタンスにDockerをインストールしてDocker上で動かす。
• とりあえず動かしたい人向け。

ローカル：EC2インスタンスにSSH接続

作業はEC2インスタンスで行うのでローカル環境からSSH接続

$ ssh -i {pemがあればファイルパスを指定} {ユーザ名}@{IPアドレス}
#例
$ ssh -i C:\corp\hoge.pem ec2-hoge@10.219.1.1

後々サーバー上のファイル操作もするので、VSCodeの拡張機能「Remote SSH」で接続するのが楽

SSH：Linuxプロキシ設定

Linuxのプロキシ設定を行う。
下記の記事を参考に「全体設定、yum」の設定を行う。

SSH：Dockerインストール

参考記事
https://kacfg.com/aws-ec2-docker/

• Dockerインストール

$ sudo yum update -y
$ sudo yum install -y docker

• Dockerサービス起動

$ sudo systemctl start docker
$ systemctl status docker

• Dockerサービス自動起動

$ sudo systemctl enable docker
$ systemctl is-enabled docker

• dockerプロキシ設定

「http'」は「http:」の誤記

aptを使わないなら下記は設定不要

docker 内で apt を使う設定

gitインストール

プロジェクトをサーバーに配置するのにgitを利用
scp等でファイル転送するなら不要な手順

• gitプロキシ設定

$ git config --global http.proxy http://hogehoge.co.jp
$ git config --global https.proxy http://hogehoge.co.jp
$ git config --global http.sslVerify false

SSH：アプリケーションサーバー設定

• プロジェクトフォルダ作成

$ sudo mkdir /home/hogeprj
$ sudo chmod 777 /home/hogeprj

• プロジェクト作成
  gitからプロジェクトclone。（ファイル転送でもいい）

$ git clone {url}

• Unitファイルを作成
  プロジェクトをサービス化するためUnitファイルを作成

/etc/systemd/system/hogeprj-test.service

[Unit]
Description=hogeprj-test
After=docker.service
Requires=docker.service

[Service]
Type=simple
ExecStart=/usr/bin/docker-compose -f /home/hogeprj/docker-compose.yml up
ExecStop=/usr/bin/docker-compose -f /home/hogeprj/docker-compose.yml down

[Install]
WantedBy=multi-user.target

※VSCodeでSSH接続すると直接ファイル編集できて楽

#ユニットファイルをコピー
$sudo cp hogeprj-test.service /etc/systemd/system/
#自動認識されるはずなので確認
$sudo systemctl list-unit-files --type=service | grep hogeprj-test
#自動起動できるようにenable
$sudo systemctl enable hogeprj-test

+ サービス起動テスト
$sudo systemctl start hogeprj-test
$sudo systemctl status hogeprj-test

+ サービス停止テスト
$sudo systemctl stop hogeprj-test
$sudo systemctl status hogeprj-test