Build a Full Stack React Application - Build a Full Stack React Application

Build a Full Stack React Application

AWS experience

Beginner

Time to complete

30 minutes

Cost to complete

Free Tier eligible

Services used

AWS Amplify

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:

Tasks

This tutorial is divided into four tasks. You must complete each task in order before moving to the next one.

  1. Task 1: Deploy and Host a React App (10 minutes): Create a React app, then deploy and host it using AWS Amplify.

  2. Task 2: Initialize a Local Amplify App (10 minutes): Initialize a cloud backend that include authentication, a database, and storage.

  3. 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.

  4. Task 4: Clean up resources (2 minutes): Clean up the resources used in this tutorial.