Patrón Abstract Factory — Ejemplo Práctico

PUBLICADO: 2026-08-16
AUTOR: MANUEL PRIETO
Patrones de Diseño

El patrón Abstract Factory produce familias completas de objetos relacionados garantizando su compatibilidad entre sí.

1. El Problema de Partida

El proyecto renderiza dos secciones con estructura similar pero componentes distintos: Blog (con BlogIndex, PostArticle, BlogSidebar) y Knowledge (con KnowledgeIndex, KnowledgePost, KnowledgeSidebar). Mezclar componentes de una familia con otra (ej. BlogIndex + KnowledgeSidebar) rompe el diseño porque cada familia espera props y contexto distintos. Sin una fábrica centralizada, cada página decide "a mano" qué componente importar, con riesgo de mezclar familias por error.

2. La Solución Abstract Factory

3. Uso en la página

4. Ventajas

  • Imposible mezclar familias: getContentFactory('blog') nunca puede devolver un KnowledgeSidebar por error de importación manual.
  • Añadir una tercera sección (ej. projects) solo requiere una entrada nueva en factories, sin tocar las páginas que ya consumen la fábrica.
  • Punto único de verdad: saber qué componentes pertenecen a qué sección vive en un solo archivo.