DEV Community

Qiwen Yu
Qiwen Yu

Posted on

Lab 6 Learn from Docusaurus for My SSG: TextHTMLPress

Docusaurus Dive-in

Docusaurus will help you ship a beautiful documentation site in no time. Docusaurus is a static-site generator. It builds a single-page application with a fast client-side navigation, leveraging the full power of React to make your site interactive. It provides out-of-the-box documentation features, but can be used to create any kind of site (personal website, product, blog, marketing landing pages, etc).
In one sentence, it is a easy-to-use static site generator, and fully support MarkDown files.

To set up a new website:

  • With node.js, $ npx create-docusaurus@latest my-website classic
  • Run development server, $ cd my-website, npm start
  • Create a new repo and publish it on GitHub.
  • Locally, deploy using $ GIT_USER=<Your GitHub username> USE_SSH=true yarn deploy

My website of this repo can be found here, the corresponding repo is here.

Add Features to My Own SSG: TextHTMLPress

The main feature of Docusaurus is to help project maintainers focus on the content. Thus, it provides a lot of features to support generate html files from MarkDown files. In this work, I was trying to implement this feature on my own SSG.

Add Markdown File Support

The issue was raised by myself here. As suggested in the comment, there is a package called python-markdown which was built for parsing MarkDown files to html style string. Therefore, this package is enough to generate a raw html body with header lines in MarkDown files properly handled.

Add Markdown Frontmatter Support

The issue was raised by myself here.As suggested in the comment, there is a package called python-frontmatter to parse yaml style header in markdown file. Once meta data was extracted from the frontmatter, using yattag and jinja2 packages to generate a proper html file with proper tags.

Overall, the commit to fix these two issues was here.

Top comments (0)