Nextra

Description

what is it ? : Next.js based static site generator. It is what has been used to build the entire dev section
URL : official website 
version : 4.0.0
Why ? :

• It supports Markdown and React components
• Simple and powerfull

Nextra Documentation: Nextra Documentation 

Folder Structure

The folder structure is important in Nextra as it determines how the content is organized and displayed.

• content
  • meta-doc
    • index.mdx
    • how-to-doc.mdx
    • subsection
      • index.mdx
      • example.mdx

The folder structure is as follows:

• content : The main folder for the documentation.
  • meta-doc : The folder for the Meta-Doc section.
    • index.mdx : The main page for the Meta-Doc section.
    • how-to-doc.mdx : A page for how to write documentation in Nextra.
    • subsection : A subsection of the Meta-Doc section.
      • index.mdx : The main page for the subsection.
      • example.mdx : An example page that do not exist.

Index

When creating a new section, use index.mdx to define the main page. This file will serve as the entry point for that section. For exemple content/meta-doc/index.mdx is the main page for the Meta-Doc section.

The index.mdx file should contain the following code:

---
asIndexPage: true
sidebarTitle: TheTitleOfTheSection
---

TheTitleOfTheSection

A short description of the section and its content.

Sidebar

The sidebar is automatically generated based on the folder structure. Each folder corresponds to a section, and each file within that folder corresponds to a page. The sidebar will automatically update to include the new files and folders.

To customize the sidebar, you can use the sidebarTitle frontmatter in your .mdx file. This will set the title of the file in the sidebar.

If you don’t add the sidebarTitle frontmatter, the title will default to the # heading of the page. The sidebarTitle frontmatter can be useful if you want to have a different title in the sidebar than the title on the page.

For example, if you have a file named how-to-doc.mdx, you can set the sidebar title to How to Doc in Nextra like this:

---
sidebarTitle: How to Doc in Nextra
---
 
# Title you want
 
## Content of the page
 
...

or

# How to Doc in Nextra
 
## Content of the page
 
...

Components

Nextra provides several base components to improve the documentation.

Go to the Nextra Documentation section built-ins  for more information.

Meta-Data

in a ts file name _meta.ts you can add meta-data to the page.

export default {
  "how-to-readme": {
    theme: {
      layout: "full",
      toc: false,
    },
  },
};

In this example, we set the layout to full and the toc to false for the page how-to-readme. Here : the result is that the page will be displayed in full width and without a table of contents.

for the possibility go to Nextra Documentation meta-data .