Note: this auth starter was adopted from the original starter by dabit3.
This auth starter implements a basic authentication flow for signing up signing in users as well as protected client side routing using AWS Amplify. Auth features:
- User sign up
- User sign in
- Multi-factor Authentication
- User sign-out
- Password Reset
- Error Feedback
- Create the project
gatsby new new-auth-site https://github.com/ben-siewert/gatsby-starter-auth-aws-amplify- Change into the new directory
cd new-auth-site- Install dependencies
yarn
# or
npm install- Install & configure the AWS Amplify CLI.
npm install -g @aws-amplify/cli
amplify configure- Create a new AWS Amplify Project
amplify init
Here, walk through the following steps:
- Enter a name for the project YOURPROJECTNAME
- Enter a name for the environment master
- Choose your default editor: Visual Studio Code (or your editor of choice)
- Choose the type of app that you're building javascript
- What javascript framework are you using react
- Source Directory Path: src
- Distribution Directory Path: public
- Build Command: npm run build
- Start Command: npm run dev
The CLI will then initialize a project in the cloud.
- Add Auth to the Ampliy project it will configure a CloudFormation template that has an Amazon Cognito resource that enables user authentication.
amplify add authHere, walk through the following steps:
- Default configuration: (recommended)
- How do you want users to be able to sign in?: recommended: (Email) or (Email and Phone Number)
- Do you want to configure advanced settings?: recommended: (NO, I am done.) or (Yes, I want to make some additional changes)
- Finally, Push the updated project configuration to AWS. It will deploy a CloudFormation template that has an Amazon Cognito resource that enables user authentication.
amplify push- Then you can run it by:
gatsby develop