Gregory and his dog, Linux, at the beach
Gregory Croisdale
He / Him / His University of Michigan PhD Student / Resident Rapscallion Human-Computer Interaction Researcher

Introduction

There comes a time in every (attempted) career academic’s life when their affiliations exceeds the page limit of a default html page 12pt font. For me, that time has come.

Inspiration

My all-time favorite academic website is Amy Ko’s. It balances a nice aesthetic with a simple, easy-to-navigate design — and it’s open source! I am, however, a real tryhard, so I wanted to do everything I could myself.

Taking inspiration from Cade Brown, I am using Astro to generate my site. Astro is a static site generator that uses Svelte components to build pages. It’s a really cool project that I’m excited to use, and I am looking forward to see how it develops over time — especially with the new Client Side Routing features (that I’ve yet to explore).

I’ve done a fair bit of work in parsing websites, and as cool as React and other compiled frontends are, I despise the DOMs that they generate. Sure, my browser in 2023 has no problem reading them, but the depth and complexity they produce, combined with the hashed ids and classes make me dubious of their maintainability — especially as frameworks come and go.

I want clean markdown that I can read and edit in a text editor, and I want to be able to easily parse it into a DOM that I can understand.

Requirements

  1. The site must be statically generated.
  2. My posts must be able to be written in markdown.
  3. Absolutely no JavaScript can required in the frontend.
  4. The DOM needs to be human-comprehensible.
  5. Collections of content must be easily created and maintained.
  6. Everything needs to be FOSS.

Stack

With all of these requirements considered, I am using the following stack:

  1. Astro for static site generation
  2. Svelte for component-based frontend development
  3. Sass for CSS preprocessing

For visuals, I’m comfortable with Adobe Illustrator for what can be vectorized, shaders or Adobe Photoshop for what cannot, and Blender for 3D modeling.

And of course, I’ll be using my long-time favorite text editor, Microsoft Word 2007.

Implementation

I’ve had a bare-bones version up for an embarassingly long time, but now, I will actually start consistently writing content! [citation needed].

In classic Gregory fashion, I will leave implementation details to add to this post later. But just imagine they’re really cool and that you’re super impressed.

Check out my code here!