Mastering Secure Web Infrastructure: A Guide to Nginx, GCP, and Load Balancing in the Cloud

In this project, we’ll delve into the exciting realm of setting up a secure and efficient web infrastructure on virtual machines within the Google Cloud Platform (GCP). Throughout this journey, my aim is to empower you with the tools and knowledge needed to wield the power of Nginx, GCP, and load balancing. With these components seamlessly working in concert, you’ll not only be hiding the intricacies of your internal network but also achieving a robust, scalable web infrastructure that’s primed for success. So, let’s dive in and transform your vision into a reality!

Three vital components:

1. Reverse Proxy + Load Balancer VM:

This pivotal virtual machine takes on the role of both a reverse proxy and a load balancer. By configuring Nginx, we’ll ensure that it acts as the gateway between external traffic and our frontend servers. This approach not only shields our internal network but also lays the groundwork for distributing incoming requests seamlessly between our two frontend instances.

2. Frontend 1 VM:

Imagine this as our digital storefront. Here, on the first frontend VM, we’ll host one facet of our web applications or content.

3. Frontend 2 VM:

Now, picture a second storefront, mirroring the first but enhancing our capacity to serve users without compromising speed or reliability. We’ll tackle the setup of this second frontend VM to ensure the load balancing mechanism distributes the incoming traffic optimally across both frontend instances.

First, we need to create a VPC in Google Cloud to establish a secure, isolated, and well-organized network environment.

Step 1: Create VPC

We are providing name of VPC, and a subnet name. We are selecting region as us-east1, and private IPv4 range as 10.10.10.0/24.

We are allowing firewall rules for this demonstration.

Now we have a VPC network. We will create a template to up our VMs. VM Instance Templates in GCP provide a powerful way to create, deploy, and manage VM instances with consistent configurations.

Step 2: Generate a VM Instance Template to simplify the creation process of our VMs.

We are selecting None as External IPv4 address because we do not need public IPs of our frontend VMs. We need public IP only for Nginx VM.

The instance template has been established. We’ll proceed to generate VMs using this template.

Step 3: Create Reverse Proxy + Load balancer VM

Or,

By selecting Ephemeral of External IPv4, we are assigning an automatic public IP to the VM.

Our VM is created.

Now Create Frontend-1 VM using template:

Similarly create Frontend VM 2 and access CLI of 3 VMs by doing SSH.

Using the public IP of the zaman-lb-rproxy-vm, we can establish an internet connection. We’re currently performing updates on apt and subsequently installing NGINX.

sudo apt install nginx

sudo systemctl status nginx

If we check the public ip from a browser now, we can see the default welcome message of nginx.

To enable our Frontend VMs to install essential packages, it’s crucial to configure Cloud NAT for the VPC.

We need to create a cloud router.

Now our VMs can reach internet via cloud router.

We can change nginx content to check that everything is working properly. To do so:

cloud_user_p_cd8f2d66@zaman-lb-rproxy-vm:~$ cd /var/www/html

cloud_user_p_cd8f2d66@zaman-lb-rproxy-vm:/var/www/html$ ls

index.nginx-debian.html

cloud_user_p_cd8f2d66@zaman-lb-rproxy-vm:/var/www/html$ sudo vi index.nginx-debian.html

sudo nginix -s reload

Install NodeJS in frontend VMs.

https://nodejs.org/en/download/package-manager

https://github.com/nodesource/distributions

root@zaman-fe-1-vm:/home/cloud_user_p_cd8f2d66# sudo su

curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash – && sudo apt-get install -y nodejs

Next, we’ll set up two distinct Node.js applications within each VM. To begin, we initiate the projects. Additionally, we’ll enable Yarn for enhanced package management.

sudo corepack enable

Create a project with vite:

yarn create vite

Then run ‘yarn’ command

yarn run build

yarn preview

To start the project on port 80:

sudo yarn preview –host –port 80

Step5: Configure Nginx as load balancer and reverse proxy

root@zaman-lb-rproxy-vm:/etc/nginx# nano nginx.conf

root@zaman-lb-rproxy-vm:/etc/nginx# pwd

/etc/nginx

Let us check the syntax

root@zaman-lb-rproxy-vm:/etc/nginx# sudo nginx -t

nginx: the configuration file /etc/nginx/nginx.conf syntax is ok

nginx: configuration file /etc/nginx/nginx.conf test is successful

Reload Nginix server

root@zaman-lb-rproxy-vm:/etc/nginx# sudo nginx -s reload