Deploying a Node.js Project with HTML, CSS, and JavaScript on Google Cloud (GCP)

This guide explains how to set up and run a Node.js project on a Google Cloud Platform (GCP) Virtual Machine (VM) instance, configure the firewall for external access, and manage file transfers using FileZilla.

---

Step 1: Set Up a GCP Virtual Machine (VM)

1. Log in to Google Cloud Console:
   Go to Google Cloud Console.

2. Create a Compute Engine VM Instance:

   • Navigate to Compute Engine → VM Instances.
   • Click Create Instance.
   • Configure the instance:
     • Name: nodejs-server
     • Region: Choose the nearest location.
     • Machine type: e2-medium (recommended for small projects)
     • Boot disk:
       • Click Change.
       • Select Ubuntu 22.04 LTS.
       • Click Select.
     • Firewall: Check Allow HTTP traffic and Allow HTTPS traffic.
   • Click Create.

3. Note the External IP Address:
   After the VM is created, note its External IP (you’ll need this later).

---

Step 2: Connect to the VM via SSH

1. Open the SSH Terminal:
   In Google Cloud Console, go to Compute Engine → VM Instances. Click SSH next to your instance.

2. Update System Packages:

   sudo apt update && sudo apt upgrade -y
   

---

Step 3: Install Node.js and Nginx

1. Install Node.js and npm:

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

2. Verify installation:

   node -v
   npm -v
   

3. Install Nginx (for reverse proxy support):

   sudo apt install -y nginx
   

4. Start and enable Nginx:

   sudo systemctl start nginx
   sudo systemctl enable nginx
   

---

Step 4: Upload Your Project to the Server

Option 1: Using FileZilla (SFTP)

1. Follow this guide to set up FileZilla.
2. Upload your Node.js project to /home/your-username/app/.

Option 2: Using Git

1. Install Git:

   sudo apt install -y git
   

2. Clone your project:

   git clone https://github.com/yourusername/your-repo.git app
   

---

Step 5: Install Dependencies and Run the App

1. Navigate to your project directory:

   cd ~/app
   

2. Install dependencies:

   npm install
   

3. Start the application:

   node server.js
   

   If the app is running correctly, it will display something like:

   Server running on port 3000
   

---

Step 6: Set Up a Reverse Proxy with Nginx

1. Edit the Nginx configuration:

   sudo nano /etc/nginx/sites-available/default
   

2. Replace the existing content with the following:

   server {
       listen 80;
       server_name your-external-ip;
   
       location / {
           proxy_pass http://localhost:3000;
           proxy_http_version 1.1;
           proxy_set_header Upgrade $http_upgrade;
           proxy_set_header Connection 'upgrade';
           proxy_set_header Host $host;
           proxy_cache_bypass $http_upgrade;
       }
   }
   

3. Save and exit (press CTRL+X, then Y, then Enter).

4. Restart Nginx:

   sudo systemctl restart nginx
   

---

Step 7: Configure Firewall Rules (If Needed)

1. Allow HTTP and HTTPS:

   sudo ufw allow 'Nginx Full'
   

2. Allow Node.js port (if accessing directly, not via Nginx):

   sudo ufw allow 3000/tcp
   

---

Step 8: Run Node.js as a Background Service

To keep your app running even after closing the terminal, use PM2:

1. Install PM2:

   sudo npm install -g pm2
   

2. Start your app:

   pm2 start server.js
   

3. Set up PM2 to restart on reboot:

   pm2 startup systemd
   sudo env PATH=$PATH:/usr/bin pm2 startup systemd -u $USER --hp /home/$USER
   pm2 save
   

---

Step 9: Access Your App

• Open a web browser and go to:

  http://your-external-ip
  

• If configured correctly, your app should be accessible.

---

Step 10: (Optional) Set Up a Domain Name

If you have a domain, you can configure Nginx with SSL:

1. Install Certbot:

   sudo apt install certbot python3-certbot-nginx -y
   

2. Obtain an SSL certificate:

   sudo certbot --nginx -d yourdomain.com -d www.yourdomain.com
   

3. Automatically renew SSL:

   sudo crontab -e
   

   Add this line:

   0 3 * * * certbot renew --quiet
   

---

🎉 Conclusion

You have successfully deployed a Node.js application with HTML, CSS, and JavaScript on a GCP VM instance. Your app is accessible via the internet, secured with Nginx, and managed with PM2.

🚀 Now you can:

• Update your app by uploading new files via FileZilla or using Git.

• Restart your app anytime using:

  pm2 restart server
  

• View app logs with:

  pm2 logs
  

If you encounter any issues, feel free to ask for help!