aws amplifyチュートリアル触る

とはなん

aws.amazon.com

チュートリアル

https://docs.amplify.aws/start/getting-started/installation/q/integration/reactdocs.amplify.aws

環境

GAMA@GAMANS-AM MINGW64 /d
$ git --version
git version 2.20.1.windows.1

GAMA@GAMANS-AM MINGW64 /d
$ node -v
v14.17.0

GAMA@GAMANS-AM MINGW64 /d
$ npm -v
6.14.13

すすめる

$amplify init

cli.json
project-config.json
backend-condfig.json
tags.json

amplify/team-provider-info.json
各リソースのARNなどが記載されてる

amplify/team-provider-info.json git管理外にしておいたほうがよさそう
Security best practices for Amplify app in a public repo · Issue #1779 · aws-amplify/amplify-cli · GitHub

はまった
https://docs.amplify.aws/start/getting-started/data-model/q/integration/react#connect-frontend-to-api

Module not found: Can't resolve './graphql/mutations'

npm start

PS D:\workspace\node\react-box> npm start   
npm WARN lifecycle The node binary used for scripts is C:\Program Files (x86)\Nodist\bin\node.exe but npm is using C:\Program Files (x86)\Nodist\v-x64\14.17.0\node.exe itself. Use the `--scripts-prepend-node-path` option to include the path for the node binary npm was executed with.

> react-box@0.1.0 start D:\workspace\node\react-box
> react-scripts start

We detected TypeScript in your project (src\API.ts) and created a tsconfig.json file for you.

It looks like you're trying to use TypeScript but do not have typescript installed.
Please install typescript by running npm install typescript.
If you are not trying to use TypeScript, please remove the tsconfig.json file from your package root (and any TypeScript files).

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! react-box@0.1.0 start: `react-scripts start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the react-box@0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\GAMA\AppData\Roaming\npm-cache\_logs\2021-06-06T10_54_01_486Z-debug.log

あー、、、
create-react-appをjsで作ってしまって、GraphQLをtsで作ってしまったからか、

npm install -save--dev typescript @types/react @types/node

いったんインストールしてみる。

いけたっぽい

f:id:gamaspecial:20210606195841p:plain

つづきをすすめる。

publish

おおー、

Compiled successfully.

File sizes after gzip:

  361.21 KB  build\static\js\2.03a7f31b.chunk.js
  1.66 KB    build\static\js\main.5e5da87c.chunk.js
  1.63 KB    build\static\js\3.2006b407.chunk.js
  1.17 KB    build\static\js\runtime-main.cb997d53.js
  278 B      build\static\css\main.6dea0f05.chunk.css

The project was built assuming it is hosted at /.
You can control this with the homepage field in your package.json.

The build folder is ready to be deployed.
You may serve it with a static server:

  npm install -g serve
  serve -s build

Find out more about deployment here:

  https://cra.link/deployment

√ Zipping artifacts completed.
√ Deployment complete!
https://dev.d2f3uckncyo6py.amplifyapp.com

https://dev.d2f3uckncyo6py.amplifyapp.com

https://docs.amplify.aws/start/getting-started/nextsteps/q/integration/reactdocs.amplify.awsa