Here are my notes on creating a react app in amplify following the steps here: https://aws-amplify.github.io/docs/js/react
To make this interesting I have started with an AWS user that has zero access rights. Rights will be added as needed. I am developing this on a mac.
Started with installing the amplify cli.
npm install -g @aws-amplify/cli
This starts with 5 warnings:
npm WARN deprecated circular-json@0.3.3: CircularJSON is in maintenance only, flatted is its successor.
npm WARN deprecated kleur@2.0.2: Please upgrade to kleur@3 or migrate to ‘ansi-colors’ if you prefer the old syntax. Visit <https://github.com/lukeed/kleur/releases/tag/v3.0.0\> for migration path(s).
npm WARN deprecated minimatch@2.0.10: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
node-pre-gyp WARN Using request for node-pre-gyp https download
npm WARN graphql-import@0.4.5 requires a peer of graphql@^0.11.0 || ^0.12.0 || ^0.13.0 but none is installed. You must install peer dependencies yourself.
I now have @aws-amplify/cli@1.1.7 installed.
Step 2 configure:
This fails with:
SyntaxError: Unexpected token ...
at createScript (vm.js:74:10)
at Object.runInThisContext (vm.js:116:10)
at Module._compile (module.js:533:28)
at Object.Module._extensions..js (module.js:580:10)
at Module.load (module.js:503:32)
at tryModuleLoad (module.js:466:12)
at Function.Module._load (module.js:458:3)
at Module.require (module.js:513:17)
at require (internal/module.js:11:18)
nvm reveals that I am using node 8.0.0
Now move node up to the current lts version (10.15.3), repeat the cli install (same as before), now onto the configure:
This time it prompts me to login to aws and create a new user.
Apparently the minimum access rights are: AdministratorAccess
The user has been created and the access key stored in a profile.
Now I need to ensure that create-react-app is installed (javascript is very fashion conscious and all the cool kids now use yarn):
yarn global add create-react-app
Now working on the amplify init
Here I get prompted for a name (matching the app helps).
Also:
Environment (dev)
Preferred editor (VS Code)
Type of app (javascript).
Framework: (react).
There are several others here but the defaults work fine.
It then prompts you for a profile to use then starts doing the aws magic.
This creates all of the local config without yet pushing it to the cloud.
The next command is:
There are 2 options here: dev using http and prod using https.
For now I am going for dev and followed the defaults.
The following will deploy the app:
This will create the application in s3 and configure cloudformation infront of it.
My trivial app is now deployed.
Next step is to add authentication.
amplify add auth
amplify push
yarn add aws-amplify aws-amplify-react
I have added in the required boilerplate code then called: amplify publish
Testing creating an account hits one of my pet hates: invisible limits on password entry systems. The default cognito password rules require one Capital and one Symbol (already included lowercase and numbers).
The next trick will be to learn how to configure the join, login screens and verification codes – but this is outside the scope of this exercise.
To avoid leaving you with amazon bills there is the option of:
Mischief Managed.