How to Host Static Websites with S3

Introduction:

This article will demonstrate how to use S3 for static website hosting.

A static website delivers content in the same format in which it is stored. No server-side code execution is required. For example, if a static website consists of HTML documents displaying images, it delivers the HTML and images as-is to the browser, without altering the contents of the files.

Static websites can be delivered to web browsers on desktops, tablets, or mobile devices. They usually consist of a mix of HTML documents, images, videos, CSS style sheets, and JavaScript files. Static doesn’t have to mean boring—static sites can provide client-side interactivity as well. Using HTML5 and client-side JavaScript technologies such as jQuery, AngularJS, React, and Backbone, you can deliver rich user experiences that are engaging and interactive.

 

Content Delivery Hosting

Static websites load quickly since the content is delivered as-is and can be cached by a content delivery network (CDN). The web server doesn’t need to perform any application logic or database queries. They’re also relatively inexpensive to develop and host. However, maintaining large static websites can be cumbersome without the aid of automated tools, and static websites can’t deliver personalized information.

Static websites are most suitable when the content is infrequently updated. After the content evolves in complexity or needs to be frequently updated, personalized, or dynamically generated, it’s best to consider a dynamic website architecture.

 

 

S3 for Static Website Hosting

Amazon Simple Storage Service (Amazon S3) can host static websites without a need for a web server. The website is highly performant and scalable at a fraction of the cost of a traditional web server. Amazon S3 is storage for the cloud, providing you with secure, durable, highly-scalable object storage. A simple web services interface allows you to store and retrieve any amount of data from anywhere on the web.1

You start by creating an Amazon S3 bucket, enabling the Amazon S3 for static website hosting features, and configuring access permissions for the bucket. After you upload files, Amazon S3 takes care of serving your content to your visitors.

Amazon S3 provides HTTP web-serving capabilities, and the content can be viewed by any browser. You must also configure Amazon Route 53, a managed Domain Name System (DNS) service, to point your domain to your Amazon S3 bucket. Figure 3 illustrates this architecture, where http://example.com is the domain.

 

 

 

Scalability and Availability

Amazon S3 is inherently scalable. For popular websites, Amazon S3 scales seamlessly to serve thousands of HTTP or HTTPS requests per second without any changes to the architecture.

In addition, by hosting with Amazon S3, the website is inherently highly available. Amazon S3 is designed for 99.999999999% durability and carries a service level agreement (SLA) of 99.9% availability. Amazon S3 gives you access to the same highly scalable, reliable, fast, and inexpensive infrastructure that Amazon uses to run its own global network of websites. As soon as you upload files to Amazon S3, Amazon S3 automatically replicates your content across multiple data centers. Even if an entire AWS data center were to be impaired, your static website would still be running and available to your end-users.

Compare this solution with traditional non-AWS costs for implementing “active-active” hosting for important projects. Active-active, or deploying web servers in two distinct data centers, is prohibitive in terms of server costs and engineering time. As a result, traditional websites are usually hosted in a single data center, because most projects can’t justify the cost of “active-active” hosting.

 

Encrypt Data in Transit

We recommend you use HTTPS to serve static websites securely. HTTPS is the secure version of the HTTP protocol that browsers use when communicating with websites. In HTTPS, the communication protocol is encrypted using Transport Layer Security (TLS). TLS protocols are cryptographic protocols designed to provide privacy and data integrity between two or more communicating computer applications. HTTPS protects against man-in-the-middle (MITM) attacks. MITM attacks intercept and maliciously modify traffic.

(ACM) is a service that lets you easily provision, manage, and deploy public and private Secure Sockets Layer (SSL)/TLS certificates for use with AWS services and your internal connected resources. See Using HTTPS with Amazon CloudFront for more implementation information.

Making Your Content Publicly Accessible

For your visitors to access the content at the Amazon S3 website endpoint, the Amazon S3 objects must have the appropriate permissions. Amazon S3 enforces a security-by-default policy. New objects in a new bucket are private by default. For example, an Access Denied error appears when trying to view a newly uploaded file using your web browser. To fix this, configure the content as publicly accessible. It’s possible to set object-level permissions for every individual object, but that quickly becomes tedious. Instead, define an Amazon S3 bucket-wide policy.

The following sample Amazon S3 bucket policy enables everyone to view all objects in a bucket:

{

"Version":"2012-10-17",

"Statement":[{ "Sid":"PublicReadGetObject", "Effect":"Allow",

"Principal": "*", "Action":["s3:GetObject"],

"Resource":["arn:aws:s3:::S3_BUCKET_NAME_GOES_HERE/*"]

}

]

}

 

This policy defines who can view the contents of your Amazon S3 bucket. See Managing Administrative Access to Your AWS Resources for the AWS Identity and Access Management (IAM) policies to manage permissions for your team members.

Together, Amazon S3 bucket policies and IAM policies give you fine-grained control over who can manage and view your website.

Conclusion:

We discussed in this article the AWS Cloud-native architecture based on Amazon S3, Amazon CloudFront, and Amazon Route 53. and how to use S3 for static website hosting.

The AWS architecture is highly available and scalable, secure, and provides for responsive user experience at a very low cost. By enabling and analyzing the available logs, you can understand your visitors and how well the website is performing. Fewer moving parts means less maintenance is required. In addition, the architecture costs only a few dollars a month to run.

You probably wanna check our other article on how to mount s3 as local disk