Add the #DF24 Developer Keynote to your agenda. Join us in-person on 9/18 at 2:30 p.m. PT or on Salesforce+ at 5 p.m. PT for the must-see session built just for developers.

Lista de verificación de mejores prácticas previas a la compilación y puesta en marcha

¡Te damos la bienvenida al inicio de tu viaje con Composable Storefront! Esta lista de verificación resume los puntos clave que pueden tener un gran impacto en el cronograma de su proyecto. Al centrarse en estas cuatro prácticas recomendadas, estará mejor equipado para navegar por las complejidades de crear, lanzar y supervisar un sitio de kit de Progressive Web App (PWA) exitoso y evitar errores comunes. Utilice esta lista de comprobación para planificar una implementación satisfactoria y sin problemas.

A menos que se indique lo contrario, todos los puntos de esta lista de verificación se aplican a los sitios que se construyen al 100% en Composable Storefront o a losdespliegues headless por fases.

Estás en el asiento del conductor cuando se trata de personalización. Comprenda el alcance de la personalización necesaria para satisfacer las necesidades de su negocio. Solo recuerde que un sitio altamente personalizado requiere más esfuerzo, como se describe en estos ejemplos.

  • Familiarícese con el diseño y la funcionalidad disponibles en nuestra Retail React App. Debe crear cualquier funcionalidad que no esté disponible en Retail React App.
  • Utilice los componentes de React existentes tanto como sea posible. PWA Kit utiliza React, por lo que tienes acceso al ecosistema de componentes de React. Si estás haciendo algo personalizado, mira si hay un componente de Chakra para ello. Si no la hay, busque una versión de código abierto. Si no hay una versión de código abierto, construya el componente usted mismo.
  • Verifique que nuestras API sean compatibles con la funcionalidad personalizada requerida y devuelvan los datos que necesita. Si nuestras API no lo hacen, puedes:
    • Cree una API personalizada para devolver los datos; o
    • Amplíe la respuesta de la API mediante un gancho
  • Confirme que los cartuchos y las integraciones de su sitio funcionan con una implementación headless. Para usarlos en un sitio de PWA Kit, puede exponer su funcionalidad mediante API o enlaces personalizados.

Establezca una base sólida para un sitio estable y escalable siguiendo estos pasos.

  • Decida cuántos entornos de Managed Runtime (MRT) de producción tendrá. Tener más entornos te da más control. Pero cuantos más entornos tengas, más complicado será desde el punto de vista operativo gestionarlos todos. Por ejemplo, si tiene cinco marcas que se atienden desde el mismo entorno de MRT, siempre debe actualizarlas juntas. Tener menos entornos significa menos sobrecarga operativa. Consulte Información generalsobre Managed Runtime.
  • Decida si desea utilizar nuestra red de entrega de contenido integrada (eCDN) o una CDN de terceros. Consulte Cuánto utilizar una CDN de terceros Si decide utilizar una CDN de terceros, consulte la documentación de su proveedor para obtener más información.
  • Decide tu estrategia de URL. La mayoría de los clientes optan por mantener sus URL existentes. Haga un plan para redireccionar cualquiera de sus URL actuales que no existirá en su nuevo sitio. Regístrese en las herramientas de Google Search Console u otras herramientas de clasificación para monitorear el efecto de su implementación en su clasificación de SEO. Consulte Enrutamiento.
  • Decida los objetivos, el alcance y el cronograma de su implementación híbrida (headless por fases). Tenga en cuenta que cuanto más tiempo esté su sitio en modo híbrido, más tiempo tendrá que dedicar a la complejidad operativa involucrada. Establece una fecha de vencimiento para la transición a un sitio de 100% Composable. Consulte Lanzamientos por fases.

Aplique estas técnicas para optimizar la eficiencia y la experiencia del usuario de su sitio.

  • Revise la representación del lado del servidor de las páginas de entrada (página de inicio, páginas de listado de categorías, páginas de listado de productos y páginas de detalles del producto) anexando el ?__server_only parámetro a sus URL. Confirme que las páginas renderizadas por el servidor tengan suficientes datos para los rastreadores y que el cambio de diseño entre el servidor y el cliente sea pequeño (idealmente inexistente). Esto puede ayudar a mejorar su clasificación SEO, confirmar que sus páginas de entrada pueden cargarse rápidamente en dispositivos móviles y mejorar la experiencia del comprador.
  • Configure las pruebas de rendimiento con Lighthouse CI. Comience las pruebas de rendimiento a mitad de camino de la implementación. Esto le permite identificar y corregir cualquier regresión de rendimiento (en comparación con su sitio actual) mucho antes del lanzamiento de su sitio PWA Kit.
  • Configure la implementación del código continua a un entorno de MRT que no sea de producción. Desde el principio del trabajo de desarrollo, comience a probar el código implementado en MRT para confirmar que la funcionalidad del sitio funciona según lo esperado. De esa manera, puede evitar costosas repeticiones de trabajo más adelante. Consulte Usuariosde Automation.

Planee usar cualquiera de estas herramientas para monitorear constantemente el rendimiento de su sitio. Verifique también que los datos generados por estas herramientas sean correctos en función de los resultados esperados.

  • Con Log Center, puede revisar errores y métricas. Configure notificaciones para que pueda averiguar cuándo su escaparate funciona de manera anormal e investigar.
  • Use Active Data para monitorear las métricas de su sitio. Esto puede ayudarlo a analizar el comportamiento del comprador para que pueda mejorar la experiencia del comprador y optimizar las ofertas de productos para impulsar el crecimiento de las ventas.
  • Los paneles de informes de B2C Commerce & proporcionan datos que puede usar para identificar tendencias a lo largo del tiempo y tomar decisiones comerciales más inteligentes en función de sus datos de B2C Commerce.

Revisa el resto del flujo de trabajo recomendado para desarrolladores para crear un sitio en Composable Storefront. Consulte Primeros pasos con Composable Storefront.