DEV Community

JLi
JLi

Posted on

Checking out Docusaurus

This week I checked out a really cool SSG called Docusaurus. Its a very easy to use SSG that creates a nice documentation site from markdown files. When I first tried to set up a Docusaurus sample website I was very impress with how simple it was to set it up, and how good the website looked for such a simple setup. You can take a look at the sample website I made here.
I really liked how it had its own sections for Tutorials and Blogs, with a table of contents sidebar that allowed for incredibly easy navigation between the generated pages. Thus I wanted to start working towards a similar improvement to my own SSG, LENNAH.

My goal is to improve the accessibility of the generated HTML my SSG creates so the first goal was to make my HTMLs connected. I planned out several items to work towards to achieve this goal.

  • Create a generate homepage
  • Add a way to return to the homepage
  • Add a table of contents side bar like in Docusaurus
  • Add a navigation bar at the top

I wanted to first get a basic prototype that simply lets me at least navigate between pages because that would serve as the base foundation of my SSG's navigation. So my first prototype was implementing the homepage and adding a link that allowed the user to return to the homepage without using the browser's back button. These were fairly simple additions to LENNAH but were a nice change.

The next steps will be to figure out how to convert the simple return button into a part of a nav bar, and then figure out how to create a side bar using that knowledge. I think however, before that I will have to implement CSS support into LENNAH so I can provide the CSS needed for creating a nav bar or side bar. So I think that is the first step I will take to work towards this goal. Docusaurus is a really cool example to learn from so I highly recommend checking it out if you haven't already. So until next time, take care!

Top comments (0)