Getting Started with AWS

Build a Full-Stack React Application

Create a simple web application using AWS Amplify

Module 1: Deploy and Host a React App

In this module, you will create a React application and deploy it to the cloud using the AWS Amplify web hosting service

Overview

AWS Amplify provides a Git-based CI/CD workflow for building, deploying, and hosting single-page web applications or static sites with serverless backends. Upon connecting to a Git repository, Amplify determines the build settings for both the frontend framework and any serverless backend resources configured with the Amplify CLI, and automatically deploys updates with every code commit.

In this module, we will begin by creating a new React application and push it to a GitHub repository. Then, we will connect the repository to AWS Amplify web hosting and deploy it to a globally available content delivery network (CDN) hosted on an amplifyapp.com domain. Next, we will demonstrate continuous deployment capabilities by making changes to the React application and push a new version to the main branch, which will automatically kick off a new deployment.

What you will accomplish

In this module, you will:
  • Create a React application
  • Initialize a GitHub repository
  • Deploy your app with AWS Amplify
  • Implement code changes and redeploy your app

Key concepts

React application – React is a JavaScript web application library that enables developers to quickly build performant single-page applications.

Git – A version control system that allows developers to store files and maintain and update relationships between files and directories, versions, and changes to the files.

 Time to complete

10 minutes

 Services used

Implementation

Conclusion

You have deployed a React application in the AWS Cloud by integrating with GitHub and using AWS Amplify. With AWS Amplify, you can continuously deploy your application in the cloud and host it on a globally available CDN.

Next, we will create a local version of the app to continue development and add new features.

Was this page helpful?

Initialize Local App