- Organizar 48 imágenes en public/assets/infografias/ por bloques - Adaptar MarkdownViewer para procesar rutas de imágenes automáticamente - Actualizar Service Worker para cachear imágenes (offline-first) - Configurar Vite para incluir imágenes en build - Crear documentación: guías de integración, sugerencias de medios, estado de imágenes - Scripts de organización automática de imágenes Cambios técnicos: - MarkdownViewer normaliza rutas de imágenes (relativas → absolutas) - Service Worker cachea /assets/infografias/ automáticamente - Vite config actualizado para mantener estructura de carpetas - 48 imágenes organizadas: bloque-0 (9), bloque-2 (27), bloque-3 (9), bloque-7 (1), bloque-12 (2) Documentación: - GUIA_INTEGRAR_IMAGENES_PWA.md - GUIA_RUTAS_IMAGENES_MARKDOWN.md - SUGERENCIAS_MEDIOS_VISUALES.md - IMAGENES_NECESARIAS.md - ESTADO_FINAL_IMAGENES_PWA.md - RESUMEN_ORGANIZACION_IMAGENES.md
2.9 KiB
2.9 KiB
📋 Resumen de Cambios - EMERGES TES v2.0
✅ OBJETIVO 1: DONACIONES MINIMALISTAS
Cambios Realizados
-
Componente Footer creado (
src/components/layout/Footer.tsx)- Footer minimalista y no intrusivo
- Visible solo en desktop (hidden en móvil)
- Enlace a Ko-fi: "☕ Apóyanos"
- Estilos consistentes con el resto de la app
-
Integrado en App.tsx
- Footer añadido al layout principal
- Layout ajustado con flexbox para posicionamiento correcto
Archivos Modificados
src/App.tsx- Añadido Footer al layoutsrc/components/layout/Footer.tsx- Nuevo componente
Verificación
- ✅ Enlace visible en desktop
- ✅ No intrusivo (hidden en móvil)
- ✅ Abre Ko-fi en nueva pestaña
- ✅ Estilos consistentes
✅ OBJETIVO 2: DEPLOY EN SERVIDOR PROPIO
Cambios Realizados
-
Scripts de producción (
package.json)build:production: Build optimizado para producciónstart:production: Servidor de preview (opcional)
-
Configuración PM2 (
ecosystem.config.js)- Configuración para servidor Node.js (opcional)
- Solo necesario si no usas Nginx estático
-
Script de deploy (
deploy.sh)- Automatiza: git pull, npm ci, build, PM2 restart
- Ejecutable y comentado
-
Configuración Nginx (
nginx.conf.example)- Configuración completa para servir SPA estática
- Soporte para SSL/HTTPS
- Cache optimizado
- Redirección SPA (try_files)
-
Documentación
DEPLOYMENT.md: Guía completa de deploymentTEST_CHECKLIST.md: Checklist pre-deployenv.example: Variables de entorno
-
Gitignore actualizado
- Añadidos archivos .env
Archivos Creados
ecosystem.config.jsdeploy.shnginx.conf.exampleDEPLOYMENT.mdTEST_CHECKLIST.mdenv.example
Archivos Modificados
package.json- Scripts de producción.gitignore- Variables de entorno
🎯 Estado Final
Funcionalidad
- ✅ App funciona exactamente igual
- ✅ Footer con donaciones añadido (discreto)
- ✅ Configuración de deploy completa
- ✅ Documentación exhaustiva
Próximos Pasos para Deploy
-
En el servidor:
# Clonar repositorio git clone <repo> /var/www/emerges-tes cd /var/www/emerges-tes # Instalar dependencias npm ci # Build npm run build # Configurar Nginx (ver DEPLOYMENT.md) sudo cp nginx.conf.example /etc/nginx/sites-available/emerges-tes sudo ln -s /etc/nginx/sites-available/emerges-tes /etc/nginx/sites-enabled/ sudo nginx -t sudo systemctl reload nginx -
Para actualizaciones:
./deploy.sh
📝 Notas Importantes
- No se añadió complejidad innecesaria
- No se modificó lógica existente
- Todos los cambios son reversibles
- Documentación completa incluida
Fecha: 2024-12-19
Versión: 2.0