Personal portfolio for Christofer Enriquez, built as a static single-page site for GitHub Pages.

The site is designed as a visual project gallery inspired by Asuka EO, with a wide mosaic grid, a persistent project search, light/dark theme support, and Markdown-managed project content.

• Astro 6
• TypeScript
• Bulma CSS
• Markdown content collections
• GitHub Pages
• GitHub Actions

• Node.js >=22.12.0
• npm >=10

The expected Node version is documented in .nvmrc.

nvm use

Install dependencies:

npm install

Run the development server:

npm run dev

Run the production preview locally:

npm run build
npm run preview

Local URL:

http://127.0.0.1:4321/khrizenriquez

The /khrizenriquez base path is intentional because the first release targets GitHub Pages for the khrizenriquez/khrizenriquez repository.

npm run dev

Starts Astro in development mode.

npm run build

Runs astro check and builds the static site into dist/.

npm run preview

Serves the production build locally.

src/
  components/          Astro components
  content/projects/    Markdown project entries
  i18n/                Spanish UI copy
  layouts/             Base HTML layout
  pages/               Site routes
  styles/              Global CSS
  utils/               Shared helpers
public/
  projects/            Project cover images
docs/
  adr/                 Architecture decision records
  superpowers/specs/   Product/design spec

Projects are managed as Markdown files in:

src/content/projects/

Each project has frontmatter similar to:

title: "Image Optimizer"
slug: "image-optimizer"
featured: true
order: 1
language: "es"
type: "Dev tooling"
stack:
  - TypeScript
  - Imagenes
cover: "/projects/image-optimizer/cover.svg"
coverAlt: "Project cover description"
repo: "https://github.com/khrizenriquez/image-optimizer"
demo: "https://example.com"
cta: "Ver demo"
summary: "Short project description."

The home page renders every Spanish project entry and sorts them by order.

The project search runs entirely in the browser. It filters by:

• project title
• slug
• summary
• project type
• stack tags
• repository URL
• demo URL

Search is intentionally simple so the site remains static and easy to maintain.

The site supports light and dark themes.

• It defaults to the user's system preference.
• Explicit user selection is stored in localStorage.

GA4 support is prepared but disabled by default.

To enable it, set:

PUBLIC_GA_MEASUREMENT_ID=G-XXXXXXXXXX

Analytics only loads in production and only when the measurement ID exists.

Deployment is handled by GitHub Actions:

.github/workflows/deploy.yml

The workflow:

1. Installs dependencies with npm ci.
2. Builds the Astro site.
3. Uploads dist/ as the GitHub Pages artifact.
4. Deploys to GitHub Pages.

In GitHub repository settings, Pages should use GitHub Actions as the source.

This project follows Trunk-Based Development:

• main is the trunk.
• Work happens in short-lived branches.
• Pull requests should stay small and focused.
• GitHub Pages deploys from main.

Current feature branch:

feat/portfolio-v1

Production dependency audit:

npm audit --omit=dev

Full dependency audit:

npm audit

The project uses an npm override for yaml so transitive development tooling resolves to a patched version.

• old_version/ is intentionally ignored by Git and kept only as local migration source material.
• Custom domain support is not enabled in v1. No CNAME file is included yet.
• Project covers can be replaced under public/projects/<slug>/.