Build a Shopping Cart with React and TypeScript
Construir un carrito de compras con React y TypeScript
Shopping Cart app - Git En este tutorial vamos a crear una aplicación de carrito de compras de la vida real. Hablaremos sobre la ( technology stack ) pila de tecnología y las funciones que tendrá en un minuto. También te guiaré a través del proceso paso a paso.
Pero primero déjame mostrarte cómo será.
Vamos a dibujar ( Let’s sketch )
Diseñado para un app de movil.
Lista de Productos (Desktop)
Shopping cart App
##### Logo
| Item 1 | Item 2 | Item 3 |
|---|---|---|
| Title 1 | Title 2 | Title 3 |
| Price 100.99 € | Price 25.90 € | Price 50.25 € |
| Addt o Cart | Addt o Cart | Addt o Cart |
Footer
Haremos que nuestra aplicación sea compatible con dispositivos móviles implementando un nivel decente de capacidad de respuesta. Lista de Productos ( Mobile ) Logo ----- Icono carrito Item Tiulo descripivo ampliado a dos filas Precio 100€ Añadir al carrito
Footer
La Cart Desktop y Mobile
Cart Desktop
Logo ----- Icono cart (Con los productos añadidos )
Item 1 | Title - Price 100€ [ - 1 + ]
Item 2 | Title - Price 50€ [ - 1 + ]
Total: ----> 150€
Footer
Esta vez, antes de dedicarme directamente a construir este proyecto, decidí volverme más tradicional. Tomé un bolígrafo y papel y dibujé estos feos bocetos, sólo para asegurarme de tener una idea visual de lo que construiría.
Y, sinceramente, realmente funcionó ✨. Esta técnica ayuda cuando estás a punto de sentarte frente a tu computadora y hacerte la pregunta: