This content originally appeared on DEV Community and was authored by Sharvesh Waran
STEP 1: Check node and npm is already installed in your system,if not install them.
STEP 2: Initialize a new project with the Vite build tool,Enter your project name.
STEP 3: Select a framework "REACT".
STEP 4: Select a Variant "TYPESCRIPT".
STEP 5: Now run the above three commands one by one.
STEP 6: Check localhost:5173
STEP 7: Now our react application is created successfully!
STEP 8: Open the project in vs code,then run the command "npm run build".This command compiles and bundles your source code and placed in a directory "dist\".
STEP 9: Now want to create a bucket with unique name.
STEP 10: Now enable the static web hosting.
STEP 11: Now want to add bucket policy.
STEP 12: Now upload the files and folders from the dist folder in your bucket.
STEP 13: Then go to properties,scroll down,you can find bucket website endpoint,then click it.
STEP 14: Our React application is hosted using S3.
STEP 15: Now create a cloudfront distribution for hosting a react Application.
STEP 16: Copy the distribution domain name and paste it in a new tab.Now we can see the same result.
STEP 17: And finally delete the cloudfront distribution.
This content originally appeared on DEV Community and was authored by Sharvesh Waran
Sharvesh Waran | Sciencx (2025-01-26T04:43:12+00:00) Hosting React Application Using S3 and Cloudfront. Retrieved from https://www.scien.cx/2025/01/26/hosting-react-application-using-s3-and-cloudfront/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.