How marto993/portfolio works
Este repositorio es un portfolio personal React que presenta el perfil profesional, proyectos y contacto, junto con un blog de artículos. El flujo principal va desde la visita al portfolio hasta explorar proyectos o abrir el blog; en el blog se cargan artículos estáticos, se filtran y se muestran en una página de lectura con opciones para compartir. README también documenta un formulario de contacto integrado con n8n, SEO y diseño adaptable. Las rutas y componentes concretos de proyectos y formulario no se muestrean; se representan desde src/App.jsx, que los contiene. La arquitectura se infiere del README y de los extractos disponibles.
Main entry points: App.jsx Portfolio y rutas · ArticlePage.jsx Lectura de artículo · BlogPage.jsx Listado del blog · useArticles.js Carga de artículos
Components 22
Portfolio
- Portfolio y rutas
src/App.jsx - Proyectos y galería
src/App.jsx - Carrusel de imágenes
src/components/ImageCarousel.jsx - Visor de imágenes
src/components/ImageModal.jsx - Formulario contacto
src/App.jsx
Blog
- Artículos estáticos
src/blog/data/articles.js - Carga de artículos
src/blog/hooks/useArticles.js - Listado del blog
src/blog/pages/BlogPage.jsx - Búsqueda y filtros
src/blog/hooks/useBlogFilters.js - Utilidades de artículos
src/blog/utils/articleUtils.js - Lectura de artículo
src/blog/pages/ArticlePage.jsx - Contenido de artículo
src/blog/components/ArticleContent.jsx - Compartir artículo
src/blog/components/ShareButtons.jsx
Servicios compartidos
- Analítica
src/components/Analytics.jsx - Eventos analíticos
src/hooks/useAnalytics.js - SEO
src/components/SEO.jsx - Optimización
src/components/PerformanceOptimizer.jsx - Límite de errores
src/components/ErrorBoundary.jsx - Entrada React
src/main.jsx
Other components
- Visitante
- Webhook n8n
- Redes sociales
Connections 26
- Visitante → Portfolio y rutas: visita
- Entrada React → Portfolio y rutas: renderiza
- Portfolio y rutas → Proyectos y galería: muestra
- Portfolio y rutas → Carrusel de imágenes: renderiza
- Carrusel de imágenes → Visor de imágenes: abre
- Portfolio y rutas → Formulario contacto: muestra
- Formulario contacto → Webhook n8n: envía formulario
- Portfolio y rutas → Listado del blog: abre blog
- Listado del blog → Carga de artículos: carga artículos
- Carga de artículos → Artículos estáticos: lee datos
- Carga de artículos → Utilidades de artículos: ordena fechas
- Listado del blog → Búsqueda y filtros: aplica filtros
- Búsqueda y filtros → Utilidades de artículos: filtra y busca
- Listado del blog → Lectura de artículo: abre artículo
- Lectura de artículo → Carga de artículos: obtiene artículo
- Lectura de artículo → Contenido de artículo: muestra contenido
- Lectura de artículo → Compartir artículo: ofrece compartir
- Compartir artículo → Redes sociales: comparte enlace
- Lectura de artículo → Eventos analíticos: registra lectura
- Compartir artículo → Eventos analíticos: registra difusión
- Eventos analíticos → Analítica: envía eventos
- Portfolio y rutas → SEO: integra SEO
- Listado del blog → SEO: define SEO
- Lectura de artículo → SEO: define SEO
- Portfolio y rutas → Optimización: aplica optimización
- Portfolio y rutas → Límite de errores: contiene fallos