How is this website generated? You may ask. Actually this website is completely static, which is generated by a custom static blog generator powered by NodeJS. The generation procedure is summarized as follows:

1. The source folders are analyzed, and a tree representation of the whole website is constructed.
2. Metadata are processed, urls are resolved, and possibly virtual tree nodes (e.g., archive pages) are created.
3. Static HTML pages are emitted in the target directory, and resource files are copied.

Here is a brief list of tools used in the custom generator:

• pug (formerly known as jade): used as the core template engine thanks to its rich syntax and flexibility.
• markdown: used as the markup language for article writing.
• remarkable: used as the markdown renderer, with my own customizations adding support for math equations with numbering, theorem environment, and basic cross referencing functionalities.
• KaTeX: used as the LaTeX renderer.
• highlightjs: used as the syntax highlighter.
• lodash: for providing very useful utility functions.
• fs-extra: for providing additional file system methods.
• chalk: for coloring the terminal outputs.
• minimatch: used as the glob matcher.
• express: used as the server backend for previewing the generated site.
• typescript: the entire generator is written in TypeScript.
• normalize.css: for a modern and consistent baseline style across browsers.

This website also utilizes responsive design via media query. Hence it will adjust its layout according to the screen size. Additionally, when printing blog articles, the layout and style will automatically adjust to make the printout clean and easy to read.