This guide explains how to deploy a React app using S3 for hosting, DynamoDB for database, and Lambda + API Gateway for backend API.

git clone <this-repo-url> cd <project-folder>

npm install npm start

Verify it runs successfully at http://localhost:3000.

1. Go to AWS Console → S3 → Create Bucket
2. Enter a unique bucket name
3. Unselect Block all public access
4. Select I acknowledge... warning
5. Click Create bucket

1. Open your bucket

2. Go to Properties

3. Scroll to Static website hosting → Enable

4. Enter:

   • Index document: index.html

5. Save changes

Build the React project:

npm run build

Sync build folder to S3: . make sure your terminal is at your current folder path

aws s3 sync build/ s3://<your-bucket-name>

1. Go to AWS Console → DynamoDB → Create table

2. Enter:

   • Table name: yourtable
   • Partition key: id (Number)

3. After table creation → click Create item and paste:

{ "id": { "N": "102" }, "age": { "N": "100" }, "email": { "S": "yourname@example.com" }, "name": { "S": "My Name" }, "phone": { "N": "03001234567" }, "salary": { "N": "0" } }

1. Go to AWS Console → Lambda → Create Function

2. Select:

   • Runtime: Node.js
   • Function name: GetUsers

3. Paste code:

import { DynamoDBClient } from "@aws-sdk/client-dynamodb"; import { ScanCommand, DynamoDBDocumentClient } from "@aws-sdk/lib-dynamodb"; const client = new DynamoDBClient({ region: "us-east-1" }); const docClient = DynamoDBDocumentClient.from(client); const params = { TableName: "yourtable" }; async function getDynamoDBItem() { try { const data = await docClient.send(new ScanCommand(params)); return data; } catch (error) { console.log(error); return error; } } export const handler = async (event, context) => { try { const data = await getDynamoDBItem(); return { body: JSON.stringify(data) }; } catch (error) { console.log(error); return error; } };

4. Deploy and Test the function.

1. Go to API Gateway → Create API
2. Create Resource and add Method → GET
3. Attach your lambda function to api gateway.
4. Enable CORS
5. Deploy API → create a new stage
6. Copy the Invoke URL

In your React project, update src/component/user with the API_URL from API Gateway.

npm run build aws s3 sync build/ s3://<your-bucket-name>

1. Go to S3 → Your Bucket → Properties
2. Scroll to Static website hosting
3. Copy the Bucket website endpoint
4. Open it in your browser 🎉

You can check out the live app (hosted on AWS Free Tier) before it expires:

Live Demo