Cognito Demo UI screenshot

Cognito Demo UI

Author Avatar Theme by Arronharden
Updated: 14 Aug 2019
50 Stars

Example React based UI for my medium.com article on using the AWS Cognito built in sign-in and sign-up content. Demonstrates a React router implementation of the callback endpoint, a Redux based credential store, as well as use of the AWS provided libraries.

Overview

This application showcases a seamless integration of AWS Cognito’s hosted sign-in and sign-up UI with a React application built using the create-react-app script. By employing this solution, developers can leverage built-in authentication features of AWS Cognito to streamline user management in their applications. Whether you are new to React or looking to enhance your project’s authentication functionalities, this setup presents a solid foundation.

With a straightforward setup process involving configuration changes and dependency installation, developers can get up and running quickly. The app not only demonstrates user authentication processes but also integrates with a JWT secured REST API, making it an excellent resource for those looking to implement robust security in their applications.

Features

  • Easy Integration: The app utilizes AWS Cognito’s built-in UI, allowing for quick authentication setup without custom UI coding.
  • Configurable: Users can easily modify the src/config/app-config.json file to align with their specific user pool and application URLs.
  • Local Development: You can run the application locally with simple configurations for signout and callback URIs, facilitating easy testing.
  • JWT Authentication: The application showcases how to use JWT access tokens for secure API calls, ensuring your backend remains protected.
  • REST API Interaction: Demonstrates invoking a simple example REST API using the retrieved JWT access code, perfect for those interested in full-stack development.
  • Open Source Repository: Access to the source code and API implementation is available for further exploration and customization, enhancing learning opportunities.