Cómo escribir un CV eficaz
Un CV Frontend funciona cuando comunica: stack real, contexto del producto, enfoque en UX/accesibilidad y resultados medibles en rendimiento y calidad.
Primera página: lo que un recruiter debe entender en 10 segundos
Debe verse de un vistazo la seniority, frameworks y contexto del producto.
- Rol y seniority (Junior/Mid/Senior) + años reales.
- Frameworks principales (React/Next.js, Vue) y TypeScript.
- Contexto: web app, e-commerce, dashboard, B2B/B2C, design systems.
- Diferenciadores: accesibilidad (WCAG), performance (Core Web Vitals), testing.
Redacción: bullets cortos y verificables
6-10 bullets potentes por experiencia valen más que párrafos largos.
- Usa verbos de acción: desarrollado, implementado, optimizado, refactorizado, estandarizado.
- Menciona outcomes reales: mejora de CWV, menos regresiones UI, mayor reutilización.
- Números solo si son reales y defendibles (p. ej. -35% carga, +X Lighthouse).
Palabras clave ATS (sin forzar)
Incluye keywords alineadas con job descriptions habituales.
- React, Next.js, Vue, TypeScript, HTML semántico, CSS/Sass/Tailwind
- Design system, component library, Storybook
- Accesibilidad, WCAG, ARIA, navegación por teclado
- Core Web Vitals, Lighthouse, performance optimization
- Testing: Jest, Testing Library, Cypress
- Integración REST/GraphQL, state management
Resumen profesional
El resumen (3-5 líneas) debe decir de inmediato: experiencia, stack, tipo de producto y una fortaleza clara (UX, performance o accesibilidad).
Estructura recomendada (simple y efectiva)
Una fórmula que funciona casi siempre para Frontend.
- Quién eres + años de experiencia (o perfil junior).
- Stack (React/Next/Vue, TypeScript) y tipo de productos (e-commerce, dashboards, SaaS).
- Tu diferenciador: performance, accesibilidad, design system, calidad/testing.
- Opcional: un resultado real (CWV, menos regresiones, reutilización).
Ejemplos listos (personaliza)
Copiables y adaptables a tu perfil.
- “Frontend Developer con 6+ años en React/Next.js y TypeScript. Desarrollo UI responsive y accesible, con experiencia en design systems y optimización de Core Web Vitals (LCP/CLS/INP).”
- “Ingeniera Frontend especializada en Vue y component libraries: entrego interfaces coherentes y testadas, integrando APIs REST/GraphQL y optimizando performance y UX en productos digitales.”
Experiencia laboral
Aquí se gana o se pierde. En frontend, la experiencia debe describir UI real, decisiones técnicas, calidad e impacto en UX/performance.
Bullets fuertes: qué incluir
Una buena lista cubre: UI, datos, calidad, rendimiento, colaboración.
- Componentes y design system: reutilización, consistencia, documentación.
- State management y data fetching: caché, invalidación, loading/error states.
- Accesibilidad: WCAG/ARIA y manejo de foco/teclado.
- Performance: code splitting, lazy loading, optimización de imágenes/fuentes, CWV.
- Testing: unit/component y E2E, reducción de regresiones.
- Colaboración: code review, pairing, alineación con diseño/backend.
Ejemplos de bullets “reales” (sin inventar resultados)
Sustituye según tu contexto.
- “Desarrollo de componentes reutilizables y documentados para un design system, mejorando consistencia UI y velocidad de entrega.”
- “Mejora de LCP/CLS mediante lazy loading de imágenes, estrategia de fuentes y reducción de bundle, aumentando performance percibida.”
- “Introducción de tests E2E en flujos críticos (login/checkout), reduciendo regresiones tras release.”
Proyectos clave y portfolio
En frontend, los proyectos cuentan si demuestran calidad: accesibilidad, rendimiento, arquitectura de componentes y despliegue. 2-4 proyectos sólidos > 10 demos vacías.
Qué hace que un proyecto sea “para CV”
Un reviewer busca madurez técnica y atención a UX.
- README clara: objetivo, stack, cómo ejecutar, decisiones de arquitectura.
- Performance: atención a CWV/Lighthouse y estrategias (imágenes/fuentes/bundles).
- Accesibilidad: componentes navegables por teclado y roles ARIA correctos.
- Testing: al menos tests básicos y/o E2E para un flow clave.
- Deploy: enlace a demo (Vercel/Netlify) si es posible.
Ejemplos de proyectos eficaces
Ideas típicas que muestran skills frontend.
- E-commerce en Next.js: SEO, performance, páginas de producto, filtros, checkout demo.
- Dashboard: gráficos, filtros, gestión de dataset, optimización de render.
- Design system: component library accesible + Storybook + tokens.
- PWA: offline caching, instalabilidad, performance y UX.
Competencias técnicas y soft skills
En 2026 destacan skills “production-ready”: accesibilidad, rendimiento, calidad, colaboración. Agrupa y mantén relevancia.
Hard skills (operativas) Frontend
Skills técnicas que un recruiter espera ver.
- HTML semántico, CSS moderno, responsive design, arquitectura de componentes.
- JavaScript/TypeScript, React/Next.js, Vue, routing y estrategias de render.
- State management y data fetching (React Query/Redux; Vuex/Pinia).
- Performance: code splitting, lazy loading, CWV, Lighthouse.
- Accesibilidad: WCAG, ARIA, navegación por teclado, focus management.
- Testing: Jest, Testing Library, Cypress.
Soft skills (que importan de verdad en Frontend)
No las pongas como adjetivos: conéctalas con contexto real.
- Colaboración con diseño: traducción de requisitos y consistencia del design system.
- Comunicación técnica: explicar trade-offs (performance vs features, UX vs complejidad).
- Ownership: mantenimiento de componentes, reducción de deuda técnica, prevención de regresiones.
- Problem solving: debugging cross-browser y gestión de incidencias en producción.
Skills valoradas en 2026 (solo si son reales)
Inclúyelas solo si las has usado de verdad.
- Design tokens y theming (CSS variables), modo oscuro.
- Componentes accesibles complejos (modal, dropdown, combobox) con focus trap.
- SSR/SSG y optimización SEO con frameworks modernos (Next).
- Observabilidad frontend: error tracking y performance monitoring (enfoque).
Formación
En frontend suelen pesar más los proyectos y la calidad técnica. Deja la formación esencial y añade solo cursos pertinentes.
Título
Indica grado/diploma e institución. Con experiencia, evita demasiados detalles.
Cursos útiles y creíbles
Mejor pocos cursos enfocados que una lista interminable.
- JavaScript/TypeScript avanzado (si aplicado en proyectos).
- Accesibilidad (WCAG) e inclusive design.
- Performance y Core Web Vitals.
- Bases de UX y design systems (si alineado con el rol).
Idiomas
En frontend, el inglés suele ser necesario para documentación, issues y colaboración. Indica niveles realistas y lo que puedes hacer.
Cómo indicarlos de forma creíble
Un nivel realista + una nota práctica es mejor que un “excelente” no defendible.
- Usa MCER (A1-C2) o básico/intermedio/avanzado de forma coherente.
- Si lo usas: “lectura de documentación técnica y comunicación por tickets/llamadas” (si es verdad).
Indicadores y métricas (KPI) en Frontend
Los KPI frontend se relacionan con rendimiento, calidad UX y estabilidad: CWV, errores, conversión, regresiones. Usa el lenguaje correcto sin inventar números.
Indicadores típicos monitorizados
No siempre se comparten formalmente, pero suelen medirse con herramientas y dashboards.
- Core Web Vitals: LCP, CLS, INP (y TTFB cuando aplica).
- Tiempo de carga y rendimiento percibido (Lighthouse, RUM).
- Tasa de errores del cliente (JS errors) y crash-free sessions.
- Tasa de regresiones UI (bugs post-release) y cobertura de tests en flujos críticos.
- Métricas de producto: conversión, drop-off, retención (si se comparten).
Cómo incluirlos sin “tirar números”
Si no hay datos, describe acciones y contexto; si los hay, usa solo métricas reales y defendibles.
- “Mejora de CWV optimizando imágenes/fuentes y reduciendo el bundle.”
- “Reducción de regresiones UI introduciendo tests E2E en flujos críticos.”
- Si tienes números reales: úsalos solo si son defendibles (p. ej. -35% carga, +X Lighthouse).
Herramientas y stacks típicos
Mostrar familiaridad con herramientas reales reduce el riesgo percibido (onboarding más rápido).
Herramientas que puedes mencionar (sin marcas si prefieres)
Describe lo que realmente has usado.
- Frameworks: React/Next, Vue/Nuxt (si se usaron).
- Tooling: Vite/Webpack, ESLint, Prettier, pnpm/npm/yarn.
- UI: Tailwind/CSS Modules/Sass, Storybook, design tokens.
- Testing: Jest, Testing Library, Cypress/Playwright.
- API: REST/GraphQL, manejo de auth/sesión.
- Performance/calidad: Lighthouse, profiling, DevTools del navegador.
Cuándo mencionar herramientas específicas
Solo si las recuerdas y son realmente relevantes.
- Si la oferta requiere una herramienta (p. ej., Next.js, Cypress), citarla ayuda.
- Si no recuerdas el nombre de una herramienta interna, describe la función y el contexto.
Formato y maquetación ATS
Un CV ATS-friendly debe ser legible para software y hiring managers. La simplicidad y el orden siempre ganan.
Formato recomendado
Guías prácticas que funcionan en la mayoría de casos.
- 1 página para junior; 1-2 páginas para mid/senior.
- Secciones estándar: Summary, Experience, Projects, Skills, Education, Languages, Certifications.
- Bullets cortos (1-2 líneas) y palabras clave en el texto.
- PDF limpio, fuentes estándar, sin gráficos complejos ni layouts extremos.
Qué evitar (problemas ATS típicos)
Puede romper el parsing o reducir la legibilidad.
- Texto dentro de imágenes, iconos o barras de progreso.
- Columnas extremas y layouts demasiado “creativos”.
- Tablas complejas para experiencia y tecnologías.
Errores a evitar
Errores que pueden hacer descartar un CV Frontend incluso con experiencia.
Demasiado genérico o solo buzzwords
Escribir “React, UX, performance” sin contexto no comunica valor.
- Añade qué construiste: design systems, e-commerce, dashboards, formularios complejos.
- Añade cómo: accesibilidad, testing, mejoras de CWV, integración de APIs.
Skills infladas o no demostrables
En frontend se valida en entrevista y en el portfolio.
- Evita listas enormes de frameworks si no los usas de verdad.
- No digas “accesibilidad avanzada” si no sabes manejar focus/ARIA.
Sin evidencia de calidad y experiencia en producción
El frontend moderno valora testing, performance y mantenibilidad.
- Menciona tests y procesos (code review, CI) si son reales.
- Muestra atención a performance y prevención de regresiones.
- Destaca colaboración y ownership sobre componentes.
CV Frontend junior / entry-level
Si eres junior, demuestra bases sólidas: componentes, HTML/CSS, JS/TS y capacidad de convertir diseño en UI, con atención a accesibilidad y calidad.
Qué incluir en lugar de experiencia laboral
Proyectos y actividades que demuestran skills prácticas.
- Proyectos con componentes y routing: al menos una app completa (mini e-commerce o dashboard).
- Accesibilidad básica: HTML semántico, manejo de foco, validación de formularios.
- Repositorio cuidado: README, scripts de arranque, demo desplegada.
- Al menos un test en un flow y tooling de lint/format.
Resumen junior: ejemplo listo
Ejemplo concreto sin inventar experiencia.
- “Perfil junior Frontend: construyo UI responsive con React/Vue y TypeScript, cuidando HTML semántico, accesibilidad básica y performance. Cómoda con Git, code reviews y proyectos con lint/tests para releases más fiables.”
Skills a listar (junior)
Elige skills coherentes y defendibles.
- HTML/CSS responsive, JS moderno, TypeScript básico.
- Componentes, state management simple, fetch API y manejo de errores.
- Git, debugging con DevTools, bases de testing.
- Atención a accesibilidad y semántica.
CV para cambio de carrera (desde otros roles)
Si vienes de diseño, QA, backend, marketing o soporte, conecta skills transferibles y muestra proyectos que prueben frontend real.
Cómo aprovechar experiencias previas
Traduce tu pasado a señales útiles para frontend.
- Desde UX/UI: foco en design system, usabilidad, handoff, pixel-perfect.
- Desde QA: foco en calidad, tests, prevención de regresiones.
- Desde backend: foco en integración API, auth, manejo de errores.
- Desde soporte/ops: foco en debugging, incident handling y comunicación.
Qué necesitas para ser creíble
2-3 proyectos completos valen más que una larga lista de cursos.
- Un proyecto con design system y componentes accesibles.
- Un proyecto de performance/SEO (Next.js) con atención a CWV.
- Una demo desplegada y un README claro.
Carta de presentación
Si se solicita: breve y concreta — stack, tipo de producto, 1-2 pruebas (proyecto o resultado) y disponibilidad.
Estructura de 6 líneas (funciona de verdad)
Perfecta para candidaturas tech: directa y sin relleno.
- 1 línea: rol y por qué aplicas.
- 1-2 líneas: stack y qué sabes hacer (UI, performance, accesibilidad, testing).
- 1 línea: prueba (proyecto/resultado real).
- 1 línea: por qué esa empresa (producto/stack/misión).
- 1 línea: cierre y disponibilidad para entrevista.
Ejemplo corto (copiable)
Adáptalo con la empresa y disponibilidad.
- “Me postulo para el puesto de Frontend Developer en [Empresa]. Tengo experiencia con React/Next.js (y/o Vue) y TypeScript desarrollando UI responsive y accesible, con fuerte atención a Core Web Vitals y testing (Jest/Cypress). En [proyecto/contexto] contribuí a mejorar performance y consistencia UI mediante componentes reutilizables y optimizaciones de carga. Me interesa especialmente [motivo ligado al producto/stack]. Quedo a disposición para una entrevista.”
