AWS Project–Building a React App with Amplify (Gen 1), Cognito, and CI/CD with GitHub | AWS Tutorial

Published: 27 March 2024
on channel: Tiny Technical Tutorials
26,539
784

In this hands-on tutorial, I’ll show you how to build a simple React app (a quiz app) using AWS Amplify and Cognito. We’ll also see how to set up continuous integration and continuous deployment (CI/CD) using GitHub. By the time you’re done, you’ll have a fully-functioning application you can share with the world, on a real-live Amplify URL.

🌟🌟 GitHub repo for code and commands: https://github.com/tinytechnicaltutor...

🤓 For diagramming and checklists in this video, I used Eraser.io. Check them out! https://www.eraser.io/
🤓 For another fun project that uses Cognito, Amplify, Lambda, API Gateway and DynamoDB, check out this other video:    • AWS Portfolio Project: Build an End-t...  

🌟***MY AWS COURSES***🌟
If you’re interested in getting AWS certifications, check out these full courses. They include lots of hands-on demos, quizzes and full practice exams. Use FRIENDS10 for a 10% discount!
• AWS Certified Cloud Practitioner: https://academy.zerotomastery.io/a/af...
• AWS Certified Solutions Architect Associate: https://academy.zerotomastery.io/a/af...

🌟***TIMESTAMPS***🌟
00:00 – Previewing the completed React app that uses Amplify and Cognito
00:28 – How much will this cost?
02:16 – Setting up our to-do checklist and diagram in Eraser.io
03:23 – Setting up the environment and installing the Amplify CLI
03:35 – The GitHub repo to get all the code and commands for this video
03:58 – Using the amplify configure command with the Amplify CLI
06:16 – Creating the access key ID and secret access key for amplify-dev IAM user
07:56 – Creating a new React app from VS Code
08:30 – Using the amplify init command to initialize the Amplify project
10:49 – Adding authentication to the React app using Cognito
12:31 – Validating the Cognito user pool was successfully created
12:52 – Adding the aws-amplify/ui-react libraries for the Cognito sign-in UI
14:02 – Running the React app to register for an account and log in using Cognito
15:37 – Reviewing the code that enables Cognito authentication from the React app
16:47 – Adding functionality and styling for the quiz
18:40 – Create a new GitHub repository and push local code to it
22:20 – Setting up Amplify hosting and CI/CI from GitHub
24:51 – Creatin a new service role for Amplify Hosting
26:24 – Testing our final React application hosted in Amplify
26:56 – Testing continuous integration continuous deployment (CI/CD) with a GitHub commit
29:04 – IMPORTANT! Deleting your resources


Watch video AWS Project–Building a React App with Amplify (Gen 1), Cognito, and CI/CD with GitHub | AWS Tutorial online without registration, duration hours minute second in high quality. This video was added by user Tiny Technical Tutorials 27 March 2024, don't forget to share it with your friends and acquaintances, it has been viewed on our site 26,539 once and liked it 784 people.