back
~/projects-hub/projects/anacatalina-cv
Active
Anacatalina CV — Bilingual Personal Site icon
Personal Sitei18nDesign
Astro 6TypeScriptTailwind CSS v4Vercel

Anacatalina CV — Bilingual Personal Site

My résumé as a bilingual website with dark mode, plus a downloadable PDF generated by printing HTML templates with the browser's headless engine.

GitHubView App

The Problem

Many hiring processes still rely on a faithful downloadable PDF alongside a readable website — but pulling in a heavy PDF-generation library (Puppeteer and the like) is a build-time and dependency cost that isn't always worth paying.

The Solution

A bilingual (ES/EN) Astro site with dark mode and scroll animations, plus a script that renders dedicated print-ready HTML templates using the headless Chrome or Edge engine already installed on the machine (`--print-to-pdf`).

Key Learnings

  • Generating print-ready PDFs from HTML/CSS with `@page` rules, driving the locally installed headless browser instead of pulling in Puppeteer or another PDF library.
  • Keeping print templates separate from the web markup lets each format — a compact one-page résumé vs. a scrolling, animated page — be optimized on its own terms.
  • Reusing a shared design system (pastel palette, typography) across several personal sites speeds up spinning up a new one without a redesign from scratch.

A résumé that’s a website, not just a PDF

The site is built with Astro, with bilingual content (i18n.js) and a language/dark-mode toggle, meant to read comfortably on screen rather than simulate a sheet of paper.

  • No PDF dependencies: the download button doesn’t use Puppeteer or any library — a build script launches the headless browser (Chrome or Edge) already installed on the machine and prints dedicated HTML templates to public/ACVC_es.pdf / public/ACVC_en.pdf.
  • Dedicated print templates: those HTML+CSS templates (@page, print typography) are independent from the web markup, so each format — screen vs. paper — is optimized on its own.
  • Shared design system: it shares its pastel palette and typography with my homepage and with this very portfolio, documented in a common DESIGN_SYSTEM.md.