Colophon
How this website is built.
Technology
#- Built with the static site generator Eleventy v3.0.0.
- JavaScript runtime: Bun.
- Templating languages: Nunjucks and Markdown.
- Tested browsers: Mozilla Firefox, Vivaldi and Lynx.
- Source code available on GitHub.
Host and Domain
#- Deployed to Hostinger from the site's GitHub repository with a GitHub action.
- The domain name, helenchong.dev, was registered on 29 May 2024, was purchased from, registered on, and is managed by Porkbun.
Previously, this website was hosted on GitHub Pages until 30 July 2024.
Plugins
#- Eleventy's official RSS plugin
- Eleventy's official Navigation plugin
- Eleventy's official Syntax Highlighting plugin
- Eleventy's official Fetch plugin
- @zachleat/details-utils
Eleventy Community Plugins
#markdown-it Plugins
#Eleventy has the Markdown parser markdown-it built in to render Markdown to HTML.
Self-hosted Resources
#- Eric Bailey's a11y-syntax-highlighting a11y-light-on-light-dark-on-dark CSS stylesheet for Prism.js
Fonts
#- IBM Plex Sans — default body font. CSS stylesheet and WOFF2 font format generated by google-webfonts-helper.
- Work Sans — default heading font. CSS stylesheet and WOFF2 font format generated by google-webfonts-helper.
- Intel One Mono — monospaced font.
Inspiration for Making This Website
#- Gerard Hynes' Eleventy portfolio website tutorial: "Learn the Eleventy Static Site Generator by Building and Deploying a Portfolio Website".
- Raymond Camden Eleventy blog tutorial: "A Complete Guide to Building a Blog with Eleventy".
- Eleventy's official blog starter project.
JavaScript
#Due to this website being a static site, JavaScript is used to create dynamic and interactive components of this site. Here is a list of how JavaScript is used on this site:
- Display a "scroll to top" button at the bottom right corner of the screen after scrolling down a page far enough.
- My contact page includes a JavaScript embed of my email contact form powered by Letterbird.
- Add buttons to copy code snippets to pages with code blocks.
- Zach Leatherman's details-utils JavaScript package is used to automatically expand sidebar table of contents on wide screens.
- Website Carbon Badge, which is placed on the home page, uses JavaScript to calculate the carbon footprint of this website.
You can still access most of the content of this site with JavaScript disabled, but the above components will not work as intended.
(This colophon page was last updated on )