$ sudo yum update -y
$ sudo yum install tree 
$ sudo ln -sf  /usr/share/zoneinfo/Asia/Tokyo /etc/localtime //タイムゾーンをJSTに変更
$ sudo vi /etc/sysconfig/clock
---
ZONE="Asia/Tokyo"
UTC=false
---
$ cd ~
$ vi .vimrc // Vim設定
---
scriptencoding utf-8
set visualbell
set noerrorbells
set tabstop=4
---

$ sudo yum install java-11-amazon-corretto
$ sudo alternatives --config java
$ java --version

$ sudo python3 -m pip install --upgrade pip
$ git clone https://github.com/pyenv/pyenv.git ~/.pyenv
$ ~/.pyenv/bin/pyenv --version
$ vi ~/.bash_profile
---
export PYENV_ROOT="$HOME/.pyenv"
export PATH="$PYENV_ROOT/bin:$PATH"
if command -v pyenv 1>/dev/null 2>&1; then
  eval "$(pyenv init --path)"
fi
---
$ pyenv install -l | grep 3.8.
$ pyenv install 3.8.12
$ pyenv versions
$ pyenv global 3.8.12

$ source ~/.bashrc
$ curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.1/install.sh | bash
$ nvm ls-remote //nodeバージョン一覧表示
$ nvm install v16.13.1
$ nvm alias default v14.15.4
$ nvm ls-remote
$ node -v
$ cd ~/.nvm
$ git pull origin master //nvmバージョンアップしておきます。
// Nodeインストール
$ vi .bashrc
---
if [ -f ~/.nvm/nvm.sh ];then
        source ~/.nvm/nvm.sh > /dev/null 2>&1
fi
---
$ source ~/.bashrc

$ cd ~
$ npm install -g @vue/cli
$ cd ~/enviroment/
$ vue create vue-serverless-project
$ cd vue-serverless-project
$ npm install aws-amplify aws-amplify-vue
$ npm install -g @aws-amplify/cli
$ aws --version
aws-cli/2.2.25 Python/3.8.8 Linux/4.14.238-182.422.amzn2.x86_64 exe/x86_64.amzn.2 prompt/off
$ sudo pip uninstall awscli -y // AWS CLI（v1）をアンインストール
$ curl "https://awscli.amazonaws.com/awscli-exe-linux-x86_64.zip" -o "awscliv2.zip"
$ unzip awscliv2.zip
$ sudo ./aws/install
$ sudo ln -s /usr/local/bin/aws /usr/bin/aws

// amplify初期設定
$ amplify configure
$ amplify init
Note: It is recommended to run this command from the root of your app directory
? Enter a name for the project <your_project_name>
? Enter a name for the environment <dev>
? Choose your default editor: <None>
? Choose the type of app that you're building <javascript>
? What javascript framework are you using <react>
? Source Directory Path:  <src>
? Distribution Directory Path: <build>
? Build Command:  <npm run-script build>
? Start Command: <npm run-script start>

// 認証追加
$ amplify add auth
Using service: Cognito, provided by: <awscloudformation>
How do you want users to be able to sign in? <Username>
Do you want to configure advanced settings? <No, I am done.>

// S3追加
$ amplify add storage
? Please select from one of the below mentioned services: Content (Images, audio, video, etc.)
? Please provide a friendly name for your resource that will be used to label this category in the project: <default>
? Please provide bucket name: <default>
? Who should have access: <Auth and guest users>
? What kind of access do you want for Authenticated users? <create/update, read>
? What kind of access do you want for Guest users? create/update, read
? Do you want to add a Lambda Trigger for your S3 Bucket? <No>
Auth configuration is required to allow unauthenticated users, but it is not configured properly.
Successfully updated auth resource locally.

// API追加
$ amplify add api 
? Please select from one of the below mentioned services: <GraphQL>
? Provide API name: <your API name>
? Choose the default authorization type for the API API key
? Enter a description for the API key: 
? After how many days from now the API key should expire (1-365): 7
? Do you want to configure advanced settings for the GraphQL API Yes, I want to make some addition
al changes.
? Configure additional auth types? <Yes>
? Choose the additional authorization types you want to configure for the API 
? Configure conflict detection? <No>
? Do you have an annotated GraphQL schema? <No>
? Choose a schema template: <Single object with fields (e.g., “Todo” with ID, name, description)>
? Do you want to edit the schema now? <No>
Successfully added resource gqlimages locally

$ vi ./amplify/backend/api/<your_project_name>/schema.graphql
---
type Product @model {
        id: ID!
        name: String!
        description: String
        price: Int
        image: String
}
---
$ amplify push
? Are you sure you want to continue? <Yes>
? Do you want to generate code for your newly created GraphQL API <Yes>
? Choose the code generation language target <javascript>
? Enter the file name pattern of graphql queries, mutations and subscriptions <src/graphql/**/*.js>
? Do you want to generate/update all possible GraphQL operations - queries, mutations and subscrip
tions Yes
? Enter maximum statement depth [increase from default if your schema is deeply nested] <2>
$ vi ./your_project_name/src/App.vue
---
[How to Build Serverless Vue Applications with AWS Amplify]
(https://medium.com/@dabit3/how-to-build-serverless-vue-applications-with-aws-amplify-67d16c79e9d6)
---
$ vi ./your_project_name/src/App.vue
---
(チュートリアルを参照)
<注意> ESLintのエスケープに、const user = await Auth.currentAuthenticatedUser() // eslint-disable-line　の記述が必要になるケースがあります。原因確認中。
---
$ vi ./your_project_name/src/main.js
---
import Vue from 'vue'
import App from './App.vue'

import Amplify, * as AmplifyModules from 'aws-amplify'; //追加
import { AmplifyPlugin } from 'aws-amplify-vue'; //追加
import aws_exports from './aws-exports'; //追加
Amplify.configure(aws_exports); //追加
Vue.use(AmplifyPlugin, AmplifyModules); //追加

Vue.config.productionTip = false
new Vue({
  render: h => h(App),
}).$mount('#app')                    
---
// webpack-dev-server開発サーバ用設定ファイル
// Cloud9のビューからアクセスする場合、dev:hostにホスト名の指定が必要です。
$ vi vue.config.js 
---
module.exports = {
    devServer:{
        public: process.env["C9_PID"] + ".vfs.cloud9.ap-northeast-1.amazonaws.com"
    }
};
---
$ npm run serve
// cloud9 Preview を開く