Catalog Studio es una aplicación de escritorio diseñada para facilitar la administración de catálogos de productos y la generación de documentos PDF listos para compartir o distribuir.
El proyecto permite importar información desde catálogos de proveedores en PDF, revisar los productos detectados, almacenarlos localmente y generar nuevos catálogos a partir de la información administrada.
La aplicación funciona completamente de forma local:
Sin servidor · Sin internet · Sin autenticación · Los datos permanecen en el equipo del usuario
La gestión de catálogos puede convertirse en un proceso repetitivo cuando la información de los productos proviene de diferentes proveedores y formatos.
Un flujo típico puede requerir:
Catálogo del proveedor
↓
PDF
↓
Extracción manual de información
↓
Actualización de productos
↓
Diseño del catálogo
↓
Exportación a PDF
Catalog Studio busca simplificar este proceso:
Catálogo del proveedor
↓
Importar PDF
↓
Extracción automática
↓
Revisión de cambios
↓
Base de datos local
↓
Selección de productos
↓
Generación del catálogo
↓
PDF
Permite importar catálogos de proveedores en formato PDF y extraer automáticamente información como:
- Código del producto
- Nombre
- Precio
- Imagen
La importación incluye una etapa de revisión antes de confirmar los cambios.
Los productos se clasifican según el resultado de la comparación:
- 🟢 Nuevos
- 🟡 Actualizados
- ⚪ Sin cambios
- 🔴 Con errores
El código del producto funciona como clave única, evitando duplicaciones durante las importaciones.
Catalog Studio puede generar un nuevo catálogo PDF utilizando los productos almacenados localmente.
El documento puede incluir:
- Portada
- Índice
- Productos
- Imágenes
- Paginación
- Elementos de marca
Además, permite seleccionar qué productos deben incluirse en cada exportación.
La aplicación contempla la administración de:
- Productos
- Categorías
- Configuración del catálogo
El acceso a estas operaciones se realiza mediante la capa de aplicación y comunicación segura entre Electron y el renderer.
Los catálogos pueden utilizar assets personalizados ubicados en:
data/images/
Actualmente se soportan:
cover-base.png
header.png
footer.png
cover-base.png
Se utiliza como base de la portada y permite agregar información dinámica como año y mes.
header.png
Banner utilizado en las páginas del catálogo.
footer.png
Banner utilizado en la parte inferior de las páginas.
Los assets son opcionales. Si no existen, la aplicación continúa funcionando utilizando un diseño básico.
Catalog Studio utiliza una arquitectura basada en Clean Architecture, organizada como un monorepo mediante npm workspaces.
┌───────────────────────┐
│ Electron App │
│ React Renderer + Main │
└───────────┬───────────┘
│
IPC
│
┌───────────▼───────────┐
│ Application │
│ Use Cases │
└───────────┬───────────┘
│
┌───────────▼───────────┐
│ Domain │
│ Entities / Ports │
└───────────┬───────────┘
│
┌───────────▼───────────┐
│ Infrastructure │
│ Prisma / SQLite │
│ PDF / Playwright │
└───────────────────────┘
catalog-studio/
│
├── apps/
│ └── desktop/
│ ├── Electron Main
│ ├── Preload
│ └── React Renderer
│
├── packages/
│ ├── domain/
│ ├── application/
│ ├── infrastructure/
│ ├── shared/
│ └── catalog-template/
│
├── scripts/
├── package.json
└── tsconfig.base.json
Aplicación principal de Electron.
Contiene:
- Electron Main
- Preload
- React Renderer
La interfaz de usuario no accede directamente a Prisma.
La comunicación se realiza mediante la API expuesta a través de IPC:
React UI
↓
window.api.*
↓
Electron IPC
↓
Application Layer
Contiene las entidades y contratos principales del dominio.
Su objetivo es mantener la lógica central independiente de frameworks y herramientas externas.
Domain
├── Entities
└── Repository Ports
Contiene los casos de uso de la aplicación.
Entre ellos:
- CRUD
- Importación de catálogos
- Generación de PDF
Esta capa coordina las operaciones sin depender directamente de implementaciones concretas de infraestructura.
Contiene las implementaciones concretas de los servicios definidos por la aplicación.
Actualmente incluye:
- Prisma
- SQLite
- Parsers PDF
- Playwright
Contiene elementos compartidos entre diferentes partes de la aplicación:
- DTOs
- Schemas de validación
- Zod
- Contratos de canales IPC
Contiene la plantilla utilizada para construir el catálogo.
La plantilla está implementada utilizando React puro y no depende directamente de Electron o Node.js.
El proceso de generación es:
Products
↓
React Catalog Template
↓
HTML
↓
Playwright / Chromium
↓
PDF
Esta separación permite reutilizar potencialmente la plantilla en una futura versión web.
Catalog Studio está pensado para escenarios donde la información de los productos puede ser sensible o donde no es necesario mantener una infraestructura backend.
Por eso el proyecto utiliza una arquitectura local-first:
Usuario
│
▼
Electron
│
├── React
├── Application
├── Domain
└── Infrastructure
│
▼
SQLite
Los datos permanecen en el equipo del usuario.
SQLite permite mantener toda la información localmente sin requerir:
- Servidor de base de datos
- Infraestructura cloud
- Conexiones externas
- Configuración adicional
La persistencia se gestiona mediante Prisma.
La separación permite evitar que la lógica de negocio quede acoplada a tecnologías concretas.
Por ejemplo:
Domain
↓
Define qué necesita la aplicación
Application
↓
Define qué debe hacer
Infrastructure
↓
Define cómo se realiza
Esto facilita evolucionar el proyecto y reemplazar implementaciones cuando sea necesario.
La importación de PDFs utiliza una arquitectura basada en estrategias.
PDF
│
▼
CatalogImporter
│
┌───────┴────────┐
▼ ▼
Grid Parser Table Parser
│ │
└───────┬────────┘
▼
Normalized Products
│
▼
Validation
│
▼
Review Changes
│
▼
Import
Este diseño permite incorporar nuevos formatos de proveedores sin modificar el resto de la aplicación.
La generación del catálogo utiliza una plantilla React independiente de Electron.
Database
│
▼
Selected Products
│
▼
Catalog Template
│
▼
HTML
│
▼
Chromium / Playwright
│
▼
PDF
Este enfoque permite utilizar tecnologías web para construir documentos PDF con una estructura visual más flexible.
Electron · React · TypeScript
Prisma · SQLite
Playwright · Chromium · PDF
Zod
Clean Architecture · Monorepo · npm Workspaces · IPC
Para ejecutar el proyecto localmente necesitas:
- Node.js 20+
- npm 10+
Puedes verificar las versiones:
node --version
npm --versionClona el repositorio:
git clone https://github.com/srdejo/catalog-studio.gitEntra al proyecto:
cd catalog-studioInstala las dependencias:
npm installInstala Chromium para Playwright:
npx playwright install chromiumGenera el cliente de Prisma:
npm run db:generateCrea la base de datos local:
npm run db:migrateInicia la aplicación:
npm run devPara generar una versión instalable:
npm run buildLos datos generados por el usuario se almacenan en:
data/
├── catalog.db
└── images/
Estos datos incluyen:
- Base de datos SQLite
- Imágenes de productos
- Assets de marca
Los datos del usuario están separados del código fuente y no forman parte del control de versiones.
- Arquitectura de aplicación de escritorio
- Monorepo con npm workspaces
- Clean Architecture
- Persistencia con Prisma + SQLite
- Comunicación Electron mediante IPC
- Gestión de productos
- Gestión de categorías
- Configuración del catálogo
- Importación de catálogos PDF
- Detección de productos nuevos
- Detección de productos actualizados
- Detección de productos sin cambios
- Prevención de productos duplicados
- Parser para catálogos con grillas
- Parser genérico de tablas
- Generación de catálogos PDF
- Selección de productos para exportación
- Portada
- Índice
- Paginación de productos
- Dashboard con métricas
- Mejoras en las pantallas de gestión
- Gestión visual de imágenes
- Importación y exportación mediante Excel
- Nuevos formatos de catálogos
- Mejoras en la experiencia de usuario
- Empaquetado y distribución de versiones instalables
Una de las ideas detrás de Catalog Studio es separar claramente el motor de generación de catálogos de la aplicación de escritorio.
La arquitectura actual permite pensar en una posible evolución:
Catalog Engine
│
┌─────────┴─────────┐
│ │
▼ ▼
Desktop App Web App
Electron React
El paquete catalog-template ya está diseñado para funcionar de forma independiente de Electron, lo que abre la posibilidad de reutilizar parte de la solución en otros entornos.
🚧 En desarrollo
Catalog Studio es actualmente un proyecto en evolución.
La funcionalidad principal de importación y generación de catálogos ya está implementada, mientras que las siguientes etapas están enfocadas principalmente en mejorar la experiencia de usuario, ampliar las capacidades de gestión y facilitar la distribución de la aplicación.
El proyecto se encuentra actualmente en desarrollo.
Si encuentras un problema, tienes una idea o quieres proponer una mejora, puedes abrir un Issue en el repositorio.
Este proyecto está disponible bajo la licencia MIT.
Consulta LICENSE para conocer los términos completos.
Daniel Jimenez
Software Engineer · Full Stack Developer
🐙 GitHub
De catálogos de proveedores a documentos listos para compartir.