This is a walk through lab based on AWS project. For more details please refer here. This walk through breaks into four parts which are
- Host a static website
- Manage users
- Build serverless backend
- Deploy a RESTful API
Host a static website
Amazon S3 hosts static web resources including HTML, CSS, JavaScript, and image files which are loaded in the user’s browser. Now, let’s get started.
S3 will hold and serve all the static contents so we start by creating a bucket.
Next we upload the static web files provided by aws. You can upload the files to S3 by using AWS console. You can download them from here. You can also use CLI or CloudFormation provided by AWS to complete this step. I will use CLI.
aws s3 sync s3://wildrydes-us-east-1/WebApplication/1_StaticWebHosting/website s3://YOUR_BUCKET_NAME --region YOUR_BUCKET_REGION
Next, we need to config permissions to allow public access to the files. We need to
- Turn OFF “Block new public bucket policies” and “Block public and cross-account access if bucket has public policies”
- Assign “Bucket Policy”
Select bucket holds the files and click Permissions
Edit “Block all public access” setting
Leave the first two options ticked, click Save and confirm changes made.
Finished view.
Next we add “Bucket Policy” to allow public access.
{
"Version": "2012-10-17",
"Statement": [
{
"Effect": "Allow",
"Principal": "*",
"Action": "s3:GetObject",
"Resource": "arn:aws:s3:::[YOUR_BUCKET_NAME]/*"
}
]
}Finish view.
Next we enable the bucket for website hosting. Go to the Properties section and click “Static website hosting”
Config as the image below. Once saved, click the Endpoint to verify that everything is setup correctly!
You will see the same thing if everything is setup correctly! If you see any Permission Denied messages, review the “Block all public access” and “Bucket Policy” settings.
That’s it for part 1!
