Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Table of Contents

Prerequisites

You need to have NodeJS and NPM command-line tools installed in your terminal. Run the following commands to check:

Code Block
npm -v
node -v

Get Started in 5 Minutes

Open a terminal and cd into your project's folder; regardless of the language, eco-system or platform you're using, run the following commands:

Code Block
npm i -g docusaurus-init docusaurus
docusaurus-init
mv docs-examples-from-docusaurus docs
mv website/blog-examples-from-docusaurus website/blog
cd website
docusaurus-start

Directory Structure

Your project file structure should look something like this:

Code Block
languagebash
titleFolder Structure
/project_root
  docs/
    doc-1.md
    doc-2.md
    doc-3.md
  website/
    blog/
      2016-3-11-oldest-post.md
      2017-10-24-newest-post.md
    core/
    node_modules/
    pages/
    static/
      css/
      img/
    package.json
    sidebar.json
    siteConfig.js

Editing Content

Editing an existing docs page

Edit docs by navigating to docs/ and editing the corresponding document:

...

For more information, checkout the docusaurus navigation docs.

Editing an existing blog post

Edit blog posts by navigating to website/blog and editing the corresponding post:

...

Checkout docusaurus blog docs to know more.

Adding Content

Adding a new docs page to an existing sidebar

  1. Create the doc as a new markdown file in /docs, example docs/newly-created-doc.md:

...

For more information, checkout the docusaurus navigation docs.

Adding a new blog post

Make sure there is a header link to your blog in website/siteConfig.js:

...

Checkout docusaurus blog docs to know more.

Adding items to your site's top navigation bar

Add links to docs, custom pages or external links by editing the headerLinks field of website/siteConfig.js:

...

For more information, checkout the docusaurus navigation docs.


Adding custom pages

Docusaurus uses React components to build pages; components must be saved as .js files in website/pages/en ; If you want your page to show up in your navigation header, you will need to update website/siteConfig.js to add to the headerLinks element, as shown below.

...

For more information, checkouot the docusaurus custom pages docs

Full Documentation

Full documentation can be found on docusaurus website.