En este proyecto se utilizó para poder comprender el github flow, la metodología de scrum y las responsabilidades del trabajo en equipo. Para el e-commerce utilizamos Javascript, Css, React, Redux, MongoDB y Mongoose. En el deploy se utilizó Mongo Atlas para la base de datos, Heroku para el servidor y Firebase para el front.
En ella podemos encontrar una barra de navegación superior, unos filtros por categorías de los instrumentos, un carrusel de imágenes (el cual cambia automáticamente o se puede recorrer a gusto), un filtro por rango de precios y un ordenamiento ascendente o descendente de los precios, unas tarjetas que muestran el producto publicado, un paginado para poder recorrer la tienda y ver todos los productos, un footer con links importantes y finalmente un asistente virtual.
pp_Trim.mp4
Para poder filtrar por categorías se tiene elegir una de las categorías principales, hacer clic y se despliegan sub-categorías. Después elegir la sub-categoría deseada y se mostraran todos los productos de esa categoría. Si se quiere limpiar el filtro solo basta con tocar el logo en la barra de navegación.
categorias_Trim.mp4
Para filtrar por rango de precios se tiene que elegir el rango preferido y tocar el botón “Apply”. Si se quiere elegir el orden ascendente o descendente solo hay que tocar la flechita al costado del filtro. Si se quiere limpiar el filtro solo basta con tocar el botón “Clear”.
ord_Trim.mp4
Si se quiere recorrer todos los productos de la tienda hay que usar los botones “Prev” y “Next”.
paginado_Trim.mp4
En la barra de búsqueda se pueden colocar palabras claves como categoría, modelo o marca del instrumento. El buscador tiene un auto completado con sugerencias, una vez elegido lo que se quiere buscar se toca la lupa.
busq_Trim.mp4
Cuando se quiere acceder al detalle del producto se pude hacer tocando la imagen o el título de la tarjeta. En la página del detalle se pueden ver la descripción del producto, las reviews y preguntas que hicieron los clientes.
detalle_Trim.mp4
Si se quiere realizar una compra, añadir un producto a la lista de deseados, hacer reviews y/o preguntas se necesita estar logueado. Para loguearse hay que apretar el botón “Login” y te redirige a una página donde se puede crear un usuario, usar un usuario registrado o ingresar con la cuenta de Google
login_Trim.mp4
Cuando se quiere ver el perfil del usuario hay que apretar la imagen del usuario en la barra de navegación, y seleccionar la opcion de "Your profile". A la hora de modificar el perfil se tiene que hacer clic en el boton "Edit" y modificar los cambios deseados.
edit.user_Trim.mp4
Para realizar una compra se tiene que agregar los productos deseados, se puede hacer desde la página principal en la tarjeta del producto o desde la página del detalle. Se pueden agregar productos hasta el stock máximo, desde el carrito se pueden agregar o restar mas productos del mismo tipo o eliminar la cantidad total del producto.
comprar_Trim.mp4
Se pueden ver las compras desde el perfil del usuario, en el botón con el Ícono de una caja. Se pueden ver los productos comprados en cada compra, la fecha de compra, el precio total y el estado de la compra.
ver.compras_Trim.mp4
Si un producto se lo quiere agregar o eliminar de la lista de deseos hay que hacer clic en el botón con forma de corazón en las tarjetas o desde el detalle del producto.
favs_Trim.mp4
Para acceder a la lista de deseos hay que entrar al perfil del usuario y seleccionar el botón con forma de corazón. Se pueden ver los productos agregados a la lista de deseos y eliminar los productos que se quieran.
wishlist_Trim.mp4
Para hacer reviews hay que entrar al detalle del producto, seleccionar el botón "Review this product" y completar el formulario. Cuando se quiere hacer una pregunta hay que seleccionar el botón "Ask a Question". Se pueden ver las reviews y preguntas realizadas en el detalle de los productos.
ryq_Trim.mp4
Desde el footer se puede ver los datos de la tienda, el número de teléfono, el mail, la dirección de la tienda y un mapa de la ubicación del e-commerce.
about_Trim.mp4
Se puede acceder al asistente virtual tocando el botón que se encuentra abajo a la derecha. Al hablar con Maribot se puede llegar a la página de contacto y dependiendo de lo que se esté buscando te puede sugerir un producto.
chatbot_Trim.mp4
Para crear productos en la tienda se necesita ser usuario admin, para entrar en la página de administrador hay que apretar la imagen del usuario en la barra de navegación, y seleccionar la opcion de "Admin panel". Al entrar tocar el botón “+” y completar el formulario. Cuando se quiere eliminar hay que buscar el producto y apretar el botón con forma de tacho de basura.
crear_Trim.mp4
delete_Trim.mp4
Dentro del panel de admin se puede modificar el producto tocando el botón con forma de un lápiz y modificar el formulario. A la hora de realizar una oferta se tiene que buscar el producto y tocar el botón con forma de una etiqueta, si se quiere eliminar la oferta se usa el botón con forma de tic.
update_Trim.mp4
sale_Trim.mp4
Dentro del panel de administrador en la sección de ventas se puede modificar el estado de una compra tocando el botón con forma de lápiz y seleccionando el nuevo estado de la compra. Cuando se quiere eliminar una compra se tiene que hace clic en el botón con forma de tacho de basura.
modcompras.mp4
Si se quiere responder preguntas hay que ir a la pagina de preguntas, apretar el botón con forma de mensaje y escribir la respuesta deseada.
rquestion_Trim.mp4
En la pagina de administrar usuarios se puede hacer administrador a un usuario usando el botón con una llave, si se quiere enviar un mail para que el usuario resetee su contraseña hay que apretar el botón con forma de un mail, cuando se quiere banear al usuario y que no pueda hacer nada se tiene que apretar el botón de prohibido. Finalmente, si se quiere eliminar el usuario hay que apretar el botón con forma de tacho de basura.
user_Trim.mp4
Cuando se quiere modificar algún dato del negocio se hace desde la página de administrar información, se modifica el dato en el formulario.