Gatsby Auth starter with AWS Amplify

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

Gatsby Amplify

Deploy to the Amplify console

Click the button to deploy a fullstack app in your AWS account:


You can now continuously deploy changes to your frontend or backend and Amplify Console will automatically deploy those changes.

Amplify Console

Run locally

  1. Create the project
gatsby new gatsby-amplify-auth
  1. Change into the new directory
cd gatsby-amplify-auth
  1. Install dependencies
# or
npm install
  1. Install & configure the AWS Amplify CLI.
npm install -g @aws-amplify/cli

amplify configure

To see a video of how to configure the CLI, click here

  1. 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-script build
  • Start Command: npm run-script develop
  1. 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
  1. Then you can run it by:
    gatsby develop

Gatsby Auth Starter Aws Amplify

Starter Project with Authentication with Gatsby & AWS Amplify

Gatsby Auth Starter Aws Amplify Info

⭐ Stars 313
🔗 Source Code
🕒 Last Update 13 days ago
🕒 Created 3 years ago
🐞 Open Issues 13
➗ Star-Issue Ratio 24
😎 Author dabit3