Skip to content
Starter Project with Authentication with Gatsby & AWS Amplify
JavaScript CSS
Branch: master
Clone or download
Pull request Compare This branch is even with dabit3:master.
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

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. Change into the new directory
# 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
You can’t perform that action at this time.