How to host a React Application on AWS S3

Learn how to deploy and host a React Application on AWS S3. There are many ways to host a static website in the public cloud on AWS and in this video we take a look at how to use an S3 bucket for this. You'll learn how to change the bucket permission and how to manually upload the application. After that we look at how you can automate this process by using the AWS CLI to sync the folders.
Resources:
How to deploy React to AWS Amplify: • How to deploy a React ...
S3 Policy (replace name of bucket with your bucket name):
{
"Version": "2012-10-17",
"Statement": [
{
"Sid": "AllowPublicReadAccess",
"Effect": "Allow",
"Principal": "*",
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::NameOFBucket/*"
}
]
}
-----
Website: andredevries.dev/
Twitter: / andre347_
Github: github.com/and...

[@kasirbarati3336]

Thanks for the short and concise video, just one critical point. You just used a prewritten json file in policies and did not mention how you can create it or what each part means. That was really bothering me since for a guy who is watching this video that is as crucial as the rest of the video if not more.

[@TheHunter2]

how to make it work with react router? If I try to access a url directly it doesn't work...

[@karlang2637]

Under property of bucket, scroll all the way down until you see static hosting, click edit. You will see a field asking which HTML file to serve when error; enter index.html or the main HTML that your build serves

[@andyoee]

How do you include git (branch) in your zsh profile?

[@androidgeeking]

Do you need to set a url on the react app?

[@xXHelsingGamingXx]

is there a way to make it auto deployable?

[@muhammadsalman5318]

the build folder doesn't gets uploaded automatically, so you need to re run "build" everytime you think your website is in final state. and when you are running build, just run deploy as well.

[@felipedelima123]

It is possible to turn into a https website?

[@pizzaguyaz]

Good question. Bet it's tricky to get end to end encryption. Maye through cloudflare.

[@michaelmora6545]

you should be able to configure cloudfront in front of it.

[@felipedelima123]

​@@michaelmora6545 Thanks for the answer, It really was it, only through S3 is not possible.

[@tofsjonas]

How do I get rid of the index.html at the end of the url? If I try without it I get an error message 😢

[@tofsjonas]

Only now I don't get an error message any more 😊🥳

[@TheHunter2]

@@tofsjonas so, what did you do to solve it?

[@tofsjonas]

@@TheHunter2 Er, I don't quite remember. I _think_ I waited a while and then it just started working. There were a few hoops to jump thru to enable RouterBrowser, but with HashBrowser I think it just worked..

[@nicolasportu]

Not working anymore. Update please :)

[@ThatSneakyBeaver]

Do you just need to use the builder folder?

[@simranbanwait]

yes