aws amplify+nuxt.jsの一から環境構築 in mac

概要

今回はMacOS上でaws amplify+nuxt.jsの一から環境構築していこうと思います。
備忘録ということもあり、わかりにくい部分もあるかもしれません。その際はご指摘頂ければと思います。
今回はAWSのアカウントがある前提で進めていきます。

①Homebrewのインストール

公式にアクセスし、インストールするコマンドを実行

Homebrew公式

% /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install.sh)"

インストール後にソフトウェア・アップデート

正常にインストールされてるかの確認

% brew --version
Homebrew 2.2.15
Homebrew/homebrew-core (git revision 93a12; last commit 2020-05-08)

②AWS CLI バージョン 2 のインストールと設定

インストール

公式を参考にインストールしていきます。
せっかく公式がインストーラを用意してくれてるので、甘えて使っちゃいましょう。
インストーラを起動すると、選択できる項目があると思いますが、今回は全てデフォルトのままインストールします。

# インストールの確認
% aws --version
aws-cli/2.0.12 Python/3.7.4 Darwin/19.4.0 botocore/2.0.0dev16

設定

公式のセキュリティ認証情報へ遷移し、アクセスキー (アクセスキー ID とシークレットアクセスキー)を選択します。新しいアクセスキーの作成ボタンをクリックし、ポップアップで表示されたアクセスキー IDとシークレットキーをコピーします。

# コピーしたアクセスキー IDとシークレットキーを貼り付ける
% aws configure
AWS Access Key ID [None]: アクセスキー ID
AWS Secret Access Key [None]: シークレットキー
# リージョンを選択。今回はオハイオ
Default region name [None]: us-east-2
# "text","json","table"のどれかを指定可能ですが、今回はjson
Default output format [None]: json

備考：AWSアカウントでセキュリティ向上に伴い、多要素認証（MFA）も設定することをお勧めします。

③javaのインストール

※ Amplify Mockingを使うため、OpenJDK 1.8 以降のJavaのランタイムをインストールします。

# 最新バージョンがインストールされます
% brew install openjdk

# シンボリックリンクの作成
sudo ln -sfn /usr/local/opt/openjdk/libexec/openjdk.jdk /Library/Java/JavaVirtualMachines/openjdk.jdk

# バージョンの確認
% java --version
openjdk 13.0.2 2020-01-14
OpenJDK Runtime Environment (build 13.0.2+8)
OpenJDK 64-Bit Server VM (build 13.0.2+8, mixed mode, sharing)

④Node.jsのインストール

Node.js

今回は推奨のNodeバージョンをインストールしたいため、nodebrewをインストールします。
公式にあるLTSバージョンをnodebrewで指定し、インストールします。
公式からインストーラをダウンロードするのもありですが、Nodeのバージョン管理を安易にしたいため、nodebrewを使っていきます。

% brew install nodebrew

# nodebrew用のディレクトリを作成
% mkdir -p ~/.nodebrew/src

# 公式で推奨（LTS）されてるバージョンをインストール
% nodebrew install-binary v12.16.3

# バスを追加
# .zshrcファイルがない場合は作成します。
% echo 'export PATH=$HOME/.nodebrew/node/v12.16.3/bin:$PATH' >> .zshrc

# terminalを再起動し、インストールの確認
% node -v; npm -v
v12.16.3
6.14.4

⑤aws-amplify/cliとnuxt.jsのインストール

% npm install -g @aws-amplify/cli create-nuxt-app@latest

# バージョン確認
% amplify --version; create-nuxt-app --version
4.18.1
create-nuxt-app/2.15.0 darwin-x64 node-v12.16.3

⑥gitのインストール

% brew install git

% git --version
git version 2.23.0