Are you looking to host a static website? Then you are at the right place where I will be guiding you to host and set up your static website on Google Cloud. So just stay connected with us.

Hello everyone, In this article, we are going to talk about hosting a static website on Google Cloud.

What is a Static Website?

Static websites are the ones that are fixed and developed with HTML CSS and JavaScript in this static website the content is fixed or the same. The user reads the content which is already present on the webpage the same content without any dynamic content or server is known as a static website.

If you want to know more about static websites then visit: Click here

What is a Google Cloud?

The Google Cloud Platform (GCP) is a suite of cloud services hosted on Google’s infrastructure. Google Cloud Platform is a suite of public cloud computing services offered by Google. 

Why Use Cloudflare to host static websites on Google Cloud?

Cloudflare is a Content Delivery Network (CDN), Domain Name System (DNS), and protection against Distributed Denial of Service (DDoS) attacks. Using Cloudflare, you can provision DNS records and distribution rules for your website hosted in Google Cloud Storage (buckets) and other cloud services.

Cloudflare plays a vital role in setting up the static website as you get free SSL and that’s superb. If not you have to purchase from other platforms which are a little expensive.

Domain Setup

The first step is to purchase a domain. Purchasing a domain from any provider will do, but purchasing with Google Domains makes the process easier.

Verify Domain Ownership

Initially, you got to verify that you are an owner of the domain by adding the URL to the “Search Console.” If you haven’t purchased the domain from google domains.

What is Cloud Storage?

Cloud Storage is an object storage-oriented system for creating static content for different creators of all units. You can create any amount of data or files. we do create many micro-niches sites and websites. Also, we can set a lifecycle to delete some expired objects automatically. This service is very widely used in different solutions.

So now let’s see how to host and set up a static website on Google Cloud Storage:-

Step 1: Log in to the google cloud console and search for the storage. If you don’t have an account you can create one.

You need a debit/credit card to get started with google cloud. And make sure you enable your billing

Step 2: After your sign up is complete, Now you have to go-to cloud storage

Step 3: Click on Create Bucket to configure a new bucket that holds contents for our static website.

Step 4: Now fill the domain name with www.yourdomainname.com and click continue

Step 5: Choose Your Location type: Select Which country (US, EU & Asia) are you targeting depending on your keyword

Step 6: Choose a default storage class for your data

Step 7: Choose how to control access to objects

Step 8: Choose Protection tools: Leave as it is None

Step 9: Click on Create Bucket.

After you finish creating your bucket, you should see them on your list.

Configuring Storage Bucket

Now after you create the bucket, the most important thing is to make it public and accessible over the Internet.

• Select the bucket from the list
• Click on the setting icon on the right side >> Edit Access
• It will open permissions properties on the right side, click Add member
• Type allUsers in the “New members” field and select a role as “Storage Object Viewer.”
• Save the configuration and allow public access.

Now let’s configure the index and error page

• Click on the setting icon ~ Edit website configuration
• Enter the index.html & 404.html pages

Go to Cloudflare and add CNAME Pointing to your Google cloud.

If you’re not using Cloudflare, I would recommend using Cloudflare.

SSL Setting

As described above, the site will use the “Flexible” SSL/TLS encryption mode, which can be set under the SSL/TLS tab on Cloudflare.

Page Rules

You need to add two-page rules pointing to your domain name.

I prefer to use the root domain, but if a user adds a www. prefix I don’t want them to encounter an error. This can be handled by creating the following forwarding rule.

Add CNAME Record to your Domain Provider

• Login to your Domain Provider and update CNAME to c.storage.googleapis.com of your domain.

• Google Storage CNAME is c.storage.googleapis.com
• After you copy the CNAME paste it into your Cloudflare DNS setting.

Finally, we are done hosting a static website on Google Cloud with Cloudflare.

You can access your domain and check if it’s working fine.

Watch the video for a better understanding:-