Mimicking Features From Docusaurus

In this week of assignment, I have done adding new features from Docusaurus to my Static Site Generator(ssg). The Docusaurus is the template that can easily publish the document websites.

The deployment of Docusaurus on the Github pages was very straightforward. There is a need for reading a document which provides information about deploying Docusaurus to Github pages. After setting in docusaurus.config.js and following instruction on README.md, the deployment on Github pages successfully done.

The features from Docusaurus that I added to my SSG are:

• Search Engine Optimization (SEO), including meta tags in the HTML head (commit, issue)
• Themes (commit, issue)
• Configurable Slidebar (i.e., table of contents) (commit, issue)

Search Engine Optimization (SEO)

The SEO is the process of optimizing the website to be better visible to the search results from Google crawler "Spider". Simply if you have good SEO on your websites, you would like to have more visitors on your websites. This is crucial for earning money if your websites have advertisements and get paid by per-click.

I have considered to add 3 meta name: keyword, description and author. When the user generates HTML files from the text and md file. The SSG asks user to enter the keyword, description and author for each file. Therefore, all the files have own meta data on their HTML head.

Theme

I have checked that the Docusaurus has feature of dark and light mode. I have got motivated to implement this feature to my SSG. When user generate their HTML files by specifying the files or folder direcotory, the SSG use default theme setting. If the user generate HTML files by using config.json then SSG provides two options darkMode and 'lightMode'.

Configurable Slidebar

All the websites and Docusaurus have table of contents on the left side navigation. The table of contents provides convenient to check what contents exist on the website and easily access to content. I think the index.html, the homepage is required for this feature. Therefore, every time user generate the HTML file(s), the index.html automatically generate as default. All the pages include the left side navigation with table of contents and has own its document(s).

Reflect

The implementing the 3 features on my SSG has been done successfully as the functionality perspective. However, the design perspective, the implementation is not perfectly done. This is because I have lack of contents on the home page and I am using C# without ASP.NET which has limitation to apply design on my SSG. The next step for the feature, I will more focus on the design on my SSG.