Deploying a Static Web Application on Google Cloud Storage (GCS) Bucket
A reliable and affordable option for hosting static web apps is Google Cloud Storage (GCS). In contrast to dynamic web applications, static web apps are made out of files like HTML, CSS, JavaScript, and pictures that remain the same unless manually modified. We’ll go over how to install a static web application on a GCS bucket step-by-step in this tutorial.
Benefits of Using GCS for Hosting:
Cost-effective: You simply pay for data storage and transit; there are no additional costs associated with server upkeep.
Scalable: GCS adapts to demand automatically, so you don’t have to be concerned about traffic peaks.
High durability and availability are provided by GCS, guaranteeing that your site is always available.
Steps to Deploy:
1. Set Up Your Google Cloud Account
Create a Google Cloud account if you don’t already have one. The free tier provided by Google is frequently more than adequate for hosting a tiny static website.
2. Create a GCS Bucket
Go to Google Cloud Console by using your browser. Select “Storage” > “Browser” from the “Navigation Menu” (hamburger icon in the top left). Select “Create Bucket” from the menu. What’s in your bucket? All GCS buckets must use a different name for this one. Determine the site type and storage level based on your needs and budget. Click “Create” after making any other adjustments that are required.
3. Upload Your Static Files
Click on the name of the bucket you just made.
Drag and drop your static site files, such as index.html,.css,.js, and any images, or manually upload them.
4. Set the Bucket Permissions
For your website to be publicly accessible, you’ll need to modify the bucket permissions.
In your bucket, click the “Permissions” tab.
Click the “+ Add” button to add a new member.
Enter “allUsers” as the new member.
Set the role to “Storage Object Viewer”. This allows anyone to view the objects in the bucket.
5. Enable Website Configuration
In the bucket details page, click on the “Edit website configuration” link (under the “Metadata” tab).
Enter the main page (usually index.html) and a 404 page if you have one.
Click “Save”.
6. Accessing Your Website
Your static web application is now live! Access it using the following URL format: http://storage.googleapis.com/YOUR_BUCKET_NAME/
Custom Domain:
If you have a custom domain and wish to use it instead of the default GCS URL:
Create a CNAME record with your domain registrar pointing your domain (or subdomain) to c.storage.googleapis.com.
Update the website configuration in GCS to recognize your custom domain.
Conclusion:
A static web application can be easily deployed on a GCS bucket, and doing so has many benefits. GCS offers a dependable and scalable solution whether you’re hosting a personal project, a portfolio, or a company website. Your web apps can be improved and expanded in a variety of ways by integrating more Google Cloud services. Click on this link to learn more about Deploying a Static web application on GCS Bucket.
