Proyecto Integrador para el curso de Front End con JavaScript de Talento Tech 2024, Agencia de Habilidades para el Futuro (Ministerio de Educación, CABA, Argentina).
El proyecto consite en la creación de una página web con un carrito de compras. Este se hará en varias etapas de desarrollo donde se irán agregando distintos aspectos a partir de las tecnologías aprendidas en el curso.
Se cuenta con una ruta de avance con los requisitos mínimos para cada etapa.
Lo realizado hasta la clase 4:
✔️ Estructura básica HTML dividida en etiquetas semánticas estructurales.
✔️ Archivo README.md que explique el proyecto.
✔️ Integración de archivos multimedia funcionales.
✔️ Enlaces que simulen una navegación interna en la página (Inicio, Productos, etc.).
✔️ Formulario de contacto con Formspree.
✔️ Proyecto subido a un repositorio y con URL funcional.
Lo realizado hasta la clase 8 (preentrega):
✔️ Aplicación de estilos básicos con CSS (header, footer, lista de navegación).
✔️ Integración de un archivo externo styles.css.
✔️ Implementación de Google Fonts.
✔️ Propiedades de Background en alguna sección (color, imagen, degradado, etc.).
✔️ Sección Productos: organizada en cards de forma responsiva con Flexbox.
✔️ Sección Reseñas: organizada con Grid.
✔️ Sección Contacto: responsiva con Media Queries.
Lo realizado hasta la clase 12. Agrega funcionalidad con JavaScript:
❌ Integración de un archivo script.js relacionado con el HTML.
❌ Implementación de una función que verifique si todos los campos del formulario de contacto están completos, mostrando un mensaje en consola.
❌ Creación de un ciclo que genere dinámicamente una lista de productos disponibles y los muestre en la consola.
❌ Implementación de un evento click que muestra la descripción ampliada del producto que clickeamos.
❌ Listado de productos incluidos en nuestro HTML generado por medio de una función en Js.
❌ Función que cree un array de productos y los muestre en la página utilizando una plantilla HTML dinámica.
Lo realizado hasta la clase 16.
❌ Reemplazar la barra de navegación por un navbar responsivo creado por Bootstrap, adaptada a la paleta de colores del proyecto.
❌ Utilizar Fetch para obtener datos de una API pública y mostrarlos en la sección main en el HTML.
❌ Procesar los datos obtenidos de la API para organizarlos en cards (diseñadas con Flexbox o Grid).
❌ Implementar un carrito de compras que permita a los usuarios añadir productos desde las cards, utilizando localStorage y sessionStorage para almacenar la información del carrito.
❌ Los productos en el carrito se deben poder visualizar, editar (cambiar la cantidad) y eliminar.
❌ La información debe mantenerse después de recargar la página.
❌ No debe presentar errores en el inspector de código del navegador.
Esta página fue diseñada y desarrollada por Vanina Denegri.
Imágenes de uso libre:
Herramientas web utilizadas en el proyecto:
Herramientas web utilizadas en este README:
⭐ Si te gustó mi proyecto podés dejarme alguna estrellita.
📧 Mandarme algún mensaje.
🔔 Seguirme en redes para comentar y compartir.
💝 Darme los reconocimientos correspondientes si es necesario.
Estos son mis primeros proyectos. Aún me quedan muchas cosas por aprender y mejorar. Si tenés algún comentario para ayudarme a crecer lo recibiré atentamente, siempre y cuando venga con respeto.
