DEV Community

Lester
Lester

Posted on • Updated on

AWS Amplify Gen2 Authentication

Some times the guides does not help much and something is missing to make thinks work. In this case, this guide will help setting up a new project in AWS Amplify with Cognito Authentication.

There we go with the required steps:

  1. Create a GitHub or CodeCommit repo.
  2. Create a React App, in my case I'm using Vite.
npm create vite@latest my-app-name
npm install    
Enter fullscreen mode Exit fullscreen mode
  1. Add amplify to the new React app
npm create amplify@latest
Enter fullscreen mode Exit fullscreen mode
  1. Commit the changes to master/main branch

  2. Create Amplify app in the AWS Console, select your repository and the master/main branch.

  3. Once the deployment has been completed, download the file amplify_outputs.json and put it on the root of your project.

  4. Add the authentication component, it can be found here: https://docs.amplify.aws/react/build-a-backend/auth/set-up-auth/

And that's it, now you can use Cognito authentication in your React app. I spent some time struggling with backend deployment on Amplify but it was because I didn't follow the correct order on this steps, we need first to add the Amplify files (step 3) and then deploy the app (step 5), otherwise the backend deployment will not be there.

See you in a next post!

Top comments (0)