DEV Community 👩‍💻👨‍💻

Tuan Thanh Tan
Tuan Thanh Tan

Posted on

Implement cool features for my static site generator

Introduction

Hello everyone, my name is Dustin. Today, I'd like to talk about my experience of borrowing some cool features from docusaurus.io to add it to my static site generator.

What I added

  1. Fully support for markdown file
  2. Handling metadata
  3. Support static assets such as images

Process

Implementing those 3 features was quite simple. For metadata and markdown file, I mainly used an external library: showdown to convert from markdown files to html files as well as parsing metadata from markdown files.
However, implementing the support for static assets such as images is a bit more interesting. I had to use another external library called fs-extra to copy assets folder from user to the dist folder. I also had to create another new class called CopyFolder where I used fs.copy method to copy assets folder

Recommend for my friend?

Yes, Docusaurus is highly recommended for developers who just want a simple document for their project, developers just need to focus on the context, Docusaurus will take care of the rest.

Future issues

The next step that I wanted to do is to improve static files because right now users have to use exact same word assets to make the program run properly.

In the future, I think I'll add Themes and main page which will be generated automatically and styled by me with a random theme that I chose beforehand. The main page lists all other pages

My docusaurus sample repo on Github

Top comments (0)

This post blew up on DEV in 2020:

js visualized

🚀⚙️ JavaScript Visualized: the JavaScript Engine

As JavaScript devs, we usually don't have to deal with compilers ourselves. However, it's definitely good to know the basics of the JavaScript engine and see how it handles our human-friendly JS code, and turns it into something machines understand! 🥳

Happy coding!