All Tools View Categories About Contact Privacy

Nginx Static Website Config Generator

Serve HTML, CSS and assets from disk with sensible caching and clean URLs.

Runs entirely in your browser - nothing is uploaded and no cloud connection is made.
Your static site config will appear here.
-
lines
-
blocks

About Nginx Static Website Config Generator

Serving a bundle of static files - a site built with a bundler like Vite or webpack, a static site generator such as Hugo or Eleventy, or hand-written HTML and CSS - is the single most common job nginx performs, yet it is also where small configuration mistakes quietly turn into outages. A root declared at the location level instead of the server level leaks into unrelated blocks, an index directive that omits a fallback serves directory listings you never intended, caching headers applied to HTML hide your own deploys for a year, and gzip switched on for everything pointlessly re-compresses images that were already compressed. Nginx Static Website Config Generator removes that guesswork: it produces a clean, conventional, dependency-free static-server block from a handful of inputs and then validates its own output before you ever copy it to a server.

The generated server block listens on port 80, binds server_name to your domain, and declares root at the server level so every location inherits the same document root without repetition or drift. The index directive lists the files nginx tries when a directory is requested, in your chosen precedence, and the location block drives request routing. With clean URLs enabled the generator emits try_files $uri $uri/ =404; which serves the exact file if it exists, tries the directory index next, and otherwise returns a genuine 404 - the safe, predictable default for most content sites. Disabling clean URLs changes the fallback to /index.html, which is the catch-all behaviour single-page applications expect when client-side routers handle unknown paths.

Performance controls are exposed without the usual footguns. Gzip, when enabled, is scoped only to text-like content types (HTML, CSS, JSON, JavaScript, SVG) and given a gzip_min_length so tiny responses are not compressed for zero benefit and extra CPU. The asset cache selector writes an expires directive plus a Cache-Control header on a single location that matches versioned file extensions - CSS, JS, images and web fonts. Choosing "1 year immutable" additionally sends public, immutable, telling browsers the file never changes and can be cached forever; that is correct precisely because you version your asset filenames. Plain HTML is deliberately left without a long cache so new deploys are picked up immediately rather than being served stale from a visitor's disk.

Validation is strict because static configs fail in subtle, annoying ways. The domain is matched against a hostname pattern, and the root must be an absolute path - a relative root is rejected up front because nginx would resolve it relative to its prefix and silently serve the wrong directory. At least one index file is required. After the block is assembled it is re-parsed by a built-in tokenizer, so unbalanced braces, missing semicolons or stray characters cannot reach your clipboard. Stat cards report the line count and the number of nested blocks, and copy, download and print exports are a single click away. Everything runs in the browser; your domain and filesystem paths are never transmitted to any server.

In real deployments this block is the foundation that the SSL and redirect generators build on: serve the static site on port 80, then add a 443 server block for HTTPS or let a load balancer or CDN sit in front. Because the generator emits one isolated server block with no upstreams, proxies or shared snippets, it drops straight into any nginx install and composes cleanly with separate caching, logging or security-header configuration files without directive collisions. That makes it a dependable starting point whether you are shipping a marketing site, a documentation portal, a customer dashboard front end, or the static build output of a larger application.

Beyond correctness, the generator is a teaching tool. Each option maps to a real nginx directive you can read back and understand, so the config you copy is also documentation for your own team. The sample button fills realistic values so you can see a complete, working block in seconds, and clearing the form resets every control to its safe default. Whether you manage one site or dozens, standardising on a generator like this removes per-developer variation, keeps your conf.d directory readable, and gives you a repeatable, auditable nginx setup that passes nginx -t on the first try. The same block also serves as a safe template you can fork for staging and preview environments.

Features

  • Server-level root declared once so every location inherits the document root.
  • Configurable index list with your chosen precedence.
  • try_files clean-URL routing with a safe =404 fallback (or index.html catch-all).
  • Gzip scoped to text types above a minimum length.
  • Asset caching by extension with expires and Cache-Control.
  • Immutable option for versioned filenames.
  • Self-verifying output re-parsed before display.
  • Statistics - line and block counts.
  • Copy / Download / Print plus sample and clear.

How to Use

  1. Enter your domain (e.g. example.com).
  2. Enter the document root as an absolute path.
  3. List index files in precedence order.
  4. Toggle clean URLs (try_files =404) or SPA catch-all.
  5. Pick gzip and cache duration from the selects.
  6. Click Generate (or Load sample) and review.
  7. Export and drop into conf.d, run nginx -t and reload.

Examples

Example 1 - blog. Domain example.com, root /var/www/example.com, index index.html, try_files on, 7-day cache: a standard marketing/blog server.

Example 2 - SPA. Same but clean URLs off: unknown paths rewrite to /index.html so client routing handles them.

Example 3 - versioned assets. Cache set to 1 year immutable: css/js/png served with public, immutable so browsers keep them forever.

Example 4 - no gzip. Gzip off for a pure image host where there is nothing to compress.

Example 5 - invalid root. A relative path like www/example.com is rejected with a clear absolute-path error.

Benefits

  • No root mistakes - root is declared at server level and inherited by every location, so it cannot leak or drift.
  • Safe caching - HTML stays fresh while versioned assets can be marked immutable.
  • Validated input - an absolute document root and a valid domain are enforced before generation.
  • Self-checked output - the finished block is re-parsed to catch structural errors.
  • Fast to ship - the result is ready for nginx -t in seconds.
  • Private by design - all processing happens only in your browser.

Frequently Asked Questions

Where does the root point?
It must be an absolute path on the server, typically under /var/www/ or /srv/www. nginx reads files relative to that directory.
What does try_files do?
It tries the requested URI, then the URI as a directory, then falls back. With clean URLs enabled the fallback is =404 so unknown paths return a real 404 instead of rewriting to index.html.
Which files get long cache headers?
Hashed or versioned assets (css, js, images, fonts) get the expiry; HTML is served fresh so content updates are picked up immediately.
Is gzip safe to enable?
Yes. The generator only gzips text-like types above a small minimum size, which is the recommended practice.
Does this generate HTTPS?
No. This is the plain HTTP static server. Use the SSL config generator for a 443 block and redirect.
How do I deploy it?
Save as a file in /etc/nginx/conf.d/ or sites-available, enable it, run nginx -t and reload.
Is the output checked?
Yes, the config is re-parsed with a built-in tokenizer before display.
Is anything uploaded?
No. Everything runs locally in your browser.