<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/">
    <channel>
        <title>NOCTURNE Blog</title>
        <link>https://nocturne.axcora.com/blog</link>
        <description>NOCTURNE Blog</description>
        <lastBuildDate>Tue, 20 Oct 2026 00:00:00 GMT</lastBuildDate>
        <docs>https://validator.w3.org/feed/docs/rss2.html</docs>
        <generator>https://github.com/jpmonette/feed</generator>
        <language>en</language>
        <item>
            <title><![CDATA[Why We Built Nocturne — A Premium Docusaurus Documentation System]]></title>
            <link>https://nocturne.axcora.com/blog/why-we-built-nocturne</link>
            <guid>https://nocturne.axcora.com/blog/why-we-built-nocturne</guid>
            <pubDate>Tue, 20 Oct 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Why Axcora built Nocturne — a premium Docusaurus documentation system. The case for better documentation in 2026.]]></description>
            <content:encoded><![CDATA[<p>Documentation is the first thing your users see. And the last thing teams polish.</p>
<p>Most Docusaurus sites look the same. Default theme. Default layout. Default typography. Nothing wrong with that — but nothing memorable either.</p>
<p><strong>We built Nocturne because documentation deserves better.</strong></p>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="the-problem">The Problem<a href="https://nocturne.axcora.com/blog/why-we-built-nocturne#the-problem" class="hash-link" aria-label="Direct link to The Problem" title="Direct link to The Problem" translate="no">​</a></h2>
<p>Docusaurus is excellent. It's the most popular documentation framework for a reason.</p>
<p>But out of the box, every Docusaurus site looks identical.</p>
<ul>
<li class="">Same navbar</li>
<li class="">Same sidebar</li>
<li class="">Same typography</li>
<li class="">Same colors</li>
</ul>
<p>For a framework used by thousands of projects, that's a missed opportunity.</p>
<p><strong>Your documentation should look like your product.</strong></p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="what-we-built">What We Built<a href="https://nocturne.axcora.com/blog/why-we-built-nocturne#what-we-built" class="hash-link" aria-label="Direct link to What We Built" title="Direct link to What We Built" translate="no">​</a></h2>
<p>Nocturne is a <strong>premium Docusaurus theme</strong> with:</p>
<ul>
<li class=""><strong>Elegant design system</strong> — dark mode, high contrast, editorial layout</li>
<li class=""><strong>Decap CMS pre-configured</strong> — edit content from a browser</li>
<li class=""><strong>Pagefind search</strong> — instant search across all docs</li>
<li class=""><strong>Full documentation sections</strong> — Getting Started, Configuration, Customization, Developer Guide</li>
</ul>
<p>It's not a theme tweak. It's a complete production system.</p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="why-premium-matters">Why Premium Matters<a href="https://nocturne.axcora.com/blog/why-we-built-nocturne#why-premium-matters" class="hash-link" aria-label="Direct link to Why Premium Matters" title="Direct link to Why Premium Matters" translate="no">​</a></h2>
<p>Some teams ship documentation that looks like an afterthought.</p>
<p>But documentation <strong>is</strong> your product. It's what your users read first, reference daily, and judge you by.</p>
<p><strong>Nocturne makes documentation look as professional as the product it describes.</strong></p>
<ul>
<li class="">No more default Docusaurus look</li>
<li class="">No more mismatched branding</li>
<li class="">No more "we'll polish it later"</li>
</ul>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="what-you-get">What You Get<a href="https://nocturne.axcora.com/blog/why-we-built-nocturne#what-you-get" class="hash-link" aria-label="Direct link to What You Get" title="Direct link to What You Get" translate="no">​</a></h2>
<table><thead><tr><th>Feature</th><th>What It Does</th></tr></thead><tbody><tr><td>Premium design</td><td>Elegant, dark mode by default</td></tr><tr><td>Decap CMS</td><td>Edit without code</td></tr><tr><td>Pagefind search</td><td>Instant search</td></tr><tr><td>Data files</td><td>Site, navbar, widgets, home</td></tr><tr><td>Full docs</td><td>4 categories, 24+ pages</td></tr></tbody></table>
<p><strong>One payment. Own forever. No renewal.</strong></p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="get-nocturne">Get Nocturne<a href="https://nocturne.axcora.com/blog/why-we-built-nocturne#get-nocturne" class="hash-link" aria-label="Direct link to Get Nocturne" title="Direct link to Get Nocturne" translate="no">​</a></h2>
<p>Ready to build documentation that lasts forever?</p>
<p><strong><a href="https://creativitaz.gumroad.com/l/nocturne" target="_blank" rel="noopener noreferrer" class="">Get Nocturne on Gumroad — $145 →</a></strong></p>
<p>Or explore the live demo first:</p>
<p><strong><a href="https://docspycorapro.axcora.com/" target="_blank" rel="noopener noreferrer" class="">See Nocturne Demo →</a></strong></p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="next-steps">Next Steps<a href="https://nocturne.axcora.com/blog/why-we-built-nocturne#next-steps" class="hash-link" aria-label="Direct link to Next Steps" title="Direct link to Next Steps" translate="no">​</a></h2>
<ul>
<li class=""><a class="" href="https://nocturne.axcora.com/docs/intro">Introduction</a> — what is Nocturne</li>
<li class=""><a class="" href="https://nocturne.axcora.com/docs/getting-started/">Getting Started</a> — install and run</li>
<li class=""><a class="" href="https://nocturne.axcora.com/docs/developer-guide/architecture">Architecture</a> — how it works</li>
</ul>]]></content:encoded>
            <category>Docusaurus</category>
            <category>Documentation</category>
            <category>Design</category>
        </item>
        <item>
            <title><![CDATA[Nocturne vs Default Docusaurus — Which Should You Choose?]]></title>
            <link>https://nocturne.axcora.com/blog/nocturne-vs-default-docusaurus</link>
            <guid>https://nocturne.axcora.com/blog/nocturne-vs-default-docusaurus</guid>
            <pubDate>Thu, 15 Oct 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Compare Nocturne with default Docusaurus. Design, CMS, search, and developer experience. Which is right for your team?]]></description>
            <content:encoded><![CDATA[<p>Docusaurus is the most popular documentation framework. It's fast, flexible, and free.</p>
<p><strong>Nocturne</strong> is a premium theme built on top of it.</p>
<p>Here's how they compare.</p>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="the-core-difference">The Core Difference<a href="https://nocturne.axcora.com/blog/nocturne-vs-default-docusaurus#the-core-difference" class="hash-link" aria-label="Direct link to The Core Difference" title="Direct link to The Core Difference" translate="no">​</a></h2>
<table><thead><tr><th></th><th>Default Docusaurus</th><th>Nocturne</th></tr></thead><tbody><tr><td><strong>Design</strong></td><td>Default theme</td><td>Premium Nocturne theme</td></tr><tr><td><strong>Dark mode</strong></td><td>Optional</td><td>Default</td></tr><tr><td><strong>CMS</strong></td><td>Not included</td><td>Decap CMS pre-configured</td></tr><tr><td><strong>Search</strong></td><td>Manual setup</td><td>Pagefind pre-wired</td></tr><tr><td><strong>Data files</strong></td><td>None</td><td>4 JSON files</td></tr><tr><td><strong>Documentation</strong></td><td>Starter docs</td><td>Full 24+ pages</td></tr><tr><td><strong>Price</strong></td><td>Free</td><td>$145 one-time</td></tr></tbody></table>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="design">Design<a href="https://nocturne.axcora.com/blog/nocturne-vs-default-docusaurus#design" class="hash-link" aria-label="Direct link to Design" title="Direct link to Design" translate="no">​</a></h2>
<p><strong>Default Docusaurus</strong> ships with the classic Docusaurus theme — clean, functional, familiar.</p>
<p><strong>Nocturne</strong> ships with a premium editorial design — dark mode, high contrast, asymmetric grid.</p>
<p>Both are good. But they serve different purposes.</p>
<p><strong>Choose default</strong> if you want the familiar Docusaurus look.</p>
<p><strong>Choose Nocturne</strong> if you want your documentation to stand out.</p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="cms">CMS<a href="https://nocturne.axcora.com/blog/nocturne-vs-default-docusaurus#cms" class="hash-link" aria-label="Direct link to CMS" title="Direct link to CMS" translate="no">​</a></h2>
<p><strong>Default Docusaurus</strong> does not include a CMS. You edit Markdown files directly.</p>
<p><strong>Nocturne</strong> includes <strong>Decap CMS</strong> — a browser-based editor at <code>/admin/</code>.</p>
<ul>
<li class="">Edit content without code</li>
<li class="">Upload images</li>
<li class="">Manage blog posts</li>
<li class="">Your clients can do the same</li>
</ul>
<p><strong>Decap CMS is a game-changer for non-technical teams.</strong></p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="search">Search<a href="https://nocturne.axcora.com/blog/nocturne-vs-default-docusaurus#search" class="hash-link" aria-label="Direct link to Search" title="Direct link to Search" translate="no">​</a></h2>
<p><strong>Default Docusaurus</strong> uses Algolia DocSearch — a hosted service.</p>
<p><strong>Nocturne</strong> uses <strong>Pagefind</strong> — a client-side search that runs on your own infrastructure.</p>
<table><thead><tr><th>Feature</th><th>Algolia</th><th>Pagefind</th></tr></thead><tbody><tr><td>Cost</td><td>Free (with approval)</td><td>Free</td></tr><tr><td>Setup</td><td>Manual application</td><td>Pre-configured</td></tr><tr><td>Privacy</td><td>Third-party</td><td>Self-hosted</td></tr><tr><td>Speed</td><td>Fast</td><td>Fast</td></tr></tbody></table>
<p><strong>Pagefind wins on privacy and simplicity.</strong></p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="pricing">Pricing<a href="https://nocturne.axcora.com/blog/nocturne-vs-default-docusaurus#pricing" class="hash-link" aria-label="Direct link to Pricing" title="Direct link to Pricing" translate="no">​</a></h2>
<p><strong>Default Docusaurus</strong> — free.</p>
<p><strong>Nocturne</strong> — $145 one-time.</p>
<p>No subscription. No renewal. No license key.</p>
<p><strong>Nocturne pays for itself in time saved on design and setup.</strong></p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="the-verdict">The Verdict<a href="https://nocturne.axcora.com/blog/nocturne-vs-default-docusaurus#the-verdict" class="hash-link" aria-label="Direct link to The Verdict" title="Direct link to The Verdict" translate="no">​</a></h2>
<table><thead><tr><th>Use case</th><th>Recommendation</th></tr></thead><tbody><tr><td>Personal project</td><td>Default Docusaurus</td></tr><tr><td>Startup documentation</td><td><strong>Nocturne</strong></td></tr><tr><td>Agency client work</td><td><strong>Nocturne</strong></td></tr><tr><td>Enterprise docs</td><td><strong>Nocturne</strong></td></tr><tr><td>Learning Docusaurus</td><td>Default Docusaurus</td></tr></tbody></table>
<p><strong>Both are excellent. Nocturne is the premium path.</strong></p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="get-nocturne">Get Nocturne<a href="https://nocturne.axcora.com/blog/nocturne-vs-default-docusaurus#get-nocturne" class="hash-link" aria-label="Direct link to Get Nocturne" title="Direct link to Get Nocturne" translate="no">​</a></h2>
<p><strong><a href="https://creativitaz.gumroad.com/l/nocturne" target="_blank" rel="noopener noreferrer" class="">Get Nocturne on Gumroad — $145 →</a></strong></p>]]></content:encoded>
            <category>Docusaurus</category>
            <category>Comparison</category>
            <category>Design</category>
        </item>
        <item>
            <title><![CDATA[Deploy Nocturne to Cloudflare Pages in 5 Minutes]]></title>
            <link>https://nocturne.axcora.com/blog/deploy-nocturne-cloudflare</link>
            <guid>https://nocturne.axcora.com/blog/deploy-nocturne-cloudflare</guid>
            <pubDate>Sat, 10 Oct 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Step-by-step guide to deploy your Nocturne documentation to Cloudflare Pages — free hosting, automatic HTTPS, continuous deployment from GitHub.]]></description>
            <content:encoded><![CDATA[<p>Nocturne outputs pure static HTML. That means you can host it <strong>for free</strong> on Cloudflare Pages.</p>
<p>Here's the full walkthrough.</p>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="prerequisites">Prerequisites<a href="https://nocturne.axcora.com/blog/deploy-nocturne-cloudflare#prerequisites" class="hash-link" aria-label="Direct link to Prerequisites" title="Direct link to Prerequisites" translate="no">​</a></h2>
<ul>
<li class="">Nocturne installed locally</li>
<li class="">A GitHub account</li>
<li class="">A Cloudflare account (free)</li>
</ul>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-1--push-to-github">Step 1 — Push to GitHub<a href="https://nocturne.axcora.com/blog/deploy-nocturne-cloudflare#step-1--push-to-github" class="hash-link" aria-label="Direct link to Step 1 — Push to GitHub" title="Direct link to Step 1 — Push to GitHub" translate="no">​</a></h2>
<div class="language-bash codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-bash codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token function" style="color:rgb(80, 250, 123)">git</span><span class="token plain"> init</span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token function" style="color:rgb(80, 250, 123)">git</span><span class="token plain"> </span><span class="token function" style="color:rgb(80, 250, 123)">add</span><span class="token plain"> </span><span class="token builtin class-name" style="color:rgb(189, 147, 249)">.</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token function" style="color:rgb(80, 250, 123)">git</span><span class="token plain"> commit </span><span class="token parameter variable" style="color:rgb(189, 147, 249);font-style:italic">-m</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">"initial commit"</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token function" style="color:rgb(80, 250, 123)">git</span><span class="token plain"> remote </span><span class="token function" style="color:rgb(80, 250, 123)">add</span><span class="token plain"> origin https://github.com/YOUR_USERNAME/nocturne-docs.git</span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token function" style="color:rgb(80, 250, 123)">git</span><span class="token plain"> push </span><span class="token parameter variable" style="color:rgb(189, 147, 249);font-style:italic">-u</span><span class="token plain"> origin main</span><br></div></code></pre></div></div>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-2--test-the-build">Step 2 — Test the Build<a href="https://nocturne.axcora.com/blog/deploy-nocturne-cloudflare#step-2--test-the-build" class="hash-link" aria-label="Direct link to Step 2 — Test the Build" title="Direct link to Step 2 — Test the Build" translate="no">​</a></h2>
<div class="language-bash codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-bash codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token function" style="color:rgb(80, 250, 123)">npm</span><span class="token plain"> run build</span><br></div></code></pre></div></div>
<p>You should see:</p>
<div class="language-text codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-text codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token plain">[SUCCESS] Generated static files in "build".</span><br></div></code></pre></div></div>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-3--connect-to-cloudflare-pages">Step 3 — Connect to Cloudflare Pages<a href="https://nocturne.axcora.com/blog/deploy-nocturne-cloudflare#step-3--connect-to-cloudflare-pages" class="hash-link" aria-label="Direct link to Step 3 — Connect to Cloudflare Pages" title="Direct link to Step 3 — Connect to Cloudflare Pages" translate="no">​</a></h2>
<ol>
<li class="">Go to <a href="https://pages.cloudflare.com/" target="_blank" rel="noopener noreferrer" class="">pages.cloudflare.com</a></li>
<li class="">Click <strong>Create a project</strong></li>
<li class="">Click <strong>Connect to Git</strong></li>
<li class="">Authorize Cloudflare</li>
<li class="">Select your repository</li>
</ol>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-4--configure-build">Step 4 — Configure Build<a href="https://nocturne.axcora.com/blog/deploy-nocturne-cloudflare#step-4--configure-build" class="hash-link" aria-label="Direct link to Step 4 — Configure Build" title="Direct link to Step 4 — Configure Build" translate="no">​</a></h2>
<table><thead><tr><th>Setting</th><th>Value</th></tr></thead><tbody><tr><td><strong>Framework preset</strong></td><td>Docusaurus</td></tr><tr><td><strong>Build command</strong></td><td><code>npm run build</code></td></tr><tr><td><strong>Build output directory</strong></td><td><code>build</code></td></tr><tr><td><strong>Node version</strong></td><td><code>18</code></td></tr></tbody></table>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-5--deploy">Step 5 — Deploy<a href="https://nocturne.axcora.com/blog/deploy-nocturne-cloudflare#step-5--deploy" class="hash-link" aria-label="Direct link to Step 5 — Deploy" title="Direct link to Step 5 — Deploy" translate="no">​</a></h2>
<p>Click <strong>Save and Deploy</strong>.</p>
<p>After 1–2 minutes, your site is live at:</p>
<div class="language-text codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-text codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token plain">https://your-project.pages.dev</span><br></div></code></pre></div></div>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-6--custom-domain">Step 6 — Custom Domain<a href="https://nocturne.axcora.com/blog/deploy-nocturne-cloudflare#step-6--custom-domain" class="hash-link" aria-label="Direct link to Step 6 — Custom Domain" title="Direct link to Step 6 — Custom Domain" translate="no">​</a></h2>
<ol>
<li class="">Project → <strong>Custom domains</strong></li>
<li class="">Click <strong>Set up a domain</strong></li>
<li class="">Enter your domain</li>
<li class="">Follow the DNS instructions</li>
</ol>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="automatic-rebuilds">Automatic Rebuilds<a href="https://nocturne.axcora.com/blog/deploy-nocturne-cloudflare#automatic-rebuilds" class="hash-link" aria-label="Direct link to Automatic Rebuilds" title="Direct link to Automatic Rebuilds" translate="no">​</a></h2>
<p>Every push to <code>main</code> triggers a new build:</p>
<div class="language-bash codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-bash codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token function" style="color:rgb(80, 250, 123)">git</span><span class="token plain"> </span><span class="token function" style="color:rgb(80, 250, 123)">add</span><span class="token plain"> </span><span class="token builtin class-name" style="color:rgb(189, 147, 249)">.</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token function" style="color:rgb(80, 250, 123)">git</span><span class="token plain"> commit </span><span class="token parameter variable" style="color:rgb(189, 147, 249);font-style:italic">-m</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">"Update docs"</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token function" style="color:rgb(80, 250, 123)">git</span><span class="token plain"> push</span><br></div></code></pre></div></div>
<p>Cloudflare rebuilds automatically.</p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="get-nocturne">Get Nocturne<a href="https://nocturne.axcora.com/blog/deploy-nocturne-cloudflare#get-nocturne" class="hash-link" aria-label="Direct link to Get Nocturne" title="Direct link to Get Nocturne" translate="no">​</a></h2>
<p><strong><a href="https://creativitaz.gumroad.com/l/nocturne" target="_blank" rel="noopener noreferrer" class="">Get Nocturne on Gumroad — $145 →</a></strong></p>]]></content:encoded>
            <category>Deployment</category>
            <category>Docusaurus</category>
            <category>Tutorial</category>
        </item>
        <item>
            <title><![CDATA[How to Add Decap CMS to Docusaurus]]></title>
            <link>https://nocturne.axcora.com/blog/decap-cms-docusaurus</link>
            <guid>https://nocturne.axcora.com/blog/decap-cms-docusaurus</guid>
            <pubDate>Mon, 05 Oct 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Add Decap CMS to your Docusaurus site. Edit content from a browser, no code required.]]></description>
            <content:encoded><![CDATA[<p>Decap CMS is a Git-based CMS. It gives you a browser-based editor for your Docusaurus site — no backend needed.</p>
<p>Here's how to add it.</p>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="why-decap-cms">Why Decap CMS?<a href="https://nocturne.axcora.com/blog/decap-cms-docusaurus#why-decap-cms" class="hash-link" aria-label="Direct link to Why Decap CMS?" title="Direct link to Why Decap CMS?" translate="no">​</a></h2>
<ul>
<li class=""><strong>Git-based</strong> — content lives in your repo</li>
<li class=""><strong>No backend</strong> — no server to maintain</li>
<li class=""><strong>Free</strong> — runs from a CDN</li>
<li class=""><strong>Open source</strong> — no lock-in</li>
</ul>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-1--create-the-admin-files">Step 1 — Create the Admin Files<a href="https://nocturne.axcora.com/blog/decap-cms-docusaurus#step-1--create-the-admin-files" class="hash-link" aria-label="Direct link to Step 1 — Create the Admin Files" title="Direct link to Step 1 — Create the Admin Files" translate="no">​</a></h2>
<p>Create two files:</p>
<div class="language-text codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-text codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token plain">static/admin/index.html</span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">static/admin/config.yml</span><br></div></code></pre></div></div>
<p><strong><code>static/admin/index.html</code>:</strong></p>
<div class="language-html codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-html codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token doctype punctuation" style="color:rgb(248, 248, 242)">&lt;!</span><span class="token doctype doctype-tag">DOCTYPE</span><span class="token doctype"> </span><span class="token doctype name">html</span><span class="token doctype punctuation" style="color:rgb(248, 248, 242)">&gt;</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&lt;</span><span class="token tag" style="color:rgb(255, 121, 198)">html</span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&gt;</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&lt;</span><span class="token tag" style="color:rgb(255, 121, 198)">head</span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&gt;</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">  </span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&lt;</span><span class="token tag" style="color:rgb(255, 121, 198)">meta</span><span class="token tag" style="color:rgb(255, 121, 198)"> </span><span class="token tag attr-name" style="color:rgb(241, 250, 140)">charset</span><span class="token tag attr-value punctuation attr-equals" style="color:rgb(248, 248, 242)">=</span><span class="token tag attr-value punctuation" style="color:rgb(248, 248, 242)">"</span><span class="token tag attr-value" style="color:rgb(255, 121, 198)">utf-8</span><span class="token tag attr-value punctuation" style="color:rgb(248, 248, 242)">"</span><span class="token tag" style="color:rgb(255, 121, 198)"> </span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">/&gt;</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">  </span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&lt;</span><span class="token tag" style="color:rgb(255, 121, 198)">title</span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&gt;</span><span class="token plain">Content Manager</span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&lt;/</span><span class="token tag" style="color:rgb(255, 121, 198)">title</span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&gt;</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&lt;/</span><span class="token tag" style="color:rgb(255, 121, 198)">head</span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&gt;</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&lt;</span><span class="token tag" style="color:rgb(255, 121, 198)">body</span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&gt;</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">  </span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&lt;</span><span class="token tag" style="color:rgb(255, 121, 198)">script</span><span class="token tag" style="color:rgb(255, 121, 198)"> </span><span class="token tag attr-name" style="color:rgb(241, 250, 140)">src</span><span class="token tag attr-value punctuation attr-equals" style="color:rgb(248, 248, 242)">=</span><span class="token tag attr-value punctuation" style="color:rgb(248, 248, 242)">"</span><span class="token tag attr-value" style="color:rgb(255, 121, 198)">https://unpkg.com/decap-cms@^3.0.0/dist/decap-cms.js</span><span class="token tag attr-value punctuation" style="color:rgb(248, 248, 242)">"</span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&gt;</span><span class="token script"></span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&lt;/</span><span class="token tag" style="color:rgb(255, 121, 198)">script</span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&gt;</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&lt;/</span><span class="token tag" style="color:rgb(255, 121, 198)">body</span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&gt;</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&lt;/</span><span class="token tag" style="color:rgb(255, 121, 198)">html</span><span class="token tag punctuation" style="color:rgb(248, 248, 242)">&gt;</span><br></div></code></pre></div></div>
<p><strong><code>static/admin/config.yml</code>:</strong></p>
<div class="language-yaml codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-yaml codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token key atrule">backend</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">  </span><span class="token key atrule">name</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"> proxy</span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">  </span><span class="token key atrule">proxy_url</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"> http</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain">//localhost</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain">8081/api/v1</span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">  </span><span class="token key atrule">branch</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"> main</span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain" style="display:inline-block"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token key atrule">local_backend</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"> </span><span class="token boolean important">true</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain" style="display:inline-block"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token key atrule">media_folder</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">"static/img"</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token key atrule">public_folder</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">"/img"</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain" style="display:inline-block"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token key atrule">collections</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">  </span><span class="token punctuation" style="color:rgb(248, 248, 242)">-</span><span class="token plain"> </span><span class="token key atrule">name</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">"blog"</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">    </span><span class="token key atrule">label</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">"Blog Posts"</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">    </span><span class="token key atrule">folder</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">"blog"</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">    </span><span class="token key atrule">create</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"> </span><span class="token boolean important">true</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">    </span><span class="token key atrule">fields</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">      </span><span class="token punctuation" style="color:rgb(248, 248, 242)">-</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(248, 248, 242)">{</span><span class="token plain"> </span><span class="token key atrule">label</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">"Title"</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><span class="token plain"> </span><span class="token key atrule">name</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">"title"</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><span class="token plain"> </span><span class="token key atrule">widget</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">"string"</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(248, 248, 242)">}</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">      </span><span class="token punctuation" style="color:rgb(248, 248, 242)">-</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(248, 248, 242)">{</span><span class="token plain"> </span><span class="token key atrule">label</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">"Body"</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><span class="token plain"> </span><span class="token key atrule">name</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">"body"</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><span class="token plain"> </span><span class="token key atrule">widget</span><span class="token punctuation" style="color:rgb(248, 248, 242)">:</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">"markdown"</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(248, 248, 242)">}</span><br></div></code></pre></div></div>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-2--run-locally">Step 2 — Run Locally<a href="https://nocturne.axcora.com/blog/decap-cms-docusaurus#step-2--run-locally" class="hash-link" aria-label="Direct link to Step 2 — Run Locally" title="Direct link to Step 2 — Run Locally" translate="no">​</a></h2>
<p>Open two terminals:</p>
<p><strong>Terminal 1:</strong></p>
<div class="language-bash codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-bash codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token plain">npx decap-server</span><br></div></code></pre></div></div>
<p><strong>Terminal 2:</strong></p>
<div class="language-bash codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-bash codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token function" style="color:rgb(80, 250, 123)">npm</span><span class="token plain"> start</span><br></div></code></pre></div></div>
<p>Open:</p>
<div class="language-text codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-text codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token plain">http://localhost:3000/admin/index.html</span><br></div></code></pre></div></div>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-3--log-in">Step 3 — Log In<a href="https://nocturne.axcora.com/blog/decap-cms-docusaurus#step-3--log-in" class="hash-link" aria-label="Direct link to Step 3 — Log In" title="Direct link to Step 3 — Log In" translate="no">​</a></h2>
<p>Click <strong>Login</strong>. No password required in local mode.</p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-4--edit-content">Step 4 — Edit Content<a href="https://nocturne.axcora.com/blog/decap-cms-docusaurus#step-4--edit-content" class="hash-link" aria-label="Direct link to Step 4 — Edit Content" title="Direct link to Step 4 — Edit Content" translate="no">​</a></h2>
<ol>
<li class="">Click a collection</li>
<li class="">Click a file</li>
<li class="">Edit the fields</li>
<li class="">Click <strong>Save</strong></li>
</ol>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="what-nocturne-adds">What Nocturne Adds<a href="https://nocturne.axcora.com/blog/decap-cms-docusaurus#what-nocturne-adds" class="hash-link" aria-label="Direct link to What Nocturne Adds" title="Direct link to What Nocturne Adds" translate="no">​</a></h2>
<p>Nocturne ships with <strong>Decap CMS pre-configured</strong> for:</p>
<ul>
<li class="">Site settings</li>
<li class="">Navbar &amp; footer</li>
<li class="">Sidebar widgets</li>
<li class="">Homepage content</li>
<li class="">Documentation</li>
<li class="">Blog posts</li>
</ul>
<p><strong>No setup required.</strong></p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="get-nocturne">Get Nocturne<a href="https://nocturne.axcora.com/blog/decap-cms-docusaurus#get-nocturne" class="hash-link" aria-label="Direct link to Get Nocturne" title="Direct link to Get Nocturne" translate="no">​</a></h2>
<p><strong><a href="https://creativitaz.gumroad.com/l/nocturne" target="_blank" rel="noopener noreferrer" class="">Get Nocturne on Gumroad — $145 →</a></strong></p>]]></content:encoded>
            <category>Decap CMS</category>
            <category>Docusaurus</category>
            <category>Tutorial</category>
        </item>
        <item>
            <title><![CDATA[Pagefind Search for Docusaurus — Fast, Private, Free]]></title>
            <link>https://nocturne.axcora.com/blog/pagefind-search-docusaurus</link>
            <guid>https://nocturne.axcora.com/blog/pagefind-search-docusaurus</guid>
            <pubDate>Thu, 01 Oct 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[Add Pagefind search to your Docusaurus site. Fast, private, and free — no external service.]]></description>
            <content:encoded><![CDATA[<p>Search is essential for documentation. But most search solutions require an external service.</p>
<p><strong>Pagefind</strong> doesn't. It indexes your site at build time and serves search from static files.</p>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="why-pagefind">Why Pagefind?<a href="https://nocturne.axcora.com/blog/pagefind-search-docusaurus#why-pagefind" class="hash-link" aria-label="Direct link to Why Pagefind?" title="Direct link to Why Pagefind?" translate="no">​</a></h2>
<table><thead><tr><th>Feature</th><th>Algolia</th><th>Pagefind</th></tr></thead><tbody><tr><td>Cost</td><td>Free (with approval)</td><td>Free</td></tr><tr><td>Setup</td><td>Manual application</td><td>One command</td></tr><tr><td>Privacy</td><td>Third-party</td><td>Self-hosted</td></tr><tr><td>Speed</td><td>Fast</td><td>Fast</td></tr><tr><td>Offline</td><td>No</td><td>Yes</td></tr></tbody></table>
<p><strong>Pagefind wins on privacy and simplicity.</strong></p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-1--install">Step 1 — Install<a href="https://nocturne.axcora.com/blog/pagefind-search-docusaurus#step-1--install" class="hash-link" aria-label="Direct link to Step 1 — Install" title="Direct link to Step 1 — Install" translate="no">​</a></h2>
<div class="language-bash codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-bash codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token function" style="color:rgb(80, 250, 123)">npm</span><span class="token plain"> </span><span class="token function" style="color:rgb(80, 250, 123)">install</span><span class="token plain"> docusaurus-plugin-pagefind</span><br></div></code></pre></div></div>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-2--configure">Step 2 — Configure<a href="https://nocturne.axcora.com/blog/pagefind-search-docusaurus#step-2--configure" class="hash-link" aria-label="Direct link to Step 2 — Configure" title="Direct link to Step 2 — Configure" translate="no">​</a></h2>
<p>In <code>docusaurus.config.ts</code>:</p>
<div class="language-typescript codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-typescript codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token plain">plugins</span><span class="token operator">:</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(248, 248, 242)">[</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">  </span><span class="token punctuation" style="color:rgb(248, 248, 242)">[</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">    </span><span class="token string" style="color:rgb(255, 121, 198)">'docusaurus-plugin-pagefind'</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">    </span><span class="token punctuation" style="color:rgb(248, 248, 242)">{</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">      forceLanguage</span><span class="token operator">:</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">'en'</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">      excludeSelectors</span><span class="token operator">:</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(248, 248, 242)">[</span><span class="token string" style="color:rgb(255, 121, 198)">'.navbar'</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">'footer'</span><span class="token punctuation" style="color:rgb(248, 248, 242)">]</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">    </span><span class="token punctuation" style="color:rgb(248, 248, 242)">}</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">  </span><span class="token punctuation" style="color:rgb(248, 248, 242)">]</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token punctuation" style="color:rgb(248, 248, 242)">]</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><br></div></code></pre></div></div>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-3--build">Step 3 — Build<a href="https://nocturne.axcora.com/blog/pagefind-search-docusaurus#step-3--build" class="hash-link" aria-label="Direct link to Step 3 — Build" title="Direct link to Step 3 — Build" translate="no">​</a></h2>
<div class="language-bash codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-bash codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token function" style="color:rgb(80, 250, 123)">npm</span><span class="token plain"> run build</span><br></div></code></pre></div></div>
<p>Pagefind indexes your site during the build.</p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-4--test">Step 4 — Test<a href="https://nocturne.axcora.com/blog/pagefind-search-docusaurus#step-4--test" class="hash-link" aria-label="Direct link to Step 4 — Test" title="Direct link to Step 4 — Test" translate="no">​</a></h2>
<p>Search works only after a <strong>production build</strong>. Run:</p>
<div class="language-bash codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-bash codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token function" style="color:rgb(80, 250, 123)">npm</span><span class="token plain"> run serve</span><br></div></code></pre></div></div>
<p>Then test search in your browser.</p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="nocturne-includes-pagefind">Nocturne Includes Pagefind<a href="https://nocturne.axcora.com/blog/pagefind-search-docusaurus#nocturne-includes-pagefind" class="hash-link" aria-label="Direct link to Nocturne Includes Pagefind" title="Direct link to Nocturne Includes Pagefind" translate="no">​</a></h2>
<p>Nocturne ships with Pagefind <strong>pre-configured</strong>. No setup required.</p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="get-nocturne">Get Nocturne<a href="https://nocturne.axcora.com/blog/pagefind-search-docusaurus#get-nocturne" class="hash-link" aria-label="Direct link to Get Nocturne" title="Direct link to Get Nocturne" translate="no">​</a></h2>
<p><strong><a href="https://creativitaz.gumroad.com/l/nocturne" target="_blank" rel="noopener noreferrer" class="">Get Nocturne on Gumroad — $145 →</a></strong></p>]]></content:encoded>
            <category>Search</category>
            <category>Docusaurus</category>
            <category>Performance</category>
        </item>
        <item>
            <title><![CDATA[Migrate from GitBook to Docusaurus — Zero Hosting Cost]]></title>
            <link>https://nocturne.axcora.com/blog/migrate-gitbook-to-docusaurus</link>
            <guid>https://nocturne.axcora.com/blog/migrate-gitbook-to-docusaurus</guid>
            <pubDate>Fri, 25 Sep 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[How to migrate from GitBook to Docusaurus. Keep your content, ditch the subscription, host for free.]]></description>
            <content:encoded><![CDATA[<p>GitBook is a hosted documentation platform. It's convenient — but it comes with monthly costs and vendor lock-in.</p>
<p><strong>Docusaurus</strong> is the open-source alternative. You own everything.</p>
<p>Here's how to migrate.</p>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="why-migrate">Why Migrate<a href="https://nocturne.axcora.com/blog/migrate-gitbook-to-docusaurus#why-migrate" class="hash-link" aria-label="Direct link to Why Migrate" title="Direct link to Why Migrate" translate="no">​</a></h2>
<table><thead><tr><th></th><th>GitBook</th><th>Docusaurus</th></tr></thead><tbody><tr><td><strong>Hosting</strong></td><td>$8–$50/month</td><td>$0</td></tr><tr><td><strong>Ownership</strong></td><td>Platform-locked</td><td>100% source</td></tr><tr><td><strong>Customization</strong></td><td>Limited</td><td>Full</td></tr><tr><td><strong>Search</strong></td><td>Built-in</td><td>Pagefind (free)</td></tr><tr><td><strong>CMS</strong></td><td>Built-in</td><td>Decap CMS (free)</td></tr></tbody></table>
<p><strong>Docusaurus saves you $96–$600 per year.</strong></p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-1--export-gitbook-content">Step 1 — Export GitBook Content<a href="https://nocturne.axcora.com/blog/migrate-gitbook-to-docusaurus#step-1--export-gitbook-content" class="hash-link" aria-label="Direct link to Step 1 — Export GitBook Content" title="Direct link to Step 1 — Export GitBook Content" translate="no">​</a></h2>
<ol>
<li class="">Open your GitBook space</li>
<li class="">Click <strong>Settings</strong> → <strong>Export</strong></li>
<li class="">Choose <strong>Markdown</strong></li>
<li class="">Download the <code>.zip</code></li>
</ol>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-2--organize-content">Step 2 — Organize Content<a href="https://nocturne.axcora.com/blog/migrate-gitbook-to-docusaurus#step-2--organize-content" class="hash-link" aria-label="Direct link to Step 2 — Organize Content" title="Direct link to Step 2 — Organize Content" translate="no">​</a></h2>
<p>Move the Markdown files to your Docusaurus <code>docs/</code> folder:</p>
<div class="language-bash codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-bash codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token function" style="color:rgb(80, 250, 123)">mkdir</span><span class="token plain"> docs/</span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token function" style="color:rgb(80, 250, 123)">mv</span><span class="token plain"> gitbook-export/*.md docs/</span><br></div></code></pre></div></div>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-3--fix-frontmatter">Step 3 — Fix Frontmatter<a href="https://nocturne.axcora.com/blog/migrate-gitbook-to-docusaurus#step-3--fix-frontmatter" class="hash-link" aria-label="Direct link to Step 3 — Fix Frontmatter" title="Direct link to Step 3 — Fix Frontmatter" translate="no">​</a></h2>
<p>GitBook uses <code>---</code> frontmatter. Docusaurus does too. But some fields differ.</p>
<table><thead><tr><th>GitBook</th><th>Docusaurus</th></tr></thead><tbody><tr><td><code>title</code></td><td><code>title</code></td></tr><tr><td><code>description</code></td><td><code>description</code></td></tr><tr><td><code>---</code></td><td><code>---</code></td></tr></tbody></table>
<p><strong>Most frontmatter carries over unchanged.</strong></p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-4--add-to-sidebar">Step 4 — Add to Sidebar<a href="https://nocturne.axcora.com/blog/migrate-gitbook-to-docusaurus#step-4--add-to-sidebar" class="hash-link" aria-label="Direct link to Step 4 — Add to Sidebar" title="Direct link to Step 4 — Add to Sidebar" translate="no">​</a></h2>
<p>Edit <code>sidebars.ts</code>:</p>
<div class="language-typescript codeBlockContainer_Ckt0 theme-code-block" style="--prism-color:#F8F8F2;--prism-background-color:#282A36"><div class="codeBlockContent_QJqH"><pre tabindex="0" class="prism-code language-typescript codeBlock_bY9V thin-scrollbar" style="color:#F8F8F2;background-color:#282A36"><code class="codeBlockLines_e6Vv"><div class="token-line" style="color:#F8F8F2"><span class="token punctuation" style="color:rgb(248, 248, 242)">{</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">  type</span><span class="token operator">:</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">'category'</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">  label</span><span class="token operator">:</span><span class="token plain"> </span><span class="token string" style="color:rgb(255, 121, 198)">'Guides'</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">  items</span><span class="token operator">:</span><span class="token plain"> </span><span class="token punctuation" style="color:rgb(248, 248, 242)">[</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">    </span><span class="token string" style="color:rgb(255, 121, 198)">'getting-started'</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">    </span><span class="token string" style="color:rgb(255, 121, 198)">'advanced'</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain">  </span><span class="token punctuation" style="color:rgb(248, 248, 242)">]</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><span class="token plain"></span><br></div><div class="token-line" style="color:#F8F8F2"><span class="token plain"></span><span class="token punctuation" style="color:rgb(248, 248, 242)">}</span><span class="token punctuation" style="color:rgb(248, 248, 242)">,</span><br></div></code></pre></div></div>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="step-5--deploy">Step 5 — Deploy<a href="https://nocturne.axcora.com/blog/migrate-gitbook-to-docusaurus#step-5--deploy" class="hash-link" aria-label="Direct link to Step 5 — Deploy" title="Direct link to Step 5 — Deploy" translate="no">​</a></h2>
<p>Push to GitHub, deploy to Cloudflare Pages.</p>
<p>See <a class="" href="https://nocturne.axcora.com/blog/deploy-nocturne-cloudflare">Deploy Nocturne →</a> for details.</p>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="what-about-gitbook-features">What About GitBook Features?<a href="https://nocturne.axcora.com/blog/migrate-gitbook-to-docusaurus#what-about-gitbook-features" class="hash-link" aria-label="Direct link to What About GitBook Features?" title="Direct link to What About GitBook Features?" translate="no">​</a></h2>
<table><thead><tr><th>GitBook Feature</th><th>Docusaurus Replacement</th></tr></thead><tbody><tr><td>Search</td><td>Pagefind</td></tr><tr><td>CMS</td><td>Decap CMS</td></tr><tr><td>Analytics</td><td>Plausible</td></tr><tr><td>Comments</td><td>Giscus</td></tr><tr><td>Versions</td><td>Docusaurus versioning</td></tr></tbody></table>
<hr>
<h2 class="anchor anchorTargetStickyNavbar_Vzrq" id="get-nocturne">Get Nocturne<a href="https://nocturne.axcora.com/blog/migrate-gitbook-to-docusaurus#get-nocturne" class="hash-link" aria-label="Direct link to Get Nocturne" title="Direct link to Get Nocturne" translate="no">​</a></h2>
<p><strong><a href="https://creativitaz.gumroad.com/l/nocturne" target="_blank" rel="noopener noreferrer" class="">Get Nocturne on Gumroad — $145 →</a></strong></p>]]></content:encoded>
            <category>Migration</category>
            <category>Docusaurus</category>
            <category>Tutorial</category>
        </item>
    </channel>
</rss>