Skip to content

LeoMartinK/cv-engine-showcase

Repository files navigation

🚀 CV Engine - Showcase de Arquitectura

Astro TypeScript Tailwind CSS Lighthouse Licencia

⚠️ Architectural Showcase: Este repositorio es una versión "sanitizada" y pública del motor que impulsa mi CV Online profesional. Su propósito es demostrar arquitectura de contenido, optimización extrema de rendimiento (Lighthouse 100) y manejo de tipos, sin exponer datos personales.


🎯 Filosofía de Ingeniería

A diferencia de mi Portfolio (SPA en React), un CV Online necesita ser instantáneo, accesible y perfectamente indexable. Por eso elegí una arquitectura SSG (Static Site Generation).

Pilares Técnicos

1. Arquitectura "Data-Driven" (Separación Contenido vs. UI)

El contenido de mi CV no está "harcodeado" en el HTML. Vive en archivos Markdown/JSON separados y tipados, lo que permite actualizar el CV editando solo datos, sin tocar código.

src/
├── content/           # 🧠 La "Base de Datos" del CV
│   ├── config.ts      # Esquemas de validación (Zod)
│   ├── experience/    # Archivos Markdown (job-01.md, job-02.md)
│   └── skills.json    # Datos puros
├── components/        # 🧩 UI Pura (Sin datos hardcodeados)
│   ├── ExperienceCard.astro
│   └── SkillBadge.astro
└── pages/             # Rutas generadas en build-time

2. Arquitectura de Islas (Zero JS by Default)

Astro envía 0kb de JavaScript al cliente por defecto. Solo se hidrata JS en componentes interactivos específicos (como el botón de "Imprimir PDF" o el Toggle de Tema).

  • HTML Estático: Header, Listas de Experiencia, Footer (Carga instantánea).
  • Isla Interactiva: <ThemeToggle client:load /> (Solo aquí carga React/JS).

🧩 Comparativa: Astro (CV) vs. React (Portfolio)

Diferentes problemas requieren diferentes herramientas. Así se compara este repo con mi Portfolio:

Característica Este Repo (CV Engine) 🚀 Mi Portfolio (React) ⚛️
Arquitectura MPA (Multi-Page App) SPA (Single Page App)
Prioridad SEO, LCP < 0.5s, Accesibilidad Interactividad, Transiciones, Estado
Renderizado Build-Time (HTML Puro) Runtime (Client-Side Rendering)
Manejo de Datos Content Collections (Zod) API / Hooks Personalizados
JS Bundle ~2kb (Solo islas) ~150kb (App completa)

⚡ Métricas de Rendimiento (Lighthouse)

El sitio está optimizado para pasar los Core Web Vitals con puntuación perfecta en móviles y escritorio.

Métrica Valor Optimización Clave
LCP (Carga) 0.6s CSS Crítico inyectado en línea (Inline), Preload de fuentes.
CLS (Estabilidad) 0 Dimensiones reservadas para todas las imágenes y contenedores.
TBT (Bloqueo) 0ms Scripts de terceros (Analytics) cargados con defer o partytown.

🛠️ Showcase de Código: Type-Safe Content

Lo que diferencia a un proyecto amateur de uno profesional es la robustez de los datos. Uso Zod para validar que mi CV nunca se rompa en producción por un dato faltante.

Snippet: src/content/config.ts

import { defineCollection, z } from 'astro:content';

// Definición estricta de la estructura de una Experiencia Laboral
const experienceCollection = defineCollection({
  type: 'content', // Markdown con Frontmatter
  schema: z.object({
    company: z.string().min(1, "Nombre de empresa requerido"),
    role: z.string(),
    location: z.string(),
    // Validación de fechas lógica
    startDate: z.coerce.date(),
    endDate: z.coerce.date().nullable(), // Null = "Actualidad"
    technologies: z.array(z.string()),
    // Si falta esto, el build falla antes de desplegar
    featured: z.boolean().default(false),
  }),
});

export const collections = {
  experience: experienceCollection,
};

🚀 Instalación Local

Clonar el repositorio

git clone https://github.com/tu-usuario/cv-engine-showcase.git
cd cv-engine-showcase

Instalar dependencias

npm install

Iniciar servidor

npm run dev

Generar Build de Producción (Check de Tipos)

npm run build

🛡️ Nota de Sanitización

Este es un repositorio público derivado de mi CV privado. Se han aplicado las siguientes medidas:

  • Datos Personales: Teléfono, dirección y email real han sido reemplazados por placeholders ([REDACTED]).
  • Referencias Laborales: Se mantienen los nombres de empresas públicas, pero se han ofuscado contactos internos.
  • Analytics: Los IDs de medición (GA4, Vercel Analytics) han sido removidos del código fuente.

📬 Contacto

Si te interesa la arquitectura SSG o la optimización web:


Generado para propósitos educativos y de demostración de arquitectura.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors