Docusaurus Cheatsheet

Navbar

Edit docusaurus.config.ts to change items:

• type by default is a link item
  • dropdown provides a dropdown menu
  • docSidebar allowing using sidebarId instead of to so you can change the sidebar without updating the navbar
• position has left or `right

const config: Config = {
    // ...
    // themConfig > navBar
    title: 'at15',
    logo: {
        alt: 'at15 logo',
        src: 'img/at15.png',
    },
    items: [
        {to: '/blog', label: 'Blog', position: 'left'},
        {
            type: 'docSidebar',
            sidebarId: 'cheatSheetSidebar',
            position: 'left',
            label: 'CheatSheet',
        },
        {
            type: 'dropdown',
            label: 'Programming Languages',
            position: 'left',
            items: [
                {
                    label: 'General',
                    to: '/docs/programming-language',
                },
                {
                    label: 'Java',
                    to: '/docs/java',
                },
            ]
        },
        {
            label: 'About',
            position: 'right',
            to: '/about',
        },
    ]
}

Sidebar

The default sidebar is generated for the entire docs folder. However you can mix manual and generated sidebars. For example for each folder under docs you want to have a separate sidebar.

docs
   book
   flutter
   tennis

const sidebars: SidebarsConfig = {
    // By default, Docusaurus generates a sidebar from the docs folder structure
    // tutorialSidebar: [{type: 'autogenerated', dirName: '.'}],

    bookSidebar: [{type: 'autogenerated', dirName: 'book'}],
    flutterSidebar: [{type: 'autogenerated', dirName: 'flutter'}],
    tennisSidebar: [{type: 'autogenerated', dirName: 'tennis'}],
}