React + Amplify やってみようとして挫折した

React + Amplify やってみようとして挫折した

Win10 + WSLにUbuntu済み状態でこうなってる

sh3eys@DESKTOP-VUKTP3T:~$ node -v
v12.16.3
sh3eys@DESKTOP-VUKTP3T:~$ npm -v
6.14.4

npmとyarnを準備する
yarn使ったことなかったからここが助かった Ubuntu 18.04 に yarn をインストールする | Lonely Mobiler

sh3eys@DESKTOP-VUKTP3T:~$ npm install -g npm
/home/sh3eys/.nodebrew/node/v12.16.3/bin/npm -> /home/sh3eys/.nodebrew/node/v12.16.3/lib/node_modules/npm/bin/npm-cli.js
/home/sh3eys/.nodebrew/node/v12.16.3/bin/npx -> /home/sh3eys/.nodebrew/node/v12.16.3/lib/node_modules/npm/bin/npx-cli.js
+ npm@6.14.8
added 17 packages from 3 contributors, removed 18 packages and updated 25 packages in 15.608s

sh3eys@DESKTOP-VUKTP3T:~$ npm install -g create-react-app
/home/sh3eys/.nodebrew/node/v12.16.3/bin/create-react-app -> /home/sh3eys/.nodebrew/node/v12.16.3/lib/node_modules/create-react-app/index.js
+ create-react-app@4.0.0
added 91 packages from 46 contributors in 9.826s

sh3eys@DESKTOP-VUKTP3T:~$ npm install -g @aws-amplify/cli

$ curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
OK
$ echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/a
pt/sources.list.d/yarn.list
deb https://dl.yarnpkg.com/debian/ stable main
$ sudo apt-get update && sudo apt-get install yarn

amplifyのAWSアカウントの方も準備しとく

ここの手順どおりにやるだけ
https://qiita.com/Junpei_Takagi/items/f2bc567761880471fd54

この記事どおりにやってみただけなんだけど
【爆速】React+Amplify+AppSyncでリアルタイム掲示板アプリを15分で作り上げる 〜これが最高のDeveloper Experienceだ〜 - Qiita

WSLのUbuntu上からたたいてもyarn startでちゃんと見えるってのはへえと思った

「とりあえず初めの一歩としてApp.jsに一覧表示機能を追加していきます。」
ここでできなかった。amplify initでtypeにPostってできなかったからそこだと思うそこからやり直せばいけるだろうけど
yarn startして起動してlocalhost:3000でこうなっちゃう

Failed to compile
./src/App.js
Attempted import error: 'listPosts' is not exported from './graphql/queries'.
This error occurred during the build time and cannot be dismissed.

ちなみにPostでなくdefaultままEnterすすめちゃうと ./src/graphql/queries.js こうなる まあlistPosts無いよってエラー出てるのそりゃそうだよなっていう

sh3eys@DESKTOP-VUKTP3T:~/git/amp-test/boardapp$ cat src/graphql/queries.js
/* eslint-disable */
// this is an auto generated file. This will be overwritten

export const getTodo = /* GraphQL */ `
  query GetTodo($id: ID!) {
    getTodo(id: $id) {
      id
      name
      description
      createdAt
      updatedAt
    }
  }
`;
export const listTodos = /* GraphQL */ `
  query ListTodos(
    $filter: ModelTodoFilterInput
    $limit: Int
    $nextToken: String
  ) {
    listTodos(filter: $filter, limit: $limit, nextToken: $nextToken) {
      items {
        id
        name
        description
        createdAt
        updatedAt
      }
      nextToken
    }
  }
`;

しかしここまでやって全然15分どころか2h以上かかってるし無理
そもそもスケーリング全く不要ってひとにとってAmplifyとかFirebaseって必要ないよなって疑問がわいてくる
ベンチャーとか個人で事業やっててフルスタックで高給取りのひと以外にニーズあるのか?これ本当に、、

なんならホスティングすらして欲しいって気持ちも無い。docker-composeで環境作る方が圧倒的に楽

いやAWSはとにかく全停止するのが大変すぎるし無駄。無料枠で頑張って学習するっていうハードルが高い
失敗したときに金がかかりすぎるし一般人が気軽に試せるもんじゃない
AWS自体クレカ登録必須だしさらにデビッド型のVISA/Masterみたいなんだと登録できないしっていう

後片付けの「全てのリソースを止める」ってのもよくわかんなくって
amplifyコンソールが案内してきたCLIコマンド一発目で詰む。environmentを変えろと言うけどdev以外無いんだよっていう

sh3eys@DESKTOP-VUKTP3T:~/git/amp-test/boardapp$ amplify env remove dev
You cannot delete your current environment. Please switch to another environment to delete your current environment
If this is your only environment you can use the 'amplify delete' command to delete your project
? Are you sure you want to continue? This CANNOT be undone. (This would delete 'dev' environment of the project from the
 cloud) (y/N)

sh3eys@DESKTOP-VUKTP3T:~/git/amp-test/boardapp$ amplify env list

| Environments |
| ------------ |
| *dev         |

まあエラーメッセージにあるけど結局こうやってamplifyのプロジェクト(?)いったん全部消した

amplify delete

リソースを全て停止する為の統合コンソールが存在しないっていうの悪ど過ぎると思うの俺だけか?これ、、

それから念のためにアラート設定もする
Amazon AWS に登録する・1円も課金したくないので請求アラームも設定する - Corredor
なんかむしろこっちの方がメインな感じしてくるアホくさくなってきたわ(まあ俺が無能過ぎるってだけなんだろうな、、)