Skip to main content

🚀 Nginx Configuration for asifahmadkhan.com

🌐 Overview​

This document contains Nginx server block configurations for serving:

  • A static homepage (asifahmadkhan.com)
  • A frontend dashboard (dashboard.asifahmadkhan.com)
  • A Laravel-based documentation site (docs.asifahmadkhan.com)
  • A subpath React + PHP API hybrid app (test.asifahmadkhan.com/test/ and /test/api/v1/)
  • A React-based checkout app (checkout-asifahmadkhan.com)

📁 Directory Structure for /test/ Hybrid App​

/var/www/html/
├── test/
│   ├── index.html        # React/Vite entry point
│   ├── assets/           # JS, CSS, images
│   └── api/
│       └── v1/
│           ├── index.php # PHP API entry
│           └── other.php

🔧 Nginx Configuration Blocks​

🏠 Static Homepage – www.asifahmadkhan.com​

server {
    listen      80;
    listen      [::]:80;
    server_name www.asifahmadkhan.com;

    root        /var/www/html;
    index       index.html;

    access_log  /var/log/nginx/access.log combined buffer=512k flush=1m;
    error_log   /var/log/nginx/error.log warn;

    location / {
        try_files $uri $uri/ =404;
    }
}

📊 Frontend Dashboard – dashboard.asifahmadkhan.com​

server {
    listen 80;
    server_name dashboard.asifahmadkhan.com;

    root /var/www/html/dashboard/dist;
    index index.html;

    access_log /var/log/nginx/dashboard_access.log;
    error_log  /var/log/nginx/dashboard_error.log;

    location / {
        try_files $uri /index.html;
    }
}

📚 Laravel Docs – docs.asifahmadkhan.com​

server {
    listen 80;
    server_name docs.asifahmadkhan.com;

    root /var/www/html/documentation/public;
    index index.php index.html;

    access_log /var/log/nginx/docs_asifahmadkhan_access.log;
    error_log  /var/log/nginx/docs_asifahmadkhan_error.log warn;

    location / {
        try_files $uri $uri/ /index.php?$query_string;
    }

    location ~ \.php$ {
        include fastcgi_params;
        fastcgi_pass unix:/var/run/php/php8.3-fpm.sock;
        fastcgi_index index.php;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
    }
}

🛒 Checkout App – checkout-asifahmadkhan.com​

server {
    listen 80;
    server_name checkout-asifahmadkhan.com;

    root /var/www/html/checkout/build;  # React
    # OR
    # root /var/www/html/checkout/dist;   # Vue

    index index.html index.php;

    access_log /var/log/nginx/checkout-access.log;
    error_log  /var/log/nginx/checkout-error.log warn;

    location / {
        try_files $uri $uri/ /index.html;
    }

    location ~ ^/api/ {
        try_files $uri $uri/ /index.php?$query_string;
    }
}

🔀 React + PHP API Hybrid App – test.asifahmadkhan.com​

server {
    listen 80;
    server_name test.asifahmadkhan.com;

    root /var/www/html;
    index index.html index.php;

    access_log /var/log/nginx/test_access.log;
    error_log  /var/log/nginx/test_error.log warn;

    # Frontend (SPA served at /test/)
    location /test/ {
        try_files $uri $uri/ /test/index.html;
    }

    # Backend API (PHP at /test/api/v1/)
    location ^~ /test/api/v1/ {
        try_files $uri $uri/ /test/api/v1/index.php$is_args$args;

        location ~ \.php$ {
            include fastcgi_params;
            fastcgi_pass unix:/var/run/php/php7.2-fpm.sock;
            fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
        }
    }

    # Deny all other access
    location / {
        return 404;
    }
}

⚙️ Deployment Steps​

  1. 🔐 Save config files to:

    /etc/nginx/sites-available/asifahmadkhan.com.conf

  2. 🔗 Create a symlink to enable the site:

    sudo ln -s /etc/nginx/sites-available/asifahmadkhan.com.conf /etc/nginx/sites-enabled/

  3. 🔄 Restart Nginx:

    sudo systemctl restart nginx

✅ Your setup is ready! Access all subdomains to verify:

  • http://www.asifahmadkhan.com
  • http://dashboard.asifahmadkhan.com
  • http://docs.asifahmadkhan.com
  • http://test.asifahmadkhan.com/test/
  • http://checkout-asifahmadkhan.com

🟩 Use this setup when:

  • Serving SPA apps like React/Vite
  • Using subpaths (/test/) for frontend
  • Using /test/api/v1/ as PHP backend
  • Wanting to isolate each subdomain for separation of concern

🎯 Pro Tip: Keep your PHP versions consistent across apps or use separate FPM pools for better isolation.

🌟 Happy Hosting with Nginx!