Build a Full Stack React Application

TUTORIAL

Introduction: Build a Full Stack React Application

Follow step-by-step instructions to create a simple full-stack web application

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:

 AWS experience

Beginner

 Time to complete

30 minutes

 Cost to complete

Free Tier eligible

 Requires

*Accounts created within the past 24 hours might not yet have access to the services required for this tutorial.

 Services used

 Last updated

July 25, 2024

Tasks

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

  1. Deploy and Host a React App (10 minutes): Create a React app, then deploy and host it using AWS Amplify.
  2. Initialize the Amplify Backend (10 minutes): Initialize a cloud backend that include authentication, a database, and storage.
  3. Connect the App to the Cloud backend (10 minutes): Implement the frontend code to connect to the authorization, data and storage backend enabling users to create, update, and delete notes.
  4. Clean up Resources (2 minutes): Clean up the resources used in this tutorial.

Was this page helpful?

Deploy and Host a React App