Crea una SPA con WooCommerce y React.js

WooCommerce es una herramienta poderosa y altamente personalizable ¿pero que pasaría si la combinásemos con tecnología de punta del lado del frontend como React? Obtendríamos el rendimiento que una SPA (Single Page Application) sin tener que desarrollar un complejo backend de ecommerce desde cero.

Pudiésemos aprevechar muchas de las funcionalidades de WooCommerce (y muchas de sus extensiones) pero con una experiencia de usuario mejorada y altamente escalable; pudiendo incluso dar el salto a una Progressive Web App más adelante, de esas que tanto le gustan a Google. ¡El potencial es tremendo!

Una estructura del taller:

  1. Create React App.
  2. Consumiendo la API de WooCommerce con Axios.
  3. Creando rutas con react-router.
  4. Creando las vistas: Productos, producto, checkout, gracias.
  5. Agregando estilos.
  6. Creando el componente Carrito.
  7. Manejando el estado global con Context Api de React.
  8. Creando pedidos.

Nota: Por razones de tiempo y practicidad, el taller se realizaría con create-react-app en lugar de Next.JS, dejando de lado cosas como Server Side Rendering o autenticación de usuarios, porque a pesar de pertenecer a funcionalidades que se esperan en una aplicación real, no son esenciales para demostrar la combinación React-WooCommerce, que es lo que se quiere lograr con este taller.

Aperitivo formativo

Durante las próximas semanas vamos a ir publicando material complementario (vídeos, cursos, tutoriales, etc) para que puedas sacarle todo el partido a esta sesión.

Enlace a la presentación y vídeo en WordPress.tv

Ponente

Categorías ,

WordCamp Sevilla 2019 is over. Check out the next edition!