AWS Cognito [Summary]: User Management Code for React

aws_user_management.js

// config.json

/* -------------------------------------------------------------------- */

//// Setup a user pool here on AWS to get these params:
//// https://aws.amazon.com/cognito/

{
  "cognito" : { 
    "REGION": /* Region */,
    "USER_POOL_ID": /* User Pool ID */,
    "APP_CLIENT_ID": /* Client App ID*/
  }
}

// index.js

//// NOTE: Have a config file in the root directory

//// Imports

import { Auth } from 'aws-amplify';
import config from './config';


//// (Generally somewhere before:)
////
////     ReactDOM.render(
////       <React.StrictMode>
////         <App />
////       </React.StrictMode>,
////       document.getElementById('root')
////     );

Amplify.configure({
  Auth: {
    mandatorySignIn: true,
    region:config.cognito.REGION,
    userPoolId:config.cognito.USER_POOL_ID,
    userPoolWebClientId:config.cognito.APP_CLIENT_ID
  }
});


/* -------------------------------------------------------------------- */

// App.js

//// This is the main entry point into your application

//// Imports

import { Auth } from 'aws-amplify';

//// componentDidMount

//// These will get the session and the current user, update your state accordingly.
//// You can use these to check if the user is logged in or not

const session = await Auth.currentSession();
const user = await Auth.currentAuthenticatedUser();

/* -------------------------------------------------------------------- */

// Login.js

//// This file logins in the user and returns tokens for authentication.

//// Imports

import { Auth } from 'aws-amplify';

//// LoginFunction

//// Sign user in with this function, get username and password from input
//// Will throw errors on incorrect info

const user = await Auth.signIn(username, password);

/* -------------------------------------------------------------------- */

// SignUp.js

//// This file signs up a new user

//// Imports

import { Auth } from 'aws-amplify';

//// SignUpFunction

//// Sign Up user in with this function, get username and password from input
//// Will throw errors for example if user already exists

const signUpResponse = await Auth.signUp({
          username,
          password,
          attributes: {
            {... /* These can be defined in the Cognito setup */ }
          }
        });


/* -------------------------------------------------------------------- */

// ForgotPassword.js

//// This is for when the user clicks forgot password and enters an email

//// Imports

import { Auth } from 'aws-amplify';

//// ForgotPasswordSend

//// Will send forgot password to the selected email
//// Will throw errors for incorrect email addresses etc.

await Auth.forgotPassword(email);

/* -------------------------------------------------------------------- */

// ForgotPasswordCallback.js

//// This is for the callback that users get when they have a token sent to them
//// their email for changing their password

//// Imports

import { Auth } from 'aws-amplify';

//// UpdatePassword

//// This will update the password with the email, code (sent in email), and new password

await Auth.forgotPasswordSubmit(email, code, password);