Skip to content
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

A resume website.


  • content is in YAML files
    • in separate files because I like editing my copy as a separate activity from the web dev part
    • in yaml files because I find the format convenient for copy writing and for ingestion (especially multiline strings and alias/repeated nodes)
  • HTML templating is done with Handlebars -- a lightweight templating engine is plenty for what I need
    • I have considered a full JS frontend framework (say, React or Angular) and prerendering all the pages, but it hasn't seemed worth it yet
  • HTML partials are sorted according to Atomic Design categories because I find it convenient
  • CSS is written in SASS and stored next to the relevant HTML partial
    • I'm using BEM with the notable exception that each class name is prefixed with the Atomic group it's part of -- e.g. molecules__tech-stack__box
  • When YAML content needs to be transformed before being rendered, that transformation happens in /gulp/utils/handlebars-helpers.js
  • I'm not running client side JavaScript (except for a few trivial lines) because I wanted to explore using CSS :target selector to change state with CSS
    • I thought this website would be a good opportunity to experiment with the technique so I could learn more about CSS
  • Icons are SVGs, combined using gulp-svg-sprite and displayed with SVG <use href='icon-name'></use>
    • I've made the icons from scratch (because I like that I can customize them, and to learn more about SVG)
    • colors (sometimes multiple for one icon) are set with CSS custom properties.
      • In the SVG: stroke: var(--icon-color-primary, #000)
      • In the CSS for that use of the icon: --icon-color-primary: yellow;


The static site is hosted on AWS S3, Route 53 for DNS, and CloudFront for SSL termination.

I've published my deployment script on NPM: s3-static-website-deploy


Visual Regression Testing


  • latest Ruby
  • bundle


  • To test: npm run test
  • After inspecting the results, if everything looks good, then run
  • npm run test:reset to lock in the new results
You can’t perform that action at this time.