mercadolibre-details-challenge

KO | EN

gitlite — search

#javascript #ai #go #machine-learning #deep-learning #macos #windows #cli #kubernetes #vue #security #ios #openai #open-source

mercadolibre-details-challenge

(★ 10)

Mercado Libre details page challenge

mercadolibre-details-challenge Latest Version Download

Download Latest Version (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

![MercadoLibre](https://raw.githubusercontent.com/GastonPerez97/mercadolibre-details-challenge/main/public/favicon.ico "MercadoLibre")

# 🏆 Mercado Libre challenge

https://meli-details-challenge.netlify.app/

![meli-details-challenge vercel app_ (8)](https://user-images.githubusercontent.com/58083159/154566653-cde45345-38d8-40fc-83a3-d29260b53580.jpg)
![localhost_3000_](https://user-images.githubusercontent.com/58083159/154815106-dc06ae2c-0136-4638-9c08-e8beee8005b8.jpg)

***Este repositorio está basado en el challenge de [Goncy](https://gonzalopozzo.com/) ¡Muchas gracias por tomarte el tiempo en armar este desafío!***

***Podés encontrar el challenge acá: https://github.com/goncy/mercadolibre-details-challenge.***

## 🎯 Objetivo:

Debemos crear un clon de [la página de detalle de producto](https://articulo.mercadolibre.com.ar/MLA-904901256-peluche-stitch-1-metro-sentado-lilo-disney-importado-_JM) de Mercado Libre.

## 💾 API:

Mock del producto ubicado en `./src/components/ProductDetails/mock.js`.

## 🛠️ Tecnologías utilizadas:
- HTML 5
- CSS 3
- JavaScript
- [React](https://reactjs.org/) - JS library

## ✅ Definición funcional:

Debemos intentar llegar a un resultado visual lo más aproximado posible, siendo los siguientes los elementos requeridos:

- [x] Carousel que cambia de imagen al clickear (no en hover):

![ezgif-5-413616e110](https://user-images.githubusercontent.com/58083159/154815238-839738c7-e991-492b-8708-cf252e491166.gif)

- [x] Área de detalle del producto (condición, cantidad vendida, título, precio).
- [x] Botones de `Comprar ahora` y `Agregar al carrito`.
- [x] Sección de preguntas y respuestas.

## ➕ Puntos extra:
- [x] Poder agregar comentarios/opiniones (no deben guardarse en ningun lado):

![ezgif-1-c4a97e57fe](https://user-images.githubusercontent.com/58083159/154816402-75f42886-a5c6-4908-be36-500fb010fc21.gif)

- [x] Poder puntuar opiniones:

![ezgif-1-438e60cc9b](https://user-images.githubusercontent.com/58083159/154816337-bec05f75-6199-4d89-846c-59a89a8f1f35.gif)

- [x] Poder ver opiniones por tipo:

![ezgif-1-b6efa3a5e3](https://user-images.githubusercontent.com/58083159/154816384-098ca20b-7fe9-43ba-b918-b609e3de5917.gif)

- [x] Modo oscuro:

![ezgif-1-2cd084c64c](https://user-images.githubusercontent.com/58083159/154816362-bbb2afe4-e5a0-4e50-bbb7-eb2508c5e610.gif)

## 👨‍💻 Agregados por mi cuenta:
- [x] Poder agregar preguntas:

![ezgif-1-084bc00748](https://user-images.githubusercontent.com/58083159/154816440-01445948-c7f9-4549-bf4c-cc5883d742ed.gif)

- [x] Validaciones al agregar una pregunta u opinión:

![ezgif-1-13250489c9](https://user-images.githubusercontent.com/58083159/154816513-2ef7366b-a340-4898-8cfa-b5d6df48b5b6.gif)

![ezgif-1-fa83f53edc](https://user-images.githubusercontent.com/58083159/154818078-ec05f851-3ae2-4187-baec-c0bcc5876ffe.gif)

- [x] Resumen de opiniones con puntuación promedio del producto, utilizando datos dinámicos:

![ezgif-1-3d074f8df5](https://user-images.githubusercontent.com/58083159/154816674-ffc48246-2645-4bd0-a218-08ed6b597537.gif)

- [x] Sección de características del producto, cards de productos e información adicional de la publicación (devolución gratis, garantía, medios de pago, otras publicaciones, etc).
- [x] Mobile responsive:

![ezgif-1-16f05fc74d](https://user-images.githubusercontent.com/58083159/154816726-7e00d1f9-561d-4b3f-9044-c790ced646a5.gif)

- [x] Burger Menu:

![ezgif-1-e9ae50f316](https://user-images.githubusercontent.com/58083159/154816811-30a5ffe1-81e5-4e0a-8f34-0a19c3f92e7b.gif)

mercadolibre-details-challenge

mercadolibre-details-challenge Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

mercadolibre-details-challenge

mercadolibre-details-challenge Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Download README