Production-Ready Server Setup

1. Remote Server Setup & Hardening

Target: any Ubuntu 22.04 / 24.04 LTS VPS (DigitalOcean, AWS EC2, Linode, Hetzner).

Initial Server Provisioning

• Create a droplet / instance with Ubuntu 22.04+, add your SSH public key during creation.
• Login as root: ssh root@your_server_ip
• Update system: apt update && apt upgrade -y
• Create a new sudo user: add deployer --> set strong password, then usermod -aG sudo deployer
• Copy SSH key to new user: rsync --archive --chown=deployer:deployer ~/.ssh /home/deployer/
• Test login: ssh deployer@your_server_ip

Security Hardening (Critical)

• Disable root SSH login & password auth --> edit /etc/ssh/sshd_config:

  PermitRootLogin no
  PasswordAuthentication no
  PubkeyAuthentication yes

  then sudo systemctl restart sshd
• Configure UFW firewall:

  sudo ufw allow OpenSSH
  sudo ufw allow 'Nginx Full'
  sudo ufw enable

• Install Fail2ban to block brute-force:

  sudo apt install fail2ban -y
  sudo systemctl enable fail2ban && sudo systemctl start fail2ban

• Automatic security updates:

  sudo apt install unattended-upgrades -y
  sudo dpkg-reconfigure --priority=low unattended-upgrades

• Set up a basic audit & logwatch (optional but recommended)

2. Installing & Configuring Nginx

Nginx will act as a reverse proxy for both React (static) and Django (dynamic) applications.

• Install Nginx: sudo apt install nginx -y
• Check status: sudo systemctl status nginx (should be active)
• Allow Nginx in firewall (already done with 'Nginx Full')
• Create server blocks for your domain (replace yourdomain.com):

  sudo mkdir -p /var/www/yourdomain.com/html
  sudo chown -R $USER:$USER /var/www/yourdomain.com/html

• Create configuration file: /etc/nginx/sites-available/yourdomain.com

  server {
      listen 80;
      server_name yourdomain.com www.yourdomain.com;
      root /var/www/yourdomain.com/html;
      index index.html;
  
      location / {
          try_files $uri $uri/ =404;
      }
  }

• Enable site: sudo ln -s /etc/nginx/sites-available/yourdomain.com /etc/nginx/sites-enabled/
• Test config & reload: sudo nginx -t && sudo systemctl reload nginx

3. Domain Registration & SSL (Let's Encrypt)

Obtain a Domain Name

• Buy a domain from registrars like Namecheap, GoDaddy, Cloudflare, Porkbun (approx $8-15/year).
• Set DNS A record: point @ and www to your server's public IP address.
• Wait for propagation (usually 1-5 minutes, can take up to an hour).
• Verify via dig yourdomain.com +short or ping.

Secure with SSL (Let's Encrypt - free & automated)

• Install Certbot and Nginx plugin:

  sudo apt install certbot python3-certbot-nginx -y

• Obtain certificate and auto-configure Nginx:

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

  Follow interactive prompts (enter email, agree to terms).
• Certbot will automatically update your Nginx config to use SSL and enable HTTP/2.
• Test auto-renewal: sudo certbot renew --dry-run
• Your site is now HTTPS-enabled! Nginx config now includes listen 443 ssl and redirects HTTP-->HTTPS.

4. Deploy React Application

Two approaches: build static files locally & upload, or build on server. We'll show best practice using CI/CD or manual.

Method A: Build on server (for simplicity)

• Install Node.js (LTS) on server:

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

• Clone your React repo or create a test app:

  git clone https://github.com/your-repo/your-react-app.git
  cd your-react-app
  npm install
  npm run build

• Move build output to web root:

  sudo rm -rf /var/www/yourdomain.com/html/*
  sudo cp -r build/* /var/www/yourdomain.com/html/

• Adjust ownership: sudo chown -R www-data:www-data /var/www/yourdomain.com/html

Method B: Serve React with Nginx (optimal)

Your existing Nginx config already serves static files. For client-side routing (React Router), update config:

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

Edit your domain config file: sudo nano /etc/nginx/sites-available/yourdomain.com (SSL version) and add the try_files directive inside the location / block. Then sudo nginx -t && sudo systemctl reload nginx.

CI/CD suggestion (GitHub Actions)

On push, build and rsync files to server. Example workflow step:

- name: Deploy to server
  run: |
    npm run build
    rsync -avz --delete build/ deployer@yourdomain.com:/var/www/yourdomain.com/html/

5. Deploy Django Application (with Gunicorn & Nginx)

We'll set up Django to run behind Nginx using Gunicorn as the application server.

Environment & Dependencies

• Install Python, pip, virtualenv:

  sudo apt install python3-pip python3-venv python3-dev -y

• Create project directory: sudo mkdir -p /var/www/django/yourproject and set ownership: sudo chown -R deployer:deployer /var/www/django
• Clone Django project or start new:

  cd /var/www/django/yourproject
  python3 -m venv venv
  source venv/bin/activate
  pip install django gunicorn psycopg2-binary

• Create Django project (example): django-admin startproject myproject .
• Update settings.py:

  ALLOWED_HOSTS = ['yourdomain.com', 'www.yourdomain.com']
  STATIC_ROOT = '/var/www/django/yourproject/staticfiles'

• Run migrations & collectstatic:

  python manage.py migrate
  python manage.py collectstatic --noinput

Gunicorn as a systemd service

• Test Gunicorn manually: gunicorn --bind 0.0.0.0:8000 myproject.wsgi (then CTRL+C)
• Create systemd service file: sudo nano /etc/systemd/system/gunicorn.service

  [Unit]
  Description=Gunicorn instance to serve Django
  After=network.target
  
  [Service]
  User=deployer
  Group=www-data
  WorkingDirectory=/var/www/django/yourproject
  Environment="PATH=/var/www/django/yourproject/venv/bin"
  ExecStart=/var/www/django/yourproject/venv/bin/gunicorn --workers 3 --bind unix:/var/www/django/yourproject/gunicorn.sock myproject.wsgi:application
  
  [Install]
  WantedBy=multi-user.target

• Start & enable:

  sudo systemctl start gunicorn
  sudo systemctl enable gunicorn
  sudo systemctl status gunicorn

Configure Nginx to proxy to Django

• Edit your Nginx config (SSL enabled) and add proxy pass for API or root location:

server {
    listen 443 ssl http2;
    server_name yourdomain.com www.yourdomain.com;

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

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

    location /api/ {
        include proxy_params;
        proxy_pass http://unix:/var/www/django/yourproject/gunicorn.sock;
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }

    location /admin/ {
        include proxy_params;
        proxy_pass http://unix:/var/www/django/yourproject/gunicorn.sock;
    }

    location /static/ {
        alias /var/www/django/yourproject/staticfiles/;
    }
}

• Test config & reload: sudo nginx -t && sudo systemctl reload nginx
• Ensure permissions: socket is readable by www-data --> sudo chmod 710 /var/www/django/yourproject and add deployer to www-data group: sudo usermod -aG www-data deployer

Production Best Practices & Monitoring

• Environment variables: use .env for Django secrets and never commit them.
• Process monitoring: besides systemd, consider supervisor or pm2 for Node apps.
• Database: Install PostgreSQL: sudo apt install postgresql postgresql-contrib and create database/user.
• Backups: automate database dumps and static file backups (e.g., rsync + cron).
• Security headers: add add_header X-Frame-Options DENY; etc. in Nginx.
• Log rotation: Nginx and Gunicorn logs are rotated automatically by logrotate.
• CDN for static assets: optional but recommended for React build.

Quick command recap

# Firewall & SSH hardening
sudo ufw allow OpenSSH && sudo ufw enable

# Nginx + Certbot
sudo apt install nginx certbot python3-certbot-nginx

# Django service check
sudo systemctl restart gunicorn
sudo journalctl -u gunicorn -f

# React build
npm run build && sudo cp -r build/* /var/www/yourdomain.com/html/