Next.js Docs & Changelog Site Template - MDX, Search & Dark Mode

A complete documentation, changelog and blog website for a software product, built with Next.js 16 (App Router), TypeScript and MDX and exported as plain static files. There is no database and no server after the build: you write MDX files, run one command and upload the out folder to any static host. The demo content documents an invented HTTP client library called Brindle; replace it with your own product.

What you get

• Docs engine: a sidebar generated from a content manifest (sections and ordering), an on-this-page table of contents with scroll spy, previous and next links, breadcrumbs, and versioned docs with a v1 and v2 switcher that keeps the reader on the same page when it exists in the other version, plus a banner on older versions
• Search: client-side full-text search over an index generated at build time. It opens with the slash key or Ctrl/Cmd+K, highlights matches, works from the keyboard, limits results to the current docs version unless you ask for all, and also has a /search/ page. No external service is involved
• Changelog: dated MDX release entries with Added, Changed, Fixed and Removed badges, a filter by type, one page per release, and both an RSS and an Atom feed
• Blog: posts with tags, tag pages and an RSS feed
• MDX components: callouts (note, tip, warning, danger), tabs that stay in sync and remember the choice, numbered steps, file trees and grouped change lists, plus code blocks with titles, line highlighting, optional line numbers and a copy button
• Build-time syntax highlighting with Shiki and two original colour themes, so code looks right in light and dark mode without any client-side highlighter
• SEO basics: sitemap.xml, robots.txt, canonical URLs, Open Graph and Twitter tags, and a 404 page. No social preview image is included
• Design: an editorial paper-and-ink look with a serif display face and a humanist sans for the interface (system fonts only), a reading column of about 68 characters, muted indigo links, hairline rules, margin-note callouts and generous code blocks. Dark mode is ink-black with warm text. Nothing is loaded from the network
• Accessibility and comfort: skip link, landmarks, visible keyboard focus, full keyboard use, reduced-motion support, a print stylesheet, dark mode without a flash on load, and layouts that fit a 375 px phone
• Demo content: 15 documentation pages in v2, 8 in v1, 8 release entries and 3 blog posts, written as realistic reference, guide and troubleshooting pages
• Checks: 98 Vitest tests (content manifest and frontmatter validation, search index builder and ranking, feed generation, slug and URL handling, MDX component props, colour contrast of the code themes and the CSS colour tokens, and a deterministic hostile-input pass), plus scripts that check every internal link of the built site, run structural accessibility checks on every page, and request every page type from a local static server

Requirements

• Node.js 20.19+, 22.13+ or 24+, and npm (the package declares exactly this range, which is what the test and lint tooling supports). Development and testing were done on Node.js 24; Node.js 22 or 24 is recommended
• A browser from 2024 or later: the styles use the CSS light-dark() colour function
• Any static file host for the finished site (the build writes plain HTML, CSS and JavaScript)

How to start

• Run npm install, then npm run dev and open http://localhost:3000
• Run npm run build, then npm start to preview the exported out folder locally, and upload out to your host
• Edit site.config.ts for the name and install command, content/manifest.json for versions and sections, and the MDX files under content for pages, releases and posts. Set the SITE_URL environment variable at build time so canonical URLs, the sitemap and the feeds use your real address
• Run npm run verify for the type check, lint, tests, production build, link check, accessibility check and smoke test in one go

What is not included

• The Brindle library is fictional. The demo pages describe an API that does not exist, so replace the content before publishing
• No CMS or web editor, no comments, no analytics, no hosted search service and no translations: the site is English only
• The site must be served from the root of a domain or subdomain. Serving it from a sub-path is not supported
• Feeds carry summaries, not the full text of each entry
• No deployment files for specific hosts and no CI configuration
• The release filter works per release: an entry that contains several kinds of change is shown or hidden as a whole, and the groups of other types inside it are hidden
• A small post-build script is part of the build. It only does something on Windows, where Next.js 16.4 writes some prefetch files under different names than the browser asks for

Download: one .zip with the source code only (TypeScript and React source, CSS, MDX demo content, configuration, tests, scripts and the package lock file). There is no README or separate documentation: the demo pages show how every feature is used. Personal and Commercial licenses are explained on the store's license page.