Crear un e-commerce usando lo aprendido en JavaScript (Eventos DOM, funciones, condicionales, objetos, arreglos, m茅todos de arreglos, localStorage, promesas, asincron铆as, peticiones HTTPs, hacer uso de CSS para realizar el dise帽o responsive).
Para el desarrollo del trabajo se cumpli贸 con lo solicitado en el documento proporcionado, se crearon funciones para:
- Mostrar los Productos
- Sumar/Restar Productos del Carrito
- Agregar a Favoritos
- Eliminar producto de Favoritos
- Agregar productos al carrito y total de productos agregados y precio
- Eliminar productos del Carrito
- Muestra de la Factura de los Productos (Total final de la compra)
- Solicitud de Datos y Compra final
- Validacion de datos del adminsitrador
- Mostrar los productos actuales
- Modificar Los Productos actuales
- Eliminar Producto
- Agregar un nuevo Producto
- Mostrar compras de Usuarios
Tambien se realizaron peticiones HTTPS como PUT, POST, GET y DELETE las cuales nos permitieron:
- Obtener Datos de la API
- Subir Datos a la API
- Eliminar Datos de la API
- Actualizar con Nuevos Datos
Tambien se trabajo con localStorage para
- Manejar datos y mostrar en tiempo real el carrito del usuario
- Manejar datos y mostrar en tiempo real los objetos favoritos del usuario
Ademas se uso sessionStorage para
- Validar del login en el panel de administrador
- Restringir acceso de usuarios al panel de administrador
Las librer铆as utilizadas fueron la de Axios, Bootstrap, sweetalert y AnimateCSS
- Axios es una librer铆a la cual nos permite trabajar de manera m谩s r谩pida y c贸moda con peticiones HTTPS.
- Bootstrap es una librer铆a la cual nos permite usar algunos estilos y trabajar con CSS de manera m谩s c贸moda y r谩pida,
- SweetAlert es una libreria que nos permite tener popouts boxes de manera customizable y sencilla
- AnimateCSS es una libreria que nos permite tener animaciones CSS de manera r谩pida y sencilla.
La estructura de las carpetas es la siguiente:
- 馃搧 css
- css almacena el css de todos los sitios, cart, admin, login, wishlist
- 馃搧 db
- db es una carpeta donde esta almacenado el db.json el cual permite usarlo como Fake API para poder montar ahi los productos, los usuarios, las compras, y los favoritos
- 馃搧 imgs
- en esta carpeta se almacenan todas las imagene relacionadas con el sitio, tanto logos, products, imagenes de las cards etc.
- 馃搧 pages
- en esta carpeta se almacen las otras paginas del sitio, como lo son: wishlist, login, admin y cart.
- 馃搧 scripts
- en esta carpeta se almacena todos los archivos js para cada sitio, donde en estos se escribio la logica para el funcionamiento del sitio y los puntos requeridos.
- 馃搧 services
- en esta carpeta se almacenan un archivo JS el cual nos permite manejar la logica de verificar el login del usuario.
