{"product_id":"nextjs-docs-changelog-site-template","title":"Next.js Docs \u0026 Changelog Site Template - MDX, Search \u0026 Dark Mode","description":"\u003cp\u003eA complete documentation, changelog and blog website for a software product, built with \u003cstrong\u003eNext.js 16\u003c\/strong\u003e (App Router), \u003cstrong\u003eTypeScript\u003c\/strong\u003e and \u003cstrong\u003eMDX\u003c\/strong\u003e 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 \u003cstrong\u003eout\u003c\/strong\u003e folder to any static host. The demo content documents an invented HTTP client library called Brindle; replace it with your own product.\u003c\/p\u003e\u003ch3\u003eWhat you get\u003c\/h3\u003e\u003cul\u003e\n\u003cli\u003eDocs 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\u003c\/li\u003e\n\u003cli\u003eSearch: 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\u003c\/li\u003e\n\u003cli\u003eChangelog: 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\u003c\/li\u003e\n\u003cli\u003eBlog: posts with tags, tag pages and an RSS feed\u003c\/li\u003e\n\u003cli\u003eMDX 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\u003c\/li\u003e\n\u003cli\u003eBuild-time syntax highlighting with Shiki and two original colour themes, so code looks right in light and dark mode without any client-side highlighter\u003c\/li\u003e\n\u003cli\u003eSEO basics: sitemap.xml, robots.txt, canonical URLs, Open Graph and Twitter tags, and a 404 page. No social preview image is included\u003c\/li\u003e\n\u003cli\u003eDesign: 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\u003c\/li\u003e\n\u003cli\u003eAccessibility 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\u003c\/li\u003e\n\u003cli\u003eDemo content: 15 documentation pages in v2, 8 in v1, 8 release entries and 3 blog posts, written as realistic reference, guide and troubleshooting pages\u003c\/li\u003e\n\u003cli\u003eChecks: 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\u003c\/li\u003e\n\u003c\/ul\u003e\u003ch3\u003eRequirements\u003c\/h3\u003e\u003cul\u003e\n\u003cli\u003eNode.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\u003c\/li\u003e\n\u003cli\u003eA browser from 2024 or later: the styles use the CSS light-dark() colour function\u003c\/li\u003e\n\u003cli\u003eAny static file host for the finished site (the build writes plain HTML, CSS and JavaScript)\u003c\/li\u003e\n\u003c\/ul\u003e\u003ch3\u003eHow to start\u003c\/h3\u003e\u003cul\u003e\n\u003cli\u003eRun npm install, then npm run dev and open http:\/\/localhost:3000\u003c\/li\u003e\n\u003cli\u003eRun npm run build, then npm start to preview the exported out folder locally, and upload out to your host\u003c\/li\u003e\n\u003cli\u003eEdit 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\u003c\/li\u003e\n\u003cli\u003eRun npm run verify for the type check, lint, tests, production build, link check, accessibility check and smoke test in one go\u003c\/li\u003e\n\u003c\/ul\u003e\u003ch3\u003eWhat is not included\u003c\/h3\u003e\u003cul\u003e\n\u003cli\u003eThe Brindle library is fictional. The demo pages describe an API that does not exist, so replace the content before publishing\u003c\/li\u003e\n\u003cli\u003eNo CMS or web editor, no comments, no analytics, no hosted search service and no translations: the site is English only\u003c\/li\u003e\n\u003cli\u003eThe site must be served from the root of a domain or subdomain. Serving it from a sub-path is not supported\u003c\/li\u003e\n\u003cli\u003eFeeds carry summaries, not the full text of each entry\u003c\/li\u003e\n\u003cli\u003eNo deployment files for specific hosts and no CI configuration\u003c\/li\u003e\n\u003cli\u003eThe 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\u003c\/li\u003e\n\u003cli\u003eA 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\u003c\/li\u003e\n\u003c\/ul\u003e\u003cp\u003eDownload: 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.\u003c\/p\u003e","brand":"Snippet Crate","offers":[{"title":"Personal","offer_id":52045152321782,"sku":"SPF-NDC-PER","price":29.0,"currency_code":"USD","in_stock":true},{"title":"Commercial","offer_id":52045152354550,"sku":"SPF-NDC-COM","price":79.0,"currency_code":"USD","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0831\/7776\/7158\/files\/nextjs-docs-changelog-site-template-cover.png?v=1793021381","url":"https:\/\/snippetcrate.com\/products\/nextjs-docs-changelog-site-template","provider":"Snippet Crate","version":"1.0","type":"link"}