Deploy React and Next.js Apps as .onion Sites

The simplest approach is building a static React application and serving it with Nginx through Tor. This avoids running Node.js on the server, reducing the attack surface and resource usage:

# Build a static React app
npx create-react-app my-onion-site
cd my-onion-site

# Set the homepage for relative paths
# package.json:
# "homepage": "."

# Build static assets
npm run build

# Copy to web root
cp -r build/* /var/www/onion/

# Nginx config for React SPA on Tor
server {
    listen 127.0.0.1:8080;
    root /var/www/onion;
    index index.html;

    # SPA routing - serve index.html for all paths
    location / {
        try_files $uri $uri/ /index.html;
    }

    # Cache static assets aggressively
    location ~* \.(js|css|png|jpg|gif|ico|woff2|svg)$ {
        expires 1y;
        add_header Cache-Control "public, immutable";
    }

    # Gzip for faster Tor delivery
    gzip on;
    gzip_types text/css application/javascript application/json image/svg+xml;
    gzip_min_length 256;

    access_log off;
    error_log /dev/null;
}

Set "homepage": "." in package.json to generate relative asset paths instead of absolute ones. This ensures the app works correctly regardless of the .onion URL structure. Enable aggressive caching for hashed assets - React's build process generates unique filenames for each build, so long cache lifetimes are safe.

For Next.js applications requiring server-side rendering (SSR), run the Node.js server behind Nginx and Tor:

# next.config.js - Tor-optimized configuration
module.exports = {
  // Disable image optimization CDN
  images: {
    unoptimized: true,
  },
  // Disable telemetry
  telemetry: false,
  // Strict output
  output: 'standalone',
  // Disable external font loading
  optimizeFonts: false,
  // Custom asset prefix for .onion
  assetPrefix: '',
};

# Build and run
npm run build
node .next/standalone/server.js
# Listens on port 3000 by default

# Nginx proxy to Next.js
server {
    listen 127.0.0.1:8080;

    location /_next/static/ {
        alias /var/www/app/.next/static/;
        expires 1y;
        add_header Cache-Control "public, immutable";
    }

    location / {
        proxy_pass http://127.0.0.1:3000;
        proxy_http_version 1.1;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP "";
        proxy_set_header X-Forwarded-For "";
        proxy_read_timeout 120s;
    }

    access_log off;
    error_log /dev/null;
}

The standalone output mode creates a self-contained Node.js server without needing node_modules. Disable image optimization, telemetry, and external font loading to prevent outbound requests that could leak your server IP.

Tor adds significant latency to every request, making asset optimization critical for JavaScript applications. Apply these optimizations to improve load times:

• Code splitting - Only load the JavaScript needed for the current page. React.lazy() and Next.js dynamic imports reduce initial bundle size.
• Preload critical assets - Use <link rel="preload"> for above-the-fold CSS and JavaScript to trigger downloads early in the page load.
• Inline critical CSS - Embed the CSS needed for initial render directly in the HTML to avoid an extra round trip over Tor.
• Minimize API calls - Each HTTP request adds Tor circuit latency. Batch API calls, use GraphQL to reduce request count, or pre-render data into the HTML.
• Service Workers - Cache assets locally after first visit. Subsequent page loads bypass Tor entirely for cached resources, dramatically improving perceived performance.

Test your .onion site using Tor Browser's built-in developer tools. Pay attention to the waterfall chart - you will see significantly higher TTFB (Time to First Byte) due to Tor circuit latency. Optimize for fewer, larger transfers rather than many small ones.

AnubizHost provides VPS plans with Node.js, npm, and Tor pre-installed for deploying React and Next.js applications as .onion hidden services. Our NVMe SSD storage and multi-core processors handle SSR workloads efficiently, even with Tor's additional overhead.

Host your JavaScript application on our offshore servers in Iceland, Romania, and Finland. Pay with Bitcoin, Monero, or other cryptocurrencies - no KYC, no identity verification. Whether you are deploying a static React SPA or a full SSR Next.js application, AnubizHost provides the infrastructure, Tor configuration, and support to get your .onion site live fast.