Web Final

 En esta sección voy a comentar los cambios que he ido haciendo a cervezaslennon.kesug.com desde que terminé la web estática.

Pasar la web estática a dinámica:

Lo primero que hice fue pasar todos los archivos a php en esta parte no tuve mucho problema aunque me fue un poco lío pasar los archivos nuevos al servidor de infinityfree


Crear el log in

Esta parte fue la más difícil, en primer lugar cree una ventana login.php, estuve buscando plantillas pero me costaba bastante adaptarlas bien a la estética de mi página así que al final decidí hacerla yo de cero utilizando algunas líneas de código de plantillas que vi en internet, ese fue el resultado:


A continuación creé la ventana register.php a la que se accede pulsando en regístrate para los usuarios que no tengan una cuenta, para esta página copié prácticamente el login:




Ahora se venía lo difícil, hacer que esto funcione:
primero creé un archivo db.php para conectar con la base de datos que crearé a continuación.

creé la demo_usuarios.sql donde definí una tabla users con los campos id, username, email y pasword y siguiendo el ejemplo departamentos que vimos en una entrega importé la base de datos en infinityfree:


Configuré el registro para que pueda añadir usuarios a la base de datos, primero comprueba que el usuario no exista previamente y luego añade el username, el email y la contraseña se pasa por un hash antes de añadirse para que no se pueda saber mirando en la base de datos:

A continuación hice el login que mira que el usuario exista en la base de datos y verifica que la contraseña coincide con el hash de la base de datos, Si es así redirige a la ventana productos. También agregué en el nav de productos, contacto y nosotros una sección log in.

Por último comprobé que todo funcionase correctamente y aparentemente todo estaba bien, el registro creaba usuarios en la base de datos y el inicio de sesión funcionaba.



Cambios sugeridos de la anterior entrega:
La primera sugerencia era cambiar el header y el nav para que ocupen menos y hubiese que hacer menos scroll, en cuanto a este cambio, si que estoy de acuerdo en que ocupaba demasiado pero no quería cambiar las disposición de las cosas ya que me gusta que se vea el logo arriba en el centro para que se vea bien y el navegador tambien me gusta como está ya que no ocupa demasiado y divide bien el header del resto de la página además cuando utilizas una pantalla más pequeña el navegador y el logo se juntan quedando más o menos como sugerías, con un botón que despliega las secciones del nav:

(Sin desplegar)

(Desplegado)


Además reduje el tamaño del logo para pantallas grandes para que ocupe un poco menos.

También hicce caso a la sugerencia de cambiar la sección de productos hice que sea un carrusel de productos en el que puedes pasar de uno a otro y no haya que scrolear tanto:


También hice cambios en las imágenes de los productos para que fuesen del mismo tamaño.



Lista de deseos y cesta de compra:
Por último quise dar alguna función a logearse por lo que creé una wishlist y una cesta de compra, la idea era que una vez logueado apareciesen en cada producto dos botones para guardar items en la lista de deseos y en la cesta y en el navegador la lista de deseos y la cesta que se pueden desplegar y ver los artículos guardados. Lo implementé pero tuve un primer prolema y es que cuando cambiaba de página no se mantenía la sesión iniciada así que hice que comprobase que la sesión se mantuviese iniciada, que comprobase que estaba iniciada y que en ese caso desapareciese la opción log in del navegador y apareciesen las do listas y aproveché para crear un log out que te permitiese cerrar la sesión. Así queda la página productos una vez inicias sesión:


Vi que si cambiabas de sección las listas se vaciaban así que cree una función para que se guarden los items de la lista mientras la sesión esté abierta, lo único que una vez se cierra la sesión se borran las listas, esto se podría arreglar haciendo que estas listas se guardasen en la base de datos de cada usuario pero de momento lo voy a dejar así ya que todavía no se pueden comprar cosas en la página.

Con esto doy por finalizada mi página web por el momento hasta que empecemos a producir cervezas, cuando eso pase tengo intención de convertirla en una tienda online de nuestra marca.

Comentarios

Entradas populares de este blog

Planificación de la Web

Web estática