🚀 Funciones Avanzadas del Storefront (Next.js 16)

El proyecto de frontend de la tienda, además de un renderizado veloz, incluye funciones muy avanzadas para instalación móvil, SEO profesional y ciberseguridad, preparándolo para el nivel Enterprise.

📱 Soporte para PWA y Modo Sin Conexión

La tienda está configurada como una Aplicación Web Progresiva (Progressive Web App - PWA). Esto permite a los usuarios móviles (Android e iOS) instalar el sitio directamente como una app nativa en sus teléfonos.

• Configuración: Gestionado mediante el plugin @ducanh2912/next-pwa en store/next.config.js.
• Manifiesto Dinámico: El archivo store/src/app/manifest.ts genera la información de iconos, colores del tema y nombre de la aplicación.
• Modo Sin Conexión (Fallback): Si la conexión a internet del usuario se interrumpe, el Service Worker redirige automáticamente a la página personalizada ~offline/page.tsx.

🔒 Encabezados de Seguridad Estrictos (Security Headers)

Para proteger contra ataques comunes como inyección de código (XSS) y Clickjacking, los encabezados de seguridad se inyectan globalmente a través de Next.js:

async headers() {
  return [
    {
      source: '/(.*)',
      headers: [
        { key: 'Strict-Transport-Security', value: 'max-age=63072000; includeSubDomains; preload' },
        { key: 'X-XSS-Protection', value: '1; mode=block' },
        { key: 'X-Frame-Options', value: 'SAMEORIGIN' },
        { key: 'X-Content-Type-Options', value: 'nosniff' },
        { key: 'Content-Security-Policy', value: "default-src 'self'; ..." }
      ],
    },
  ];
}

🕷️ SEO Dinámico y Sitemap Multinacional

En lugar de actualizar manualmente el mapa del sitio, el archivo sitemap.ts se comunica concurrentemente con los microservicios del backend para construir el sitemap más completo para Google.