Tutorials
Authentication

Introduction

This guide will help you setup the frontend code to provide authentication to your users.

Prerequisites

Before following this guide, you need to have the backend installed and deployed.

Need help? Ask us on Discord! (You need to purchase the pro plan!↗)

Ask us on Discord

Retrieve data from AWS Cognito

  1. Connect to your AWS account and go to the Cognito Dashboard (opens in a new tab).
  2. Select the boilerpro-cognito user pool.
  3. Copy the User Pool ID in your .env file under NEXT_PUBLIC_COGNITO_USER_POOL_ID.
  4. Go to the App Integration section and copy the Cognito domain in your .env file under NEXT_PUBLIC_COGNITO_DOMAIN
  5. Go to the App Integration section and select the boilerpro-frontend client.
  6. Copy the Client ID in your .env file under NEXT_PUBLIC_APP_CLIENT_ID
  7. Go back to the App Integration section and select the boilerpro-frontend-secret-client client.
  8. Copy the Client ID and Client Secret in your .env file under APP_CLIENT_ID and APP_CLIENT_SECRET.
.env
APP_CLIENT_ID=<your_client_id>
APP_CLIENT_SECRET=<your_client_secret>
NEXT_PUBLIC_COGNITO_DOMAIN=<your_cognito_domain>
NEXT_PUBLIC_APP_CLIENT_ID=<your_client_id>
NEXT_PUBLIC_COGNITO_USER_POOL_ID=<your_userpool_id>

Add Authorized Javascript Origins on Google Cloud

  1. Go to the Google Cloud Console (https://console.cloud.google.com/ (opens in a new tab)) and open your project.
  2. Go to Credentials and add <your_cognito_domain> as an Authorized Javascript domain.
  3. Go to Authorized URI redirect and add <your_cognito_domain>/oauth2/idpresponse