How to Deploy a React App to AWS: A Simple Step-by-Step Guide

Deploying a React app to AWS is easier than you might think. With Amazon S3 and CloudFront, you can host a fast, reliable static site in minutes. This tutorial covers the essential steps to get your app live.

Before you begin, ensure your project builds successfully in a local environment. AWS only serves static files, so your app must be compiled into plain HTML, CSS, and JavaScript first.

Build Your React App

Start by creating a production-ready bundle.

• Open a terminal in your project directory.
• Run npm run build.
• Locate the output folder: build/ (Create React App) or dist/ (Vite).

Create an S3 Bucket and Upload Files

S3 stores your static assets and serves them as a website.

• Go to S3 in the AWS Console and create a new bucket (enable public access).
• In the bucket’s Properties tab, enable “Static website hosting”.
• Upload the entire build/ folder contents to the bucket.
• Add a bucket policy to allow public s3:GetObject access.

Speed Up with CloudFront

CloudFront is optional but highly recommended for HTTPS and global performance.

• Create a new CloudFront distribution.
• Set your S3 bucket endpoint as the origin.
• Use the distribution domain to access your app with HTTPS and CDN caching.

Conclusion

That’s it — your React app is now live on AWS. For future updates, simply rebuild and upload the new files, or automate the process with AWS Amplify or a CI/CD pipeline. Hosting on S3 is cost-effective and scales automatically with your traffic.