This step-by-step guide shows you how to set up a Cloud Storage bucket to host a static website. Static websites can include client-side codings such as HTML, CSS, and JavaScript. They cannot contain dynamic code such as server-side scripts such as PHP.

Why Google Cloud Storage?

It is amazingly fast for pennies a month!

You can host 10 GB of websites at multi-regional for high availability for less than $1/per month.

Getting Started

This tutorial walks you through setting up a free Google Cloud bucket to serve a static website:

Sign up & Create a project

First, sign up for Google cloud.

Set up a project (if you haven’t already).

new project

Add your domain name to Google Cloud DNS >> Network Services >> Cloud DNS.

cloud dns

Create a DNS zone

dns zone

Add the Name servers to your domain registrar. You can point your A-record to your bucket, but for simplicity, I’m showing you how to let Google host your DNS.

custom dns nameserver

Wait, Name servers can take a while to propagate.

Verify your domain

Next, Google needs to verify you own the domain. You do this by adding the domain to Google Search Console. You cannot skip this step!

select property type

Add the text record to your DNS and verify.

Create a Storage bucket

In Google Cloud Platform, Select the storage tab.

storage

Create a new Bucket. Name it exactly as your URL appears.

create bucket

Create a Load Balancing Service

To connect everything with an SSL, you need to create a load balancing service. I spent a few days stuck at this step, so I decided to create this article because I couldn’t find a solution anywhere.

load balancing

Create Load Balancer

Select HTTP Load balancer.

In Backend Config >> Backend bucket >> Create backend bucket >> Browse.

Select your bucket, name the balancer, press create.

create backend bucket

Here is where I was stuck for a bit:

In Frontend Configuration. “Reserve a new static IP address.” If you don’t do this, your HTTP + HTTPS will have 2 different IP addresses.

Create a certificate

create new certificate

Set up a Frontend config

Be sure to add both HTTP + HTTPS protocols in Frontend Config.

frontend configuration

Review Policy

review and finalize

Set Pages

Back under the “Storage” tab, find your domain name/bucket.

Edit website configuration

bucket permissions

Add your main page + 404 page.

website configuration

Add Members

Going back to the same dropdown, this time select Edit Bucket Permissions. Add a member: allusers, Role –> Storage >> Storage Object Viewer. This will allow the general public to view your new website.

add members

Upload website files

Now all that is left is uploading your website files. You can do it a few ways, but to keep this simple, I’d recommend uploading using the browser upload tool.

bucket details

Relish in your success, you are now hosting an incredibly fast and affordable website on Google’s servers.