How to Deploy a React App to an AWS S3 Bucket
Introduction If you’ve read my previous posts on AWS S3, you already know that S3 is great for file storage. But here is a cool tip: since frontend projects (like React, Angular, or Vue) build into static files, we can host them on S3 and use them just like a regular website! In this post, I’ll show you how to deploy a React app to S3 for direct access, as well as how to set it up using CloudFront. Prerequisites Before we start, you should have a basic understanding of AWS S3, how to set up the AWS CDK, and how to create a Bucket. Implementation First, let's create a simple React project using Vite with two pages: Home and About. Feel free to use your own content! App.tsx import { BrowserRouter as Router , Routes , Route , Link } from 'react-router-dom' ; import Home from './page/Home' ; import About from './page/About' ; function App () { return ( < Router > < nav style = { { padding: '10px' , borderBottom: '...