← volver a proyectos
journalctl -u ape-sena --full

journalctl -u ape-sena --full

APE-SENA Monorepo

Ecosistema empresarial con portales unificados, auth compartida y editor rich-text publicado en npm.

0

portales React

0KB

renderer npm

0%

menos duplicación

0

paquetes compartidos

alejandro@codedbyjav.cc :~$ cat context.md

¿Por qué?

context.md

La Agencia Pública de Empleo operaba múltiples portales (usuarios, transaccional, CMS) con bases de código divergentes. Cada equipo reimplementaba auth, tablas y editores. Los releases eran lentos y el design system no escalaba entre productos. El dolor lo sentían equipos de desarrollo y operaciones: inconsistencia visual, bugs duplicados y onboarding de semanas para cada portal nuevo.

alejandro@codedbyjav.cc :~$ grep -E "^\[ \]" objectives.md

¿Para qué?

objectives.checklist
  • ○ Unificar 6 portales bajo un monorepo con builds incrementales.
  • ○ Publicar paquetes npm reutilizables (@ape/auth, ape-rich-text).
  • ○ Establecer design system con Storybook y tokens compartidos.
  • ○ Reducir tiempo de onboarding de desarrolladores nuevos.
  • ○ Mantener despliegues independientes por portal.

alejandro@codedbyjav.cc :~$ ls adr/

Decisiones de arquitectura

Turborepo + pnpm workspaces

alternatives: Repos separados, Nx, Lerna

why: Cache remoto, pipelines paralelos y convenciones simples para equipos mixtos.

trade-off: Curva inicial de configuración y políticas de dependencias estrictas.

Paquete npm ape-rich-text publicado

alternatives: Copiar código entre portales, CDN bundle ad-hoc

why: Renderer de ~5KB reutilizable en todos los portales con versionado semántico.

trade-off: Overhead de releases coordinados entre consumidores.

React 19 + Vite 7 por app

alternatives: Next.js en todos los portales, CRA legacy

why: SPAs administrativas sin SSR; HMR rápido y builds ligeros por portal.

trade-off: SEO y routing avanzado delegados a portales públicos específicos.

Storybook como fuente de verdad UI

alternatives: Figma-only, documentación en Confluence

why: Componentes probados en aislamiento antes de integrar en 6 apps.

trade-off: Mantenimiento dual de stories y páginas reales.

alejandro@codedbyjav.cc :~$ tree -L 2 apps/

Arquitectura

architecture.flow
Portal Usuarios Transaccional CMS @ape/* pkgs Storybook

alejandro@codedbyjav.cc :~$ npm ls --depth=0

Stack tecnológico

Turborepo React 19 TypeScript Vite 7 Tailwind 4 TipTap Storybook pnpm Turborepo React 19 TypeScript Vite 7 Tailwind 4 TipTap Storybook pnpm

alejandro@codedbyjav.cc :~$ tail -f results.log

Resultados

results.log
[OK] [OK] 6 portales desplegados con componentes compartidos
[OK] [OK] ape-rich-text publicado en npm con renderer ~5KB
[OK] [OK] 40% menos código duplicado entre portales
[OK] [OK] Onboarding reducido de 3 semanas a 5 días

lecciones aprendidas

  • Versionar paquetes internos como productos externos evita deuda silenciosa.
  • Storybook paga dividendos cuando hay más de 3 consumidores del mismo componente.
  • Turborepo brilla con equipos que necesitan independencia y coherencia a la vez.

¿Construimos algo juntos?

Abierto a roles senior full-stack y trabajo freelance seleccionado. Escribime por LinkedIn — leo cada mensaje.

LinkedIn →