Svelte 48: Capstone del Módulo E — Construyendo un Carrito de Compras
easy⏱ 5 mincoursesvelte
Todo el Módulo E, en una sola funcionalidad
La superficie pública del carrito es { subscribe, add, remove, clear } — sin set crudo, igual que el contador de la lección 42. itemCount y subtotal son derived directamente del carrito, igual que las cadenas de totales de la lección 41. Header, ProductList y Cart obtienen el mismo paquete vía getContext('cart'), igual que el patrón de widget de la lección 45 — solo que con componentes reales en vez de un contador de juguete.
derived() no le importa que cart no sea un writable
derived(cart, ...) funciona aunque cart sea un objeto hecho a mano con solo {subscribe, add, remove, clear} — prueba de que el CONTRATO DE STORE (lecciones 42–43) es en realidad todo lo que le importa a las primitivas de reactividad de Svelte. Cualquier cosa con .subscribe puede ser fuente para derived, leerse con $, o pasarse a get().
Completa el ciclo entero
Añade un par de productos, observa cómo el badge del header y el subtotal del carrito se actualizan juntos, elimina un producto, y luego vacía el carrito por completo.