t-walkr.xyz
A fast personal portfolio built with Astro and vanilla CSS. Clean typography, a few playful interactions, and a setup that’s easy to extend.
t-walkr.xyz is a lightweight portfolio site I’m building in Astro. The main goal is practicality: something that loads fast, looks tidy, and is straightforward to extend over time as I add project content, etc.
Goals
- Easy to extend: add new pages and sections without starting from scratch.
- Consistent design: a small set of design tokens for spacing, type, colour, and motion.
- Reusable components: common layout patterns and UI elements are components.
- Fast by default: minimal client-side JS, only where it adds real value.
Stack
- Astro — static site generation with islands when needed
- TypeScript — type-safe components and small interaction scripts
- Three.js — 3D book elements on the bookclub page
- Vanilla CSS — custom properties, token-driven styling
What I learned
A token system pays off quickly. Once typography, spacing, and colors are expressed as tokens, it becomes much easier to keep the site consistent while still iterating on layout and styling. It also makes later changes (like tweaking the type scale or tightening spacing) a small edit instead of a sweep across the codebase.
What’s next
- Flesh out the Projects section with stuff I’ve worked on in the past
- Keep iterating on the homepage layout
- Finish the Timeline page, and optimise for mobile