- Go to your Google Cloud Console or https://console.cloud.google.com/
- Select an existing project or create a new one.
- Create a storage bucket.
- Configure your bucket
- Upload your website files
- Set the permissions
- Configure the index document
- Point your storage bucket to your domain.
Detailed Explanation
1. Go to your Google Cloud Console or https://console.cloud.google.com/
2. Select an existing project or create a new one: This will be the container for all the resources associated with your website. By default, you can create 25 projects and you can request Google to add more.
3. Create a storage bucket by (1) clicking the hamburger menu; (2) select Cloud Storage; (3) then Buckets; (4) then Click Create a Bucket. This will be used to store your HTML website’s files.
4. Configure your bucket using your domain name including the www. If you don’t, you’ll have a hard time pointing your domain to your bucket. For example, my domain is caninternationaltravel.com, I’ll name the bucket with www.caninternationaltravel.com then click Continue.
And then select where to store your data: Multi-region if your website audience are located globally; Dual-region if your audience are limited to 2 regions: And Region for one specific region.
If you want to keep the cost down or want to take advantage of the Free-tier, select Region only. Then select us-central, us-east or us-west for the Free-tier.
From time to time, Google may update their Free Tier terms. For updated info, go to Google’s site: https://cloud.google.com/free/docs/free-cloud-features
Then choose a default storage class for your data, the options are Standard, Nearline, Coldline and Archive. Choose Standard since it’s designed for frequently accessed data
For choose how to control access to objects, select Fine-grained so we can control the permission of each folder. Other than that, that’s all the settings you need to take care of. Then click Create button.
5. Upload your website files: You can use the Cloud Console or a tool like gsutil to upload your website files (HTML, CSS, JavaScript, images, etc.) to the storage bucket. The easiest way is dragging your files to your bucket.
6. Set the permissions: Select all the files then set the permissions for the storage bucket to allow public access to your website files by clicking the Permissions tabs
Click Add
Add principals and roles. Under New Prinicipals, select allUsers. And under Role, select Storage Legacy Object Reader.
Then it’ll warn you that you are about to make your files public. Click Allow access to confirm.
7. Configure the index document: Set the index document to the file that should be served as the home page of your website. Typically this is a file named “index.html”. To do this, select your Domain and click the 3 dots. From the choices, select Edit website configurations.
Another window will pop where you can enter index.html and 404.html if you have one.
8. Point your storage bucket to your domain. The instructions here will vary depending on your domain provider. I’ll show you how to configure your storage bucket to Google domains.
Go to your domain provider and select the domain that you are trying to configure. Then select DNS.
Then add a new custom resource record and enter the following info:
Hostname:www / Type: CNAME / TTL: 3600/ Data:c.storage.googleapis.com
These configuration may take up to 24 hours to propagate. You can test your website by typing www.yourdomain.com and see if that loads.
If you want the non-www to work when visiting your domain, here’s my tutorial on that.