In this module you'll configure Amazon Simple Storage Service (S3) to host the static resources for your web application. In subsequent modules you'll add dynamic functionality to these pages using JavaScript to call remote RESTful APIs built with AWS Lambda and Amazon API Gateway.

The architecture for this module is very straightforward. All of your static web content including HTML, CSS, JavaScript, images and other files will be stored in Amazon S3. Your end users will then access your site using the public website URL exposed by Amazon S3. You don't need to run any web servers or use other services in order to make your site available.
For the purposes of this module you'll use the Amazon S3 website endpoint URL that we supply. It takes the form http://{your-bucket-name}.s3-website.{region}.amazonaws.com
. For most real applications you'll want to use a custom domain to host your site. If you're interested in using a your own domain, follow the instructions for setting up a static website using a custom domain in the Amazon S3 documentation.
Time to Complete Module: 30 Minutes
Services used: Amazon S3
CloudFormation Template: If you're already comfortable working with Amazon S3, or you just want to skip ahead to working with Lambda and API Gateway, you can launch one of these AWS CloudFormation templates in the Region of your choice to build the necessary resources automatically.
Region | CloudFormation Template |
---|---|
US East (N. Virginia) | Launch stack > |
US East (Ohio) | Launch stack > |
US West (Oregon) | Launch stack > |
EU (Frankfurt) | Launch stack > |
EU (Ireland) | Launch stack > |
EU (London) | Launch stack > |
Asia Pacific (Tokyo) | Launch stack > |
Asia Pacific (Seoul) | Launch stack > |
Asia Pacific (Sydney) | Launch stack > |
Asia Pacific (Mumbai) | Launch stack > |

CloudFormation Launch Instructions
Click the Launch Stack link above for the region of your choice.
Click Next on the Select Template page.
Provide a globally unique name for the Website Bucket Name such as
wildrydes-yourname
and click Next.On the Options page, leave all the defaults and click Next.
On the Review page, check the box to acknowledge that CloudFormation will create IAM resources and click Create.
This template uses a custom resource to copy the static website assets from a central S3 bucket into your own dedicated bucket. In order for the custom resource to write to the new bucket in your account, it must create an IAM role it can assume with those permissions.
Wait for the
wildrydes-webapp-1
stack to reach a status ofCREATE_COMPLETE
.With the
wildrydes-webapp-1
stack selected, click on the Outputs tab and click on the WebsiteURL link.Verify the Wild Rydes home page is loading properly and move on to the next module, User Management.
Follow the step-by-step instructions below to host a static website. Click on each step number to expand the section.