What is Nginx

1. What is Nginx?

Nginx (pronounced “Engine-X”) is a high-performance web server that can also act as:

• Reverse Proxy

• Load Balancer

• HTTP Cache

• Mail Proxy (less common now)

It’s popular because it’s:

• Fast (handles thousands of connections at once)

• Lightweight (low memory usage)

• Stable (used by companies like Netflix, Airbnb, GitHub)

• Flexible (web serving, proxying, streaming, etc.)

---

2. Why Nginx Exists?

Imagine you have a website.
When someone types yourwebsite.com, their browser sends a request to your server.
The server’s job is to:

1. Receive the request

2. Find the right files/data

3. Send the response back

Traditional web servers like Apache can handle this, but under heavy traffic, they can slow down.
Nginx was built for speed and concurrency, meaning it can handle many requests at the same time without choking.

---

3. Basic Nginx Architecture

Think of Nginx as:

• Front desk of a hotel 🏨

  • Guest (Browser) comes to the desk (Nginx)

  • Receptionist (Nginx) either gives information (static files) directly OR calls the right department (backend server) to handle it.

Flow:

Browser → Nginx → (optional) Backend server (Node.js, PHP, etc.) → Response → Browser

---

4. Installing Nginx (Example)

Ubuntu/Debian

sudo apt update
sudo apt install nginx

Check if running:

systemctl status nginx

Access in browser:

http://your-server-ip

You should see the Nginx welcome page.

---

5. Nginx Configuration Basics

Nginx configs are usually inside:

/etc/nginx/nginx.conf
/etc/nginx/sites-available/
/etc/nginx/sites-enabled/

---

5.1 Basic Web Server Config

Example: Serving static HTML files

server {
    listen 80;
    server_name example.com;

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

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

• listen 80; → Listen for HTTP requests on port 80

• server_name → Your domain

• root → Folder where your website files are

• location / → Defines how to handle requests

---

5.2 Reverse Proxy Example

You have a Node.js app running on localhost:3000, but you want the world to access it via example.com.

server {
    listen 80;
    server_name example.com;

    location / {
        proxy_pass http://localhost:3000;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
    }
}

Now Nginx forwards requests to your Node.js app.

---

6. Key Nginx Concepts

6.1 Static vs Dynamic Content

• Static = HTML, CSS, JS, images → Served directly by Nginx

• Dynamic = Generated by backend (Node.js, PHP) → Nginx passes the request to the backend

---

6.2 Reverse Proxy

Nginx sits in front of your backend servers and:

• Hides their real IP

• Balances load

• Caches responses

• Adds security

---

6.3 Load Balancing

If you have multiple backend servers, Nginx can distribute traffic.

upstream backend_servers {
    server backend1.example.com;
    server backend2.example.com;
}

server {
    listen 80;
    location / {
        proxy_pass http://backend_servers;
    }
}

Nginx sends requests round-robin (evenly) to each server.

---

6.4 Caching

Nginx can store responses temporarily to speed up future requests.

location /images/ {
    proxy_cache my_cache;
    proxy_cache_valid 200 1h;
}

---

6.5 Security

• Rate limiting (stop bots & abuse)

limit_req_zone $binary_remote_addr zone=one:10m rate=5r/s;

server {
    location /login {
        limit_req zone=one burst=10;
    }
}

• SSL/TLS (HTTPS)

server {
    listen 443 ssl;
    ssl_certificate /etc/ssl/cert.pem;
    ssl_certificate_key /etc/ssl/key.pem;
}

---

7. Nginx Process Model (Why It’s Fast)

• Master process → Reads config, manages workers

• Worker processes → Handle requests

• Event-driven → Workers handle many connections at once without blocking

This is why Nginx can handle tens of thousands of concurrent connections.

---

8. Real-World Example Setup

You have:

• React Frontend (static files in /var/www/react)

• Node.js API (running on localhost:5000)

Nginx Config:

server {
    listen 80;
    server_name example.com;

    location / {
        root /var/www/react;
        index index.html;
        try_files $uri /index.html;
    }

    location /api/ {
        proxy_pass http://localhost:5000/;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
    }
}

✅ Static files served directly
✅ API requests sent to backend

---

9. Advanced Features

• Gzip compression → Smaller response size

gzip on;
gzip_types text/plain application/json;

• HTTP/2 support

listen 443 ssl http2;

• WebSocket support (real-time apps)

proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";

• Redirect HTTP → HTTPS

server {
    listen 80;
    return 301 https://$host$request_uri;
}

---

10. Summary Table

Feature	Purpose
Web Server	Serve static files fast
Reverse Proxy	Forward requests to backend
Load Balancing	Distribute load across servers
Caching	Speed up repeated requests
SSL/TLS	Secure connections
Rate Limiting	Control abusive traffic

---

If you want, I can now create a full real-world Nginx config file that:

• Serves React frontend

• Proxies API to Node.js

• Redirects HTTP to HTTPS

• Enables Gzip, caching, and rate limiting
  so you’ll have a production-ready setup.