◈ VICENTE OPASO
Frontend
arquitectura.
Ingeniería
liderazgo.
Más de 15 años desarrollando plataformas web modulares, sistemas de diseño y los equipos que hay detrás de ellos. Málaga, España · Trabajo a distancia (UE).
25%
Mejora en Core Web Vitals en 6 mercados
40%
Reducción de fricción en releases vía CI/CD
€1B+
Facturación anual en plataformas que he arquitectado
15y+
Entregando en la web — y 10 años en telco antes
- 01 —Lidero equipos de ingeniería y arquitecto plataformas frontend.QUIÉN
- 02 —Me importa la arquitectura componible, los sistemas de diseño y la experiencia de desarrollador.OFICIO
- 03 —Entrego productos accesibles, performantes y globalmente localizados.ENTREGO
- 04 —Escalo Comunidades de Práctica y mentorizo equipos distribuidos.ESCALO
- 05 —Soy, muy probablemente, el único Arquitecto Frontend que conocerás que también fue ingeniero RF en Nokia.EXTRA
- 06 —Construyo cosas fuera del trabajo. Un pipeline de búsqueda de empleo con IA, un producto de datos cívicos en tiempo real e infraestructura autoalojada. La ingeniería personal es como me mantengo en forma.BUILDS
§02A QUÉ ME DEDICO
01
Arquitectura Frontend
Ecosistemas React / Next.js componibles construidos para entrega global.
02
Sistemas de Diseño & UI
Librerías de componentes, tokens, accesibilidad, consistencia multi-plataforma.
03
Experiencia de Desarrollador
Automatización CI/CD, guardrails de calidad de código, onboarding, tooling.
04
Liderazgo en Ingeniería
Equipos distribuidos, estrategia, alineando producto, diseño e ingeniería.
05
Rendimiento, A11y & SEO
Core Web Vitals, edge delivery, WCAG 2.1, SEO técnico.
06
Ingeniería AI-Nativa
Spec-Driven Development, codebases gobernadas por IA, arquitectura de servidores MCP y diseño de flujos de trabajo agénticos — incluyendo despliegue de LLMs open-source en infraestructura GPU cloud y capas de abstracción multi-proveedor.
§03DÓNDE HE TRABAJADO
FECHASPUESTO · EMPRESAUBICACIÓN→
2025.02 – 2025.07Propietario Técnico de Aplicación (Dominio Usuario) · EUROCONTROLBruselas, Bélgica (Onsite)LEER ↗
2022.12 – 2024.12Arquitecto de Soluciones Frontend · Carlsberg GroupLisboa, Portugal (Híbrido)LEER ↗
2022.12 – 2024.07Arquitecto de Soluciones – Marketing Digital & Consumer Tech · Carlsberg GroupLisboa, Portugal (Híbrido)LEER ↗
2021.01 – 2022.12Desarrollador Principal y Arquitecto – Malty Design System · Carlsberg GroupLisboa, Portugal (Híbrido)LEER ↗
2018.12 – 2019.06Desarrollador Frontend Senior · Opaso LLC (cliente: Prizm Tech Group)Remoto | Chicago, ILLEER ↗
§04LO QUE CONSTRUYO
Fuera del trabajo, construyo. Estos son proyectos en vivo — no side projects que empecé y abandoné, sino sistemas que ejecuto, mantengo y mejoro. Es donde practico lo que escribo: ingeniería AI-nativa, infraestructura autoalojada y pensamiento de producto de principio a fin.
opa.so
- Construido spec-first usando Spec-Driven Development (SDD): un
sdd.yamllegible por máquina define el sistema y una Constitución enumera once invariantes inmutables — importaciones entre capas, gestión de secretos, mínimos de accesibilidad, requisitos de i18n — antes de escribir ningún código. Los ADRs registran cada decisión arquitectónica, dando a las herramientas de IA y a los contribuidores humanos el mismo contexto estructurado para mantener la integridad arquitectónica en cada contribución. - Cada PR — humano o generado por IA — pasa un pipeline de CI de diez puertas: ESLint (Next.js, TypeScript, accesibilidad, seguridad), compilación TypeScript estricta, escaneo automático de secretos, validación de enlaces internos, tests unitarios Vitest con umbrales de cobertura del 90% en líneas, sentencias, ramas y funciones como fallos obligatorios, Playwright E2E, regresión visual Playwright en viewports light/dark/mobile, análisis estático CodeQL, auditoría de vulnerabilidades de dependencias, y Lighthouse CI con Rendimiento ≥90, Accesibilidad ≥90 y SEO ≥95.
- El formulario de contacto es una pila de defensa en profundidad: validación de origen → honeypot → rate limiting por IP → verificación server-side del token Cloudflare Turnstile → validación de esquema Zod, en ese orden, antes de que un mensaje sea enviado al backend de email. La observabilidad se basa en Vercel Analytics y Speed Insights para Core Web Vitals, con Sentry capturando errores de cliente y servidor, replays de sesión y trazas de rendimiento muestreadas.
- Bilingüe (EN/ES) en todo: rutas App Router con prefijo de locale, archivos de contenido Markdown por locale como única fuente de verdad para todo el copy, y un workflow de traducción con DeepL para que el contenido en español se mantenga sincronizado sin esfuerzo manual. Las imágenes OG se generan por locale mediante la API
ImageResponsede Next.js.
AI Job Search Pipeline
- Un pipeline de descubrimiento de empleo de extremo a extremo con dos rutas de ingesta que alimentan el mismo worker: un scraper que consulta las bolsas de trabajo configuradas en un schedule diario de GitHub Actions, y una REST API alojada en Vercel (
POST /api/opportunities) que acepta leads enviados por email — permitiendo que una skill de Claude Code parsee emails de recruiters y empuje oportunidades estructuradas directamente a la cola sin ningún copy-paste manual. - La deduplicación se gestiona mediante normalización canónica de URLs (host en minúsculas, parámetros UTM, fragmentos y puertos por defecto eliminados) combinada con un ledger
seen_jobsen Neon Postgres, de modo que el mismo rol que aparece en múltiples fuentes o emails se colapsa en un único registro antes de la puntuación. - Los trabajos cualificados pasan por un proceso de puntuación OpenAI de dos etapas: un filtro amplio de etapa 1 elimina las claras incompatibilidades, y un pase detallado de etapa 2 puntúa los candidatos borderline en profundidad. La prioridad en Linear se deriva dinámicamente de la distribución de puntuaciones de cada lote —
MIN_MATCH_SCOREmapea a sin prioridad, la puntuación más alta calificada mapea a urgente — de modo que los roles más relevantes siempre emergen al principio del tablero.
Índice de Sentimiento Político
- Un barómetro de sentimiento en directo construido como dos servicios TypeScript desacoplados — un frontend SSR con Next.js 16 y un BFF Fastify dedicado — separados intencionalmente para que toda la lógica de negocio, la puntuación y el acceso a la base de datos vivan detrás de un contrato explícito documentado con OpenAPI que la capa de presentación nunca puede saltarse.
- El backend ejecuta un pipeline de contenido de cinco etapas con cadencia de seis horas: Fetch → Normalize → Deduplicate → Synthesize → Write. Tres fuentes de noticias se consultan en paralelo mediante
Promise.allSettled— GDELT para análisis de tono, CurrentsAPI para amplitud de artículos, y NewsAPI.ai para enriquecimiento selectivo con sentimiento pre-puntuado. Pre-computar señales de sentimiento para la mayoría de los artículos reduce el consumo de tokens de Claude en un 60–70% estimado respecto a enviar texto crudo. - Tras la normalización en un tipo compartido
NormalizedArticle(huella SHA-256 de título + fuente + hora de publicación), la deduplicación corre en dos pasadas — eliminación de parámetros URL y luego huella de contenido — resolviendo conflictos a favor de la versión con metadatos más ricos. El conjunto deduplicado se envía a Claude en una única llamada estructurada: Claude asigna pesos de relevancia por artículo en nueve categorías (deben sumar exactamente1.0), computa puntuaciones por categoría en escala0–100, calcula confianza como el menor de ratio de acuerdo entre fuentes y amplitud de cobertura, y emite indicadores de desacuerdo cuando el ratio del lado mayoritario cae por debajo de0.7. - Todas las escrituras se confirman dentro de una única transacción PostgreSQL — metadatos del pipeline, el snapshot de puntuación, las nueve puntuaciones de categoría con las cadenas de razonamiento de Claude, indicadores de desacuerdo y el conjunto completo de artículos deduplicados. El pipeline es idempotente: un índice único en
pipeline_run_idpreviene escrituras dobles en reintentos, y la política de reintentos distingue fallos transitorios (un reintento automático con 30 segundos de espera) de permanentes, que se registran y dejan para la siguiente ejecución. - El frontend renderiza un dashboard en directo usando Next.js App Router con ISR (ventana de revalidación de 300 segundos). El gráfico de tendencias se renderiza como una
<table>HTML accesible en el HTML inicial del servidor, luego se hidrata en una visualización Recharts; los cambios de ventana temporal son manejados por un route handler del mismo origen que valida parámetros y re-consulta al BFF en el servidor. Desplegado en Vercel mediante GitHub Actions con los despliegues automáticos Git de Vercel desactivados; los logs estructurados se envían a Grafana Loki para visibilidad operacional.
Dev Team
- Un pipeline de entrega de software completamente autónomo que toma una solicitud de funcionalidad — enviada por Telegram
/submit, una cola basada en archivos o una llamada a herramienta MCP — y la lleva a través de descomposición de requisitos, generación de código, creación de pull requests, monitoreo de CI y auto-reparación en caso de fallo, sin intervención humana en el camino feliz. - El pipeline ejecuta Qwen 2.5 Coder en GPUs cloud de Modal — sin dependencia de APIs de LLMs alojados en el camino crítico. Una capa de abstracción multi-proveedor hace que el backend de inferencia sea completamente configurable en tiempo de ejecución: cambia entre Qwen (por defecto), Claude, OpenAI o cualquier endpoint compatible con OpenAI mediante una única variable de entorno. El sistema ha sido probado con los proveedores de GPU cloud Modal, OCI e IONOS.
- El pipeline es una secuencia de roles de IA especializados: Context indexa el estado actual del repositorio, Product Owner descompone el objetivo en tareas con criterios de aceptación, Designer produce guía UI/UX y actúa como puerta de aprobación pre-PR, Backend y Frontend escriben la implementación, QA genera tests y notas de revisión, y Fixer lee los logs de fallos de CI y parchea el código hasta que los tests pasan. Cada rol es reintentable de forma independiente con un límite máximo, recibe solo contexto local a la tarea (nunca el repositorio completo ni el historial de conversación), y produce JSON validado contra un esquema fijo — sin prosa, sin excepciones.
- El orquestador escribe checkpoints de memoria de ejecución durables en cada hito, de modo que una ejecución interrumpida o con rate limit se reanuda exactamente donde quedó en lugar de regenerar trabajo que ya había tenido éxito. La auto-reparación está intencionalmente controlada: los fallos transitorios (red, rate limits, flaps de CI) usan un backoff corto antes de reintentar; los fallos repetidos, roles bloqueados o bucles de fixer agotados escalan a un humano vía Telegram.
- Expone todo el pipeline como un servidor HTTP MCP (
submit_task,get_status,resume_task), haciendo que Dev Team sea composable: cualquier cliente compatible con MCP — Claude Code, BrowserOS o un agente de IA exterior — puede lanzar una solicitud, marcharse y luego consultar la memoria de checkpoint para ver exactamente qué roles se han completado y si el CI ha pasado. - La infraestructura es intencionalmente mínima y solo de salida: un proceso worker Node.js en un VPS privado sin superficie de entrada pública, consultando GitHub para el estado de CI/PR y Telegram para los comandos del operador. n8n gestiona los disparadores de schedule periódicos; GitHub Actions es la puerta de calidad estricta — un PR nunca se considera terminado hasta que el CI esté en verde.
Self-Hosted Cloud Platform
- Dos servicios en producción en un único VPS reforzado: Nextcloud para almacenamiento general de archivos e Immich para gestión de fotos con IA, compartiendo un proxy inverso, un conjunto de reglas fail2ban y un backend Wasabi S3. Immich monta el almacenamiento de Nextcloud en modo solo lectura vía WebDAV — una única fuente de verdad para las fotos, con Immich proporcionando reconocimiento facial, detección de objetos y búsqueda inteligente mediante un contenedor Python ML dedicado respaldado por PostgreSQL con las extensiones pgvector y vectorchord.
- La seguridad es defensa en profundidad en cada capa: los contenedores corren con capacidades drop-all y re-grants mínimos,
no-new-privileges, montajes tmpfs noexec/nosuid, límites de memoria y CPU, y binding de puertos solo a localhost. En la capa de red, nginx impone rate-limiting en rutas de autenticación, HSTS, OCSP stapling y TLS moderno únicamente. fail2ban monitorea los logs de acceso de nginx y banea IPs tras cinco intentos fallidos de autenticación en diez minutos. Todo el hardening fue impulsado por una evaluación de PentestTools con cada remediación comprometida al repositorio. - Un pipeline Python de detección de duplicados corre en temporizadores systemd — eliminación diaria de duplicados exactos (limitada a 200/ejecución), eliminación diaria de near-duplicados de alta confianza (limitada a 50/ejecución), y un informe semanal de near-duplicados sin eliminaciones. El pipeline incluye modo dry-run, límites de eliminación por ejecución, guardas de anomalías de timestamp e informes JSON/CSV como salvaguardas integradas contra la eliminación masiva accidental.
- Las copias de seguridad automáticas diarias envían volcados de base de datos y tarballs de configuración a un prefijo S3 dedicado, con retención local de 7 días y retención offsite de 30 días. Todos los servicios se recuperan automáticamente al reiniciar mediante políticas de reinicio de Docker y unidades systemd.
§05TECNOLOGÍA Y HERRAMIENTAS
JavaScriptEXPERTO
TypeScript · Node.js · ECMAScript · Micro Frontends
Desarrollo FrontendEXPERTO
React · Next.js · Angular · React Native · Gatsby · Progressive Web Apps · SPA · Server-Side Rendering · Static Site Generation · Headless CMS · GraphQL · REST · Service Workers
Sistemas de DiseñoEXPERTO
Figma · Storybook · Design Tokens · Inner-sourcing · Governance
Experiencia de DesarrolladorEXPERTO
CI/CD Optimization · GitHub Actions · CodeQL · Onboarding Automation · Tooling Workflows · DX Strategy
AWSAVANZADO
S3 · CloudFront · Lambda · CloudWatch · Amplify
GitHubEXPERTO
GitHub Actions · Pages · Packages · GHAS · Branch Protections
HTMLEXPERTO
HTML5 · Web Components · HTML Modules · Canvas · Semantic HTML
CSSEXPERTO
Tailwind CSS · Sass · Less · CSS-in-JS
Pruebas & TestingAVANZADO
Jest · Cypress · React Testing Library
IA & Ingeniería AgénticaAVANZADO
Anthropic API · OpenAI API · Model Context Protocol · Despliegue de LLMs Open-Source · Inferencia en GPU Cloud (Modal) · Qwen 2.5 Coder · AI Guardrails · Flujos de Trabajo Agénticos · Abstracción Multi-Proveedor
§06CONTÁCTANOS
Vamos a
charlar.
Ideal para puestos de liderazgo en ingeniería, arquitectura front-end o sistemas de diseño en Europa o a distancia.