Catalogo.

php
Empezamos marcando en la línea 1 declarando que es documento tipo php,
continuamos en la 2 poniendo un session_start(); en donde estamos declarando
que hemos iniciado sesión en la página, seguimos en la línea 3 en la cual usamos un
include para incluir nuestra página y unirla con el conecta para que pueda
realizarse una conexión, seguimos en lin4 declarando al usuario para que así mismo
en la lin5 use una condición, mientras que usuario sea igual a usuario déjalo entrar,
en lin6 estoy utilizando un header para enviar nuestro encabezado que en este
caso sería la url de nuestra página (“location:index.php”);. En lin9 empezamos a
extraer datos de la BD utilizando un SELECT*FROM lo que estamos haciendo es
decir seleccióname de la tabla productos y ordena por sus Id_Producto, es así
como esta consulta genera sus resultados y los arroja con el num_rows, una vez
echo eso se cierra. Continuamos en lin14 declarando que estamos usando un
documento de tipo html, en lin15 estoy diciendo que quiero que mi html se
expanda a lo largo de la pantalla, continuamos entrando al head y abajo en lin17 a
19 coloco lo que son mis links de boststrap y fontello para poder utilizar todos los
estilos e iconos que quiera utilizar, en lin20 coloco el título que aparecerá como
nombre de la página, cierro mi head y empiezo a trabajar en el cuerpo de la página
en la lin24 es aquí donde utilizo un nav que bien sabemos es mi barra de
navegación así que le digo utilizando un class(la cual proporcionara mis estilos) que
quiero que mi barra de navegación sea de tamaño lg expandible a lo largo y que
sea de color negro y que sea estatica.

Elaborado por: Armando Beristrain Gálvez 606

informática
 Catalogo.php

Pasamos a lin25 en donde le digo que quiero mediante un a que me imprima texto cuyo
texto es “BE LEGENDARY”. Después de eso en lin26 le utilizo una clase button para decirle
que quiero un botón tipo botón, que lo coloque en la parte superior de mi cabecera, dentro
de este botón agrego lo que es una clase span la cual me va a ayudar a agregar un icono de
fontello en donde agrego el nombre del icono el cual es icon-dribbble y cierro mi primer
botón.

Elaborado por: Armando Beristrain Gálvez 606

informática
 Catalogo.php

Ahora estamos en lin30 mediante un div creo divisiones para empezar a colocar mis demás iconos,
este div utiliza callapse el cual es una propiedad (se utiliza para fusionar los bordes) así que le digo
que mi navbar pueda soportar los cambios. Pasamos a lin32 es aquí donde empezaremos a
completar nuestros demás iconos entonces utilizamos un li (representa a un ítem en una lista)
entonces mediante el class le digo que será tipo navbar y estará activo, dentro de este mismo
mediante un a le estoy diciendo que es un tipo link mediante el cual mande a llamar al link
mediante el href igual a # dentro de este le digo que me mande a llamar al icon-home que será
imprimido como Inicio. Pasamos a lin36 en donde hacemos lo mismo que con el icono de inicio solo
que esta vez se manda a llamar al icon-attention-circled y será imprimido como Conócenos.
Pasamos a lin39 en donde creamos un icono pero será de tipo botón ya que cuando se haga un clic
sobre el este muestre las diferentes opciones que se tienen, este icono es el de Productos, una vez
teniendo lo mismo que en los dos anteriores este agrega dentro de sí mismo con un a otros 3
iconos, al igual serán de clase ítem que se mandaran a llamar mediante un href cuyos iconos tienen
nombre de icon-pitch(Ropa), icon-dribbble-circled(Deporte), icon-fire-station(Accesorios). Una vez
agregados aparecerán en lista uno debajo de otro con su icono correspondiente, a lado de este se
creará otro icono igual que los anteriores ya mencionados este icono está en lin50 y en lin51 se le
da el nombre de Soporte Técnico.
Elaborado por: Armando Beristrain Gálvez 606
informática
 Catalogo.php

Estamos en lin54 aquí puse un ul ya que voy a crear una lista ordenada de iconos pero estará separada de la anterior, entonces en lin55 empezamos
utilizamos un li (representa a un ítem en una lista) entonces mediante el class le digo que será tipo navbar y estará activo, dentro de este mismo mediante un
a le estoy diciendo que es un tipo link mediante el cual mande a llamar al link mediante el href igual a # dentro de este le digo que me mande a llamar al icon-
user-1, este icono es muy importante ya que en este se encuentra una conexión con php, la cual nos dice que tal usuario ha iniciado sesión, dentro de este
mismo icono se desplegara una ventana donde tiene dentro de sí otros 3 iconos en lin60 y 61 he colocado dos iconos más los cuales son Perfil y Ajustes,
debajo de estos dos he colocado uno de los más importantes ya que a través de este si el usuario da clic este le arrojara una ventana modal con un mensaje, el
cual se alineara al centro de la pantalla. Por ultimo y ya para terminar la cabecera, a partir de lin67 puse un icono el cual muestra la versión, en lin69 he
conservado solo un icono de un carrito, a lado de este en lin72 puse el icono de Facebook, en lin73 el icono de Instagram, y en lin74 el icono de pinteres, es
aquí donde termino mí, cabecera y la cierro en lin78.

Elaborado por: Armando Beristrain Gálvez 606

informática
 Catalogo.php

Como bien lo dice el comentario en lin79 en lin80 lo que hace es enviar un mensaje sobre la conexión, si es que se tiene o no. Empezamos creando
una ventana modal en lin83 lo que hacemos en lin84 a 87 es darle propiedades y el estilo, le digo que sea una ventana modal contenedora de un
dialogo, dentro del cual va a tener un título de cerrar sesión y que en la ventana modal quiero un botón que la pueda cerrar. Dentro de mi ventana en
lin92 en su cuerpo agrego un texto donde le pregunte al usuario ¿Deseas cerrar tu sesión actual? Justo aquí meto php ya que esta me indicará según
el tipo de usuario que haya iniciado sesión y este de cierta forma activo, posteriormente en lin93,94,95 agrego dos botones los cuales uno de ellos
tendrá la función de cancelar y el otro la de salir. Es así como termino por cerrar mi ventana modal en lin99.

Elaborado por: Armando Beristrain Gálvez 606

informática
 Catalogo.php

Empiezo por separar mi nav de mis cartas y lo hago poniendo un section, desde la lin104 declaró que serán contenedoras, en lin106 utilizo
mi php para indicar que se hará una conexión de tal manera que esté conectada a la BD, en lin107 ajusto el maño de mis cartas, en lin109
lo que hago es mandar a llamar de la BD las imágenes en su respectiva carta, en lin113 lo que hago es que dentro de mi carta agrego con
lin114 su titulo tomado de la BD, así mismo hago lo mismo en lin115 tomando su descripción y en lin116 colocando su precio, bajo esta
misma estoy colocando un botón en lin117 donde le asigno una frase tipo texto con su respectivo icono, por ultimo cierro la consulta de
php en lin122 y termino por cerrar mi la sección de la tarjeta en lin126, coloco mis scripts de jquery y Bootstrap en lin127 y 128, por ultimo
cierro el cuerpo de mi documento html en lin129 y 130.

Elaborado por: Armando Beristrain Gálvez 606

informática
 Catalogo.php

Elaborado por: Armando Beristrain Gálvez 606

informática