How to Build Your Own Blog Website?

Hello,

In this post, I’ll walk you through, step by step, how to build and deploy a setup similar to my live blog website from scratch. Depending on your needs, you can either run it directly in a Node/PM2 environment or deploy it as a container using the Docker setup included in the repository.

The Git repository we’ll use: https://github.com/SwitchAlpha/myblog

As a first step, you need to obtain a virtual server (VPS) from a price/performance-focused provider such as Hetzner and point your domain’s DNS (A) record to that server’s IP address. Once you have connected to your server via SSH, we can get started by cloning the source code:

git clone https://github.com/SwitchAlpha/myblog.git && cd myblog

From here, you can choose between two different deployment methods:

Method 1: Direct Setup (Node / PM2 & Nginx)

1. Installing Dependencies and Testing

pnpm setup
pnpm dev

After confirming that the site runs smoothly on the local test server, we can create the production build:

pnpm build

2. Keeping It Running with PM2

To ensure that the application runs continuously in the background and starts automatically when the server reboots:

pm2 start pnpm --name "myblog" -- start
pm2 save
pm2 startup

3. Nginx Reverse Proxy Configuration

sudo apt update && sudo apt install nginx -y
sudo nano /etc/nginx/sites-available/myblog

Add the following proxy block to the file that opens (adjust alanadiniz.com and the port information to match your own setup):

server {
    listen 80;
    server_name alanadiniz.com www.alanadiniz.com;

    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;
    }
}

We enable the configuration, test the Nginx service, and restart it:

sudo ln -s /etc/nginx/sites-available/myblog /etc/nginx/sites-enabled/
sudo nginx -t
sudo systemctl restart nginx

Method 2: Setup with Docker & Docker Compose

If you want to run the project in an isolated environment without dealing with package and version dependencies on the server, you can use Docker Compose to bring up the Dockerfile already included in the repository.

Create a docker-compose.yml file in the project directory:

version: '3.8'

services:
  app:
    build:
      context: .
      dockerfile: Dockerfile
    container_name: myblog_app
    restart: always
    ports:
      - "3000:3000"
    environment:
      - NODE_ENV=production

To build and run the container in the background:

docker compose up -d --build

Once the container is running on port 3000, simply follow the Nginx steps above to route traffic to http://localhost:3000.

Final Step: SSL Certificate (HTTPS)

Whichever deployment method you choose, set up a free Let's Encrypt SSL certificate with Certbot to move your site to a secure HTTPS connection:

sudo apt install certbot python3-certbot-nginx -y
sudo certbot --nginx -d alanadiniz.com -d www.alanadiniz.com

That’s all there is to it! Your blog website is now live and securely accessible through your domain name.

Thank you for taking the time to read this, and see you in future posts!