Git Product home page Git Product logo

roper's Introduction

Roper - Grupo 1

Proyecto integrador del Curso de Desarrollo Web Full Stack de Digital House. Grupo 1

Roper es una plataforma e-commerce para la venta de ropa ya sea de personas particulares o emprendedores. En nuestra plataforma van a poder encontrar diseños de indumentaria tanto para hombres como para mujeres.

Nuestro target se compone de cualquier género y edad, partiendo desde la preadolescencia en adelante.

Integrantes

  • Joaquín Ortiz de Zarate: Me llamo Joaquín, soy estudiante de Ingeniería en Informática. Me gusta todo lo relacionado a la tecnología.
  • Ivan Chanenko: Mi nombre es Ivan, tengo 21 años y me gusta la programacion.
  • Lisandro Brasolin: Mi nombre es Lisandro, tengo 20 años y me encanta todo lo que tenga que ver con sonido, programación o literatura.

Webs en las que nos inspiramos...

Tecnologías que se van a utilizar

  • HTML
  • CSS
  • JavaScript
  • Node
  • Express
  • React
  • MySQL
  • APIs
  • Sequelize

Tablero de trabajo:

roper's People

Contributors

ivanalexisc avatar joaquinodz avatar lisandrob avatar

Stargazers

 avatar

Watchers

 avatar

Forkers

ivanalexisc

roper's Issues

Página: carrito de compras.

Página donde el cliente puede visualizar su compra actual y proceder al pago.

Historias de usuario:

  • Como​ cliente ​quiero​ poder acceder al detalle de mi carrito de compras encualquier momento ​para​ finalizar la compra.
  • Como​ cliente ​quiero​ poder modificar productos del carrito ​para​ poder eliminarlosde la compra o modificar la cantidad.

Entregable:​ Archivo productCart.html (o similar) junto con todos los recursos necesarios, estilos de css e imágenes.

Realizar un breve retrospectiva

Nuevamente piensen qué hicieron bien el sprint anterior, qué hicieron mal, qué deberían
empezar a hacer, qué deberían dejar de hacer, sigan ésta dinámica.

Entregable: Actualizar el archivo retro.md con las principales conclusiones de la retro del segundo sprint.

Implementar el motor de templates

  • Implementar el módulo EJS y renombrar todas las vistas actuales para que utilicen la extensión .ejs.
  • Modificar los métodos de los controladores para que utilicen el método render().

Entregable: sitio actualizado con todas las vistas y rutas implementando EJS.

Página: detalle de producto

Página a la que accede el cliente al hacer click en un producto.

Historias de usuario:

  • Como​ cliente ​quiero​ poder ver toda la información relevante del producto ​para decidir si voy a comprarlo.
  • Cómo​ cliente ​quiero​ poder agregar fácilmente el producto a mi carrito ​parapoder comprarlo.

Entregable:​ Archivo productDetail.html (o similar) junto con todos los recursos necesarios, estilos de css e imágenes.

Separar las vistas en carpetas

Si tenemos en cuenta que nuestro sitio va a crecer y que muy pronto tendremos un montón de páginas, nos conviene mantener el orden desde el principio.

Crear dentro de la carpeta views la carpeta products y la carpeta users. Dentro de products pondremos todas las vistas de productos que tengamos (por ejemplo: listado, detalle, creación, edición, etc…), dentro de users pondremos todas las vistas de usuarios que tengamos (por ejemplo: registro, login, perfil, etc…)

● Usuarios: src/views/users/
● Productos: src/views/products/

Entregable: estructura actualizada de directorios y archivos de las vistas.

Página: creación y edición de productos

Formulario al que accede el usuario administrador para cargar nuevos productos y editar los existentes.

Un buen punto de partida para los campos de estos formularios puede ser el siguiente:
● Nombre del producto (name)
● Descripción (description)
● Imagen (image)
● Categoría (category)
● Colores (o cualquier otro campo similar como: tamaños, talles, etc)
● Precio (price)

Historias de usuario:
★ Como administrador quiero poder crear nuevos productos para agregarlos a los
listados del sitio.
★ Cómo administrador quiero poder modificar los productos existentes para corregir información o actualizar precios.

Entregable: páginas de creación y edicion de productos en formato ejs junto con todos los recursos necesarios, estilos de css e imágenes.

Página: registro

Página donde el cliente puede registrarse como usuaria/o del sitio.

Historias de usuario:

  • Como​ cliente ​quiero​ registrarme ​para​ acceder a mi historial de compras.
  • Como​ cliente ​quiero​ registrarme ​para​ facilitar futuras compras.

Entregable:​ Archivo register.html (o similar) junto con todos los recursos necesarios, estilos de css e imágenes.

Separar los componentes repetidos en archivos parciales

Crear una carpeta llamada partials dentro de la carpeta de views, separar las áreas comunes del sitio. Como mínimo nos gustaría ver:

● Head (incluyendo todo el elemento ) → head.ejs
● Header (incluyendo barras de navegación) → header.ejs
● Footer (incluyendo todo el elemento

) → footer.ejs
● (Opcional) Otras secciones de su sitio que se repitan

Pueden separar otros componentes de la misma manera si lo creen útil. Los productos dentro de un listado por ejemplo.
Recuerden implementar los archivos parciales en todas las páginas que correspondan.

Entregable: carpeta partials dentro de views con todos los archivos parciales.
Entregable: sitio actualizado con la implementación de los partials.

Página: login

Página donde el cliente puede ingresar con el usuario que creó previamente.

Historias de usuario:

  • Como​ cliente ​quiero​ registrarme ​para​ acceder a mi historial de compras.
  • Como​ cliente ​quiero​ tener la opción de que el sitio me recuerde ​para​ no escribir mi usuario y contraseña cada vez.
  • Como​ cliente ​quiero​ poder recuperar la contraseña ​para​ poder ingresar si me laolvido.

Entregable:​ Archivo login.html (o similar) junto con todos los recursos necesarios, estilos de css e imágenes.

Realizar un breve retrospectiva

Nuestro equipo es ágil y uno de los secretos de la agilidad es el de fallar rápido para serexitosos más pronto.
Piensen qué hicieron bien el sprint anterior, qué hicieron mal, quédeberían empezar a hacer, qué deberían dejar de hacer, les recomendamos ​éstadinámica​.

Entregable:​ Crear un archivo ​retro.md​ en el repositorio y anotar las principales conclusiones de la retro del primer sprint.

Página: inicio

Home del sitio con la oferta de productos y / o servicios.

Historias de usuario:

  • Como​ cliente ​quiero​ ver un resumen de la oferta de productos ​para​ poder decidirrápidamente si quedarme o buscar el producto en otro sitio.
  • Como​ cliente ​quiero​ que el sitio funcione bien en mi teléfono celular ​para​ poderacceder en cualquier momento.

Entregable:​ Archivo index.html junto con todos los recursos necesarios, estilos de css eimágenes.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.