AWS and React: Creating Full-Stack Apps

1h 31mAdvanced2024-02-07

Authors

Bear Cahill

Mobile Application Developer

Course details

Web app development implies a lot of potential pieces of software development. You may be an expert on React, JavaScript, and other aspects of the development side, but if you know less about server-side hosting, user authentication, and database storage through an API, this course can help fill in those gaps. Mobile application developer Bear Cahill guides you through the process of creating full-stack apps. Go over the steps involved in hosting a React app on AWS, then dive into user authorization for the app. Explore how to use DynamoDB API with AppSync, as well as using AppSync GraphQL calls with React. Plus, work through hands-on challenges that give you a chance to apply what you learn.

Skills covered

Full-Stack Web DevelopmentAmazon Web Services (AWS)AmazonFront-End Web DevelopmentCloud ServicesProjectCloud PlatformsWeb DevelopmentCloud Computing

Concepts

0. Introduction

01 - Full-stack React development on AWS
02 - What you should know

1. Hosting a React App on AWS

03 - React app concepts
04 - Using npm to create a React app
05 - Editing a React app
06 - AWS S3 hosting with Amplify
07 - Hosting your React app on AWS
08 - Challenge - Host your React app on AWS
09 - Solution - Host your React app on AWS

2. User Authorization for React App

10 - IAM Cognito concepts
11 - Adding user auth to an AWS project
12 - Adding user auth to a React app
13 - Creating users through a React app
14 - Challenge - Add user auth to your React app
15 - Solution - Add user auth to your React app

3. DynamoDB API with AppSync

16 - AppSync concepts
17 - DynamoDB tables
18 - Creating a GraphQL API with Amplify
19 - Testing an AppSync GraphQL API
20 - Challenge - Create and test an AppSync API
21 - Solution - Create and test an AppSync API

4. AppSync GraphQL Calls with React

22 - Adding AppSync GraphQL to a React app
23 - Adding DynamoDB data through a React app
24 - Reading DynamoDB data with a React app
25 - Updating DynamoDB data with a React app
26 - Challenge - Deleting DynamoDB data in your React app
27 - Solution - Deleting DynamoDB data in your React app

Conclusion

28 - Continue learning with Bear's next steps