Retro Site

The precursor of this site. I tried making a retro-themed site from scratch!

Project-related Links:


You can still access the site here.

Under the Hood: Custom Python Site Builder

To build this retro site, I bypassed modern frameworks and built my own custom Static Site Generator (SSG) using Python. The architecture separates the site’s content from its structure, utilizing a custom template rendering engine.

The Compilation Engine (compile_site.py)

The core of the site builder is a Python script that reads the entire site’s architecture from a YAML configuration file (site-template.yaml). Key features of this engine include:

  • Recursive Template Rendering: The engine recursively parses base and child templates, searching for and replacing custom variable placeholders (e.g., or) with injected text or full HTML files.
  • Dynamic HTML Generation: The builder can detect when a variable is a dictionary and automatically convert it into properly formatted, nested HTML unordered lists (<ul> and <li>), which I used to generate the site’s file explorer structures.
  • Automated Build Process: The script automatically generates the necessary directory structures and compiles the final static HTML files into a dedicated build/ directory for deployment.

Image Retrofier Tool (image_retrofier.py)

To ensure all visual assets perfectly matched the vintage aesthetic, I also developed a custom Python Command Line Interface (CLI) tool using the Python Imaging Library (PIL).

  • Resolution Scaling: The script automatically calculates the required factor to downscale modern high-resolution images to a classic target resolution, defaulting to a 640x480 ratio.
  • Color Palette Reduction: It converts the image by aggressively reducing its bit depth (defaulting to an 8-bit palette of 256 colors), authentically simulating early web graphics.

Preview