Search icon
Start Writing
Bybit adWin 200 BTC Prize Pool
Hackernoon logoHow To Build A Website Using Google Cloud? by@Martin

How To Build A Website Using Google Cloud?

Author profile picture

@MartinSophia

Tech Lead and Technical Content Writer @xicom.biz. Tech Geek, Passionate Writer, Business Consultant

Recently, SADA Systems surveyed about 200 IT managers about their use of public cloud services and they found that 84 percent of IT managers are using public cloud infrastructure, as opposed to the corporate data center. According to Tony Safoian-- president and CEO at SADA Systems--All signs point to the adoption of public cloud is growing and enterprise IT is becoming more comfortable with the prospect of running their crucial and sensitive data on public cloud infrastructure”.
Now, Cisco is also forecasting that by the year 2020, cloud traffic will represent 92% of all the data center network traffic. As per the Google Trends (shown below), interest surrounding Google Cloud Platform itself has been on an exponential rise over the past two years.
Nowadays, more and more firms are migrating as in most cases it provides the most flexible, secure, and cost-effective solution. It saves money as well as time on IT staffing and allows for the most rapid scaling of any online solution or platform.
Ref: Google Trends
Google Cloud Hosting is just one of the many web development services provided by the Google Cloud Platform. In addition to this, they offer their storage solutions, DNS, App Engine, CDN, and a plethora of other products. Google Cloud Platform comprises physical servers in addition to virtual resources like virtual machines that are comprised of Google’s data centers around the globe.
There are many companies that use Google Cloud Platform’s multi-regional deployment mode which means that you can choose a different data center for each of your WP websites.
There are thousands of reputed companies using the Google cloud platform. Some notable companies using Google Cloud Platform (App Engine or Compute Engine) include HSBC, Home Depot, Spotify, HTC, Best Buy, Snapchat, Coca Cola, Domino’s, Philips, Feedly, Sony Music, ShareThis, and Ubisoft.
Moreover, Apple has also been seen moving some of its services away from Amazon Web Services, spending between $400 million & $600 million on the Google Cloud Platform; although this could not be independently confirmed.

Google Cloud Hosting Advantages

Now let’s look at some of the top benefits of using Google Cloud Hosting and why we think it is the best solution in the market as it relates to pricing, stability, performance, scalability, backups, and security.
  • Private Global Fiber Network
  • Better Pricing Than Competitors
  • Live Migration of Virtual Machines
  • State of the Art Security
  • Improved Performance
  • Redundant Backups
  • Dedication to Continued Expansion
Let’s talk about how to host web applications on the Google cloud platform. In order to host a web app, first, it is required to configure a cloud storage bucket. And, after that, we upload and share the website’s files. Ultimately, we test the web app.

How to Create a CNAME Record?

A CNAME record is a type of DNS record. It directs traffic that requests a URL from your domain to the resources that you want to serve. For a domain like www.xyz.com, the CNAME record contains the information below:

Creating a bucket

If you want to connect your domain to the cloud storage:
1. Create a CNAME record that points to c.storage.googleapis.com. And your domain registration should have a proper path to administer your domain including adding a CNAME record.
For instance, if you add a CNAME record pointing www.xyz.com to c.storage.googleapis.com, then you will require creating a bucket with the name of www.xyz.com
CONSOLE
To create a bucket:
  1. Open cloud storage browser in the Google cloud platform console.
  2. Click on ‘Create bucket’ to open the bucket creation form.
  3. Enter your bucket information and click Continue to complete each step.
  4. The Name of your bucket.
  5. The storage class and location for your bucket.
  6. The access control model for your bucket.
  7. Click on Create.
If it is successful, it will take you to the bucket’s page where you see the text that ‘there are no objects in this bucket’.
GSUTIL
Use gsutil mb command:
Gsutil mb gs: //www.xyz.com
If successful, the command returns:
Creating gs: //www.xyz.com/ 
CODE SAMPLES
C++
C#
GO
JAVA
NODE.JS
PHP
PYTHON
RUBY
REST APIS
JSON API
  1. You will get an authorization access token from the OAuth 2.0 playground. You can configure the playground to use your own OAuth credentials.
  2. Create a.json file that assigns your site name to the NAME property.
  3. Now, use cURL to call the JSON API. For www.xyz.com:
XML API
  1. Get the authorization access token from the OAuth 2.0 playground. Configure the playground to use your own OAuth credentials.
  2. Now, use cURL to call the XML API with a PUT object request. For the index page of www.xyz.com

Uploading your website’s files

In order to add to your bucket the files you want your website to serve:
CONSOLE
  1. Open the cloud storage browser in the Google cloud platform console.
  2. In the list of buckets, click on the name of the bucket that you made.
  3. Click on the Upload files button in the Objects tab.
  4. In the file dialog, browse to the desired file and select it.
Once the upload finishes, you should see the file name along with the file information shown in the bucket.
GSUTIL
You can use the gsutil CP command to copy files to your bucket. For instance, to copy the file index.html from its present location
Desktop:
Gsutil cp Desktop/index.html gs: //www.xyz.com
If successful, then the command returns:
CODE SAMPLES
C++
C#
GO
JAVA
NODE.JS
PHP
PYTHON
RUBY
REST APIS
JSON API
  1. Get an authorization access token from the OAuth 2.0 Playground. Configure the playground to use your own OAuth credentials.
  2. Use cURL to call the JSON API with a POST object request. For the index page of www.xyz.com 
curl -X POST --data-binary @index.html \
-H "Content-Type: text/html" \
-H "Authorization: Bearer ya29.AHES6ZRVmB7fkLtd1XTmq6mo0S1wqZZi3-Lh_s-6Uw7p8vtgSwg" \
Link
XML API
  1. Get an authorization access token from the OAuth 2.0 Playground. Configure the playground to use your own OAuth credentials.
  2. Use cURL to call the XML API with a PUT Object request. For the index page of www.xyz.com

Sharing your files

Either you can make all the files in your bucket publicly accessible or you can set individual objects to be accessible through your website. Usually, creating all the files in your bucket accessible is easier and faster.
  • In order to create all files accessible, follow the cloud storage guide for making groups of objects publicly readable.
  • To create individual files accessible, follow the Cloud Storage guide for making individual objects publicly readable.
If you select to control the accessibility of individual files, you can set the default object ACL for your bucket so that all the files uploaded to your bucket are shared by default.

Recommended: Assigning speciality pages

You can also assign an index page suffix which is controlled by the MainPageSuffix property and a custom error page, which is controlled by the NotFoundPage property. Assigning either is optional, but without an index page, nothing is served when users access your top-level site. For instance, http://www.xyz.com
Index pages
The index page (also known as a web server directory index) is a file served to visitors when they request a URL that does not have an associated file. When you assign a MainPageSuffix, cloud storage looks for a file with that name whose prefix matches the URL the visitor requested.
For instance, let’s suppose that you set the MainPageSuffix of your static website to index.html. Additionally, suppose you have no file named directory in your bucket www.xyz.com. In this case, if a user requests the URL http://www.xyz.com/directory, Cloud storage attempts to serve the file www.xyz.com/directory/index.html. If that file does not exist, Cloud storage returns an error page.
The MainPageSuffix also controls the file served when users request the top-level website. Continuing the above instance, if a user requests http:// www.xyz.com, cloud storage attempts to serve the file www.xyz.com/index.html.

Error Page
The error page is the file returned to visitors of your static website who request a Universal Resource Locator(URL) that does not correspond to an existing file. If you have assigned a MainPageSuffix, cloud storage only returns the error page if there is neither a file with the requested name nor an applicable index page.
When returning the error page, the http response code is 404. The property that controls which file acts the error page is NotFoundPage, users receive a generic error page.
Setting MainPageSuffix and NotFoundPage
In the below-mentioned sample, the MainPageSuffx is set to index.html and NotFoundPage is set to 404.html:
CONSOLE
  1. Open the cloud storage browser in the Google cloud platform console.
  2. In the list of buckets, search the bucket you made.
  3. Click on the More actions icon and then move next to the bucket. Also, choose the Edit website configuration.
  4. In the configure website dialog, Indicate the Main Page and the 404 (Not Found) Page.
  5. Click on Save.
GSUTIL
Use the gsutil web set command to set the MainPageSuffix property with the -mflag and the NotFoundPage with the -e flag:
gsutil web set -m index.html -e 404.html gs://
www.xyz.com

If successful, the command returns:
Setting the website config on gs://www.xyz.com/...
Testing the website
Now, verify the content is served from the bucket by requesting the domain name in a browser. You can do this using a path to an object or with just the domain name if you set the MainPageSuffix property.
For instance, if you have an object named test.html stored in a bucket named www.xyz.com, check that it’s accessible by going to www.xyz.com/test.html in your browser.

Wrapping up

After reading this blog, you will get the knowledge on how to create a website using google cloud. If you still any confusion, you can hire web developers who can help in configuring your site to Google cloud. By opting for the right web development solution, you can have a secure, scalable and feature-packed Google cloud-based website.

Related

Tags

#website-using-google-cloud#build-a-website#host-a-website#how-to-build-website-on-cloud#make-a-static-website-with-google-cloud#build-a-website-using-google-cloud#latest-tech-stories#testing-the-website
The Noonification banner

Subscribe to get your daily round-up of top tech stories!