Skip to content

Práctica del módulo 5 de LAUNCHX , el tema : VueJS(PASTELERIA)

Notifications You must be signed in to change notification settings

RobertoPeredo/PracticaVueJS

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 

Repository files navigation

PracticaVueJS

Práctica del módulo 5 de LAUNCHX , el tema : VueJS(PASTELERIA)

En esta práctica ponemos en práctica los conocimientos adquiridos de vUEJS en el curso de LAUNCHX. La práctica consiste en crear una página para una pastelería. Se crea una página usando Vuejs la cual tiene varias vistas, las vistas a su vez se crean a partir de componentes. Se pueden pasar datos entre la vista de los clientes y la vista del pastelero por medio de la store con Vuex.

Link de los requerimientos de la pagina ---->>>LINK

Link del código desarrollado en VUEJS---->>>LINK

Link de la página desplegada en Github pages --->>> LINK

Capturas de pantalla del funcionamiento del sitio, se muestra la navegación por las distintas vistas del sitio, así como también se observa que el sitio es responsivo

  1. Página principal de la pastelería. FireShot Capture 002 - pasteleria-vue - localhost 1.1 Página principal de la pasteleria para dispositivos pequeños. (Se observa como el navbar se contrae) FireShot Capture 003 - pasteleria-vue - localhost
  2. Vista 'Pasteles' del sitio. En esta página se da a conocer a los clientes los sabores que se manejan en la pasteleria. FireShot Capture 004 - pasteleria-vue - localhost 2.1 De igual forma la vista pasteles se muestra en dispositivos pequeños. FireShot Capture 005 - pasteleria-vue - localhost
  3. Vista 'Realiza tu pedido' del sitio. En esta los clientes pueden realizar su pedido por medio de un formulario, el cual cuenta con validación de datos. Al no llenar cualquiera de los datos aparece una leyenda que pide al usuario llenar el campo y por consiguiente no permite avanzar de pagina FireShot Capture 007 - pasteleria-vue - localhost 3.1 Vista para dispositivos pequeños, con todos los campos llenados. Las leyendas de 'favor de llenar los campos' son retiradas. FireShot Capture 015 - pasteleria-vue - localhost
  4. Una vez llenado correctamente el formulario se despliega la siguiente vista que es 'Revisar pedido'. En esta vista el usuario puede validar que los datos ingresados hayan sido los correctos, de no ser así puede presionar el botón 'regresar' para volver a la página anterior y modificar cualquier cambio. En caso de que la información esté correcta deberá presionar 'Realizar pedido' el cual lo llevo a la siguiente vista FireShot Capture 014 - pasteleria-vue - localhost
  5. Vista 'PedidoRealizado', esta vista simplemente le indica al usuario que su pedido fue tomado correctamente FireShot Capture 016 - pasteleria-vue - localhost
  6. Por último la vista 'Inventario' que, en este caso, sería una vista única del pastelero. En esta vista se van registrando todos los pedidos que el usuario vaya haciendo en la vista 'Realiza tu pedido' , también cuenta con un inventario el cual muestra una etiqueta de color rojo cuando el stock es menor a 3. Así mismo se puede ir modificando el stock para cada elemento de forma manual FireShot Capture 017 - pasteleria-vue - localhost 6.1 Vista del inventario para dispositivos pequeños FireShot Capture 018 - pasteleria-vue - localhost

About

Práctica del módulo 5 de LAUNCHX , el tema : VueJS(PASTELERIA)

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published