Portfolio V2

TellMeAlex

Portfolio personal de Alejandro de la Fuente — Astro 5 + Svelte 5 + @codigosinsiesta/theme. Versión 2 con identidad de marca Código Sin Siesta. Tras cutover reemplaza tellmealex.dev.

Download

tellmealex-portfolio v2

Portfolio personal de Alejandro de la Fuente — Technical Leader Specialist · Agentic AI.

Versión 2: migración del stack React 19 + Vite a Astro 5 + Svelte 5 sobre el sistema de diseño @codigosinsiesta/theme. Tras cutover (Fase 5), reemplaza la versión React desplegada en tellmealex.dev. Hasta entonces vive en v2.tellmealex.dev.

Stack

Capa	Tecnología	Versión
Framework	Astro	5.x
Islas	Svelte	5.x (runes)
Estilos	Tailwind CSS	3.x (preset `csi-*` del theme)
Diseño	`@codigosinsiesta/theme`	git URL (`v0.9.0+`)
Contenido	Astro Content Collections	Zod schemas
Tests	Vitest + Playwright	(pendiente — Fase 4)
Hosting	Dokploy	(pendiente — TODO infra)

Estructura

src/
├── content/
│   ├── config.ts            · Schemas Zod (profile, projects, skills, experience)
│   ├── profile/             · Singleton — bio del autor
│   ├── projects/            · Markdown por proyecto
│   ├── skills/              · JSON por categoría
│   └── experience/          · Markdown por rol profesional
├── layouts/
│   └── BaseLayout.astro     · HTML doc + estructura PageShell (skip link, header, main, footer)
├── pages/
│   └── index.astro          · One-page bento (Hero, About, Skills, Projects, Contact)
└── styles/
    └── global.css           · Import del theme + Tailwind layers
public/
└── icons/                   · github.svg, linkedin.svg, envelope.svg (consumidos por SiteFooter)
astro.config.mjs             · Integraciones Svelte + Tailwind
tailwind.config.mjs          · Aplica preset `@codigosinsiesta/theme/tailwind.preset.js`

Comandos

pnpm install        # Instala dependencias (incluye el theme via git URL)
pnpm dev            # Servidor de desarrollo en :4321
pnpm build          # Build estático a dist/
pnpm preview        # Sirve el build para verificar
pnpm check          # Astro type check

Roadmap de migración

Ver Portfolio-Identidad-CodigoSinSiesta (nota privada en el vault del autor) para el plan completo. Resumen:

Fase 0 ✅ — Higiene previa: merge de PR #109 en portfolio (React) + apertura del milestone v0.8.0 en el theme.
Fase 1 ✅ — Backlog del theme: composables v0.8.0 + site shell + bento v0.9.0 publicados.
Fase 2 🟢 — Skeleton del portfolio (este commit inicial).
Fase 3 ⚪ — Migración feature a feature: footer/contact, about, AI leadership, header (isla), hero (typing), stats (counter), skills (bars), experience (timeline), projects (filtros).
Fase 4 ⚪ — Pulido + a11y + perf: Lighthouse, axe-core, Vitest + Playwright.
Fase 5 ⚪ — Cutover: swap DNS de tellmealex.dev (React → Astro), archivar el repo viejo.

TODO infra

Dokploy: crear app paralela apuntando a portfolio-v2:main en subdominio v2.tellmealex.dev. La versión React sigue sirviendo tellmealex.dev hasta el cutover.
Configurar webhook GitHub → Dokploy para deploy automático en push a main.
Verificar headers de seguridad (CSP, HSTS) en la app Dokploy.

Contenido

El contenido textual está en src/content/ como placeholders. La copy real se irá rellenando feature a feature en Fase 3, copiando de la versión React (github.com/TellMeAlex/portfolio).

Licencia

MIT — Alejandro de la Fuente.

Top categories