Build a Full Stack React Application
|
AWS experience |
Beginner |
|
Time to complete |
30 minutes |
|
Cost to complete |
Free Tier |
|
Services used |
|
|
Last updated |
July 25, 2024 |
Overview
In this tutorial, you will learn how to create a simple full-stack web application using AWS Amplify. Amplify offers a Git-based CI/CD workflow for building, deploying, and hosting single-page web applications or static sites with serverless backends.
What you will accomplish
In this tutorial, you will:
-
Build and host a React application on AWS
-
Use Amplify to add authentication, data & storage solutions to the app
-
Start a cloud sandbox environment that provides an isolated development space to rapidly build, test, and iterate on a fullstack app
-
Implement the frontend code to enable users to create, update, and delete notes
Prerequisites
Before starting this tutorial, verify that you have the following prerequisites completed:
-
An AWS account: If you don't already have one, follow the Setup Your Environment tutorial.
-
Configured your AWS profile for local development
. -
Familiarity with git and a GitHub
account.
Tasks
This tutorial is divided into four tasks. You must complete each task in order before moving to the next one.
-
Task 1: Deploy and Host a React App (10 minutes): Create a React app, then deploy and host it using AWS Amplify.
-
Task 2: Initialize a Local Amplify App (10 minutes): Initialize a cloud backend that include authentication, a database, and storage.
-
Task 3: Build the Frontend (10 minutes): Implement the frontend code to connect to the authorization, data and storage backend enabling users to create, update, and delete notes.
-
Task 4: Clean up resources (2 minutes): Clean up the resources used in this tutorial.
