search

ActoKids / AD440_W19_CloudPracticum

3 stars 1 forks source link

Research Server Option: S3 #9

Closed coultergeist closed 5 years ago

coultergeist commented 5 years ago

Yahya: Research the feasibility for the AWS S3 server option

Estimated Time: Actual Time:

yahya09206 commented 5 years ago

I am looking into using AWS' S3 server option for hosting the web version of the app. Researching the pros and cons and cost options of it. I estimate that it will take 1-2 hours. If we do end up going with the s3 option then I will need to add time to learn how to do it which might take another 3-4 hours to learn the ins and out of hosting with it.

toddysm commented 5 years ago

The deliverable for this is:

yahya09206 commented 5 years ago

Estimated Time: 2-3Hrs Actual Time: 3Hrs(Due to technical difficulties & reading)

Getting React up and running

  1. npx create-react-app my-app
  2. cd my-app
  3. npm start
  4. Then open http://localhost:3000/ to see your app.

Setting up S3 and hosting React App

  1. Create an account or sign in to the AWS Console: https://aws.amazon.com/
  2. Navigate to the S3 service and click Create Bucket. Make up a clever name for your new bucket, then click Create
  3. Click on the newly-created bucket --> Within the Properties, open the Static Website Hosting tab --> select Enable website hosting --> Fill in index.html for both the Index and Error Documents. By setting index.html as the Error Document, we can allow something like react-router to handle routes outside of the root.
  4. Open the Permissions tab, then select Edit bucket policy. You may choose to do something more nuanced here, but a good starting point is to provide read-only permissions for anonymous users — a policy provided in the AWS examples. Make sure its your bucket name under the "Resource" key.
  5. Add the contents of your build directory(use 'npm run build' to create build folder) to this bucket. This can be done by clicking on the bucket and clicking Upload. That’s it! You can find the URL to your application back under the Static Website Hosting tab, labeled Endpoint.

Link for React website on s3 http://acktokids1.s3-website-us-east-1.amazonaws.com/