bifoc.us
bifoc.us/matt-olds/bifoc-us↗A personal site showcasing our duality: the résumé that covers what pays the bills and the projects we make in our free time.
Navigating LinkedIn has highlighted a split in how people present themselves. You either see the work experience listed on LinkedIn, which buries the side projects under job titles. Or you'll find a link to a polished portfolio with no résumé context (great-looking projects, often on a personal website). bifoc.us splits the page down the middle: identity and CV on the left, projects on the right, with the project column swappable in place so you can scan everything without losing the person it belongs to. It's content-driven. Every person is a folder of YAML files in an Astro content collection: `profile.yml` for the résumé side, one file per project on the right column. Adding a new project is a one-file commit, and a Zod schema catches shape mistakes before they ship. The whole site runs static on Cloudflare Pages with no client framework. The right-column switcher was originally a React island; it's now vanilla Astro plus an inline script that toggles `hidden` attributes, so the page is fully rendered HTML by the time it leaves the server and was able to drop some dependencies. The CDN at cdn.bifoc.us serves screenshots and the résumé PDF from R2.
- Astro 6 static output | zero client JS by default, hot reload during edits
- Content collections backed by Zod so every YAML is shape-checked at build time
- Vanilla right-column switcher | j/k cycles projects, no hydration cost
- Cloudflare Pages with PR previews; assets on R2 behind cdn.bifoc.us
- GitHub Actions CI | build + type-check, npm audit, detect-secrets, and Socket to watch dependencies