Skip to main content

Docusaurus Setup

This page explains how our website is set up and what to edit when you want to change it. This website is built using Docusaurus.

What is in the website/ folder​

  • website/docusaurus.config.js: main Docusaurus configuration (site URL, navbar, docs preset, theme).
  • website/sidebars.js: sidebar order and categories for docs pages.
  • website/docs/: Markdown docs pages.
  • website/src/pages/: standalone pages like app, download, and team.
  • website/src/components/: React components for the homepage.
  • website/src/css/custom.css: global theme colors and style overrides.

Core config in this project​

The main settings are in website/docusaurus.config.js:

  • url: 'https://frvnzz.github.io'
  • baseUrl: '/purrsistence/'
  • organizationName: 'frvnzz'
  • projectName: 'purrsistence'

These values are important for GitHub Pages deployment. If the repository name changes, baseUrl usually needs to change too.

The docs preset points to sidebarPath: './sidebars.js', so doc navigation is controlled there.

How the docs sidebar works​

website/sidebars.js defines tutorialSidebar:

  • intro
  • fssd-decisions
  • category: Developer Documentation

The Developer Documentation category is autogenerated from the website/docs/developer folder:

{
  type: 'autogenerated',
  dirName: 'developer',
}

This means every new file you add in website/docs/developer appears automatically in that category.

Common tasks​

Edit themeConfig.navbar.items in website/docusaurus.config.js.

Change colors/theme​

Edit variables in website/src/css/custom.css.