FASE 4 - DISEÑO E IMPLEMENTACIÓN DEL LADO DEL SERVIDOR

DANNY JOSÉ RIOS PÉREZ

CÓDIGO: 10774624

GRUPO: 301127_26

PROGRAMACION DE STITIOS WEB

TUTOR:

FRANCISCO JAVIER HILARIÓN NOVOA

UNIVERSIDAD NACIONAL ABIERTA Y A DISTANCIA - UNAD

ESCUELA DE CIENCIAS BÁSICAS TECNOLOGÍA E INGENIERÍA

ABRIL DE 2019
 INTRODUCCIÓN

La presente actividad tiene como propósito el desarrollo de una aplicación web para la gestión

comercial de la empresa Fox Electronic, con el fin de optimizar los procesos de ventas compras e

inventarios que viene realizando actualmente.

En esta fase se implementa en el sitio web interactivo el uso de lenguajes de programación web

del lado del servidor incluyendo bases de datos y librerías para la ejecución proyectos que

permitan dar solución a problemática planteada.

Se agregaron las opciones de creación de bases de datos, tablas copias de seguridad y reportes en

el menú Administrador, igualmente a través del CRUD el ingreso, actualización consulta y

eliminación de los productos.

 DESARROLLO DE LA ACTIVIDAD

 Para el acceso a la base de datos, se establece como clave para acceso al motor

phpMyAdmin: 12345678 con el usuario: root.

Imagen 1. Ingreso a phpMyAdmin. (30 de abril de 2019). "Elaboración propia"

 Se creó un formulario en HTML de inicio de sesión, donde el usuario digita su nombre de

usuario y su contraseña con el fin de validar su acceso al sistema.

 Imagen 2. Inicio de sesión. (30 de abril de 2019). "Elaboración propia"

En la siguiente imagen se aprecia que la contraseña está encriptada en MD5, mediante la función

md5() de PHP.

Imagen 3. Tabla usuarios contraseña MD5. (30 de abril de 2019). "Elaboración propia"

 Se codificó un script en PHP que valida los datos de inicio de sesión del usuario y los

valida con los almacenados en la base de datos, con el fin de permitir o negar el acceso al

aplicativo, mediante el uso de sesiones en PHP y estableciendo un contador de tal manera

 que pasados 7 minutos le pida nuevamente nombre de usuario y contraseña al usuario en

cuestión.

Imagen 4. Verificación de sesión. (30 de abril de 2019). "Elaboración propia"

 En caso de no estar registrado se tiene el siguiente formulario donde puede realizar el

proceso, suministrando el número de identificación, nombre de usuario, correo

electrónico y contraseña.

Imagen 5. Registro de usuarios. (30 de abril de 2019). "Elaboración propia"

 El estado del usuario es (1) o (0). Cuando este en (0), no tiene acceso al aplicativo así sus

credenciales de acceso sean correctas y cuando este en estado (1) tiene acceso al

aplicativo. Para ello se debe certificar desde el menú de inicio de sesión para dar paso a

un formulario HTML que pide el número de identificación y validarlo mediante el botón.

 Imagen 6. Validación de usuarios. (30 de abril de 2019). "Elaboración propia"

En caso de estar registrado en la base de datos aparecerá el siguiente mensaje:

Imagen 7. Usuario activo. (30 de abril de 2019). "Elaboración propia"

En caso de no estar registrado en la base de datos aparecerá el siguiente mensaje:

Imagen 7. Usuario inactivo. (30 de abril de 2019). "Elaboración propia"

 Dentro del menú de administrador, se hizo un formulario con un script en PHP que

permite crear la base de datos del aplicativo en MYSQL, la base de datos se llama:

bdunad26, correspondiente al número del grupo de trabajo colaborativo.

 Imagen 8. Menú Administrador. (30 de abril de 2019). "Elaboración propia"

 Después de hacer clic sobre el menú Administrador tenemos las diferentes opciones, en

este caso primero tenemos la creación de la BD

Imagen 9. Crear BD. (30 de abril de 2019). "Elaboración propia"

 Efectivamente se verifica la creación de la base de datos en motor phpMyAdmin

Imagen 10. Crear BD. (30 de abril de 2019). "Elaboración propia"

 También se hizo dentro del menú de Administrador, el script en PHP que permite crear

una tabla en la base de datos con el nombre de tabla26.

Imagen 11. Crear tabla. (30 de abril de 2019). "Elaboración propia"

 Efectivamente se verifica la creación de la tabla en motor phpMyAdmin

Imagen 12. Crear tabla. (30 de abril de 2019). "Elaboración propia"

 Dentro de las opciones se puede crear una tabla llamada usuarios, con los siguientes

registros: nombre_usuario, contraseña_usuario, estado_usuario. Esta permite ingresar al

aplicativo.
 Imagen 13. Crear tabla usuarios. (30 de abril de 2019). "Elaboración propia"

 Se verifica la creación de la tabla en motor phpMyAdmin con los campos antes

mencionados.

Imagen 14. Campos tabla usuarios. (30 de abril de 2019). "Elaboración propia"

 Dentro del menú de administrador está otra opción para generar el backup de la base de

datos mediante el aplicativo Mysqldump incluido en la suite de Appserv.

 Imagen 15. Backup de la BD. (30 de abril de 2019). "Elaboración propia"

 La siguiente imagen nos deja ver las copias de seguridad luego de utilizar la opción antes

mencionada.

Imagen 16. Archivos backup de la BD. (30 de abril de 2019). "Elaboración propia"

 Dentro del menú de Inventario, está la generación de un informe en PDF de los productos

registrados en la base de datos con cantidades en existencia, mediante el uso de una

librería, puede ser mPDF, FPDF, DomPDF, entre otras.

 Imagen 17. Reporte en PDF. (30 de abril de 2019). "Elaboración propia"

Imagen 18. Reporte en PDF. (30 de abril de 2019). "Elaboración propia"

 Dentro del menú de Inventario está el formulario de ingreso de productos a la tabla de la

base de datos para que el usuario pueda guardar los registros allí, por medio de la

sentencia INSERT de MySQL.

 Imagen 19. Ingreso de productos. (30 de abril de 2019). "Elaboración propia"

 Luego de acceder al menú inventario podemos ver las diferentes opciones y de primero

tenemos el ingreso de los productos con los campos que vemos a continuación.

Imagen 20. Ingreso de productos. (30 de abril de 2019). "Elaboración propia"

 Dentro del menú de Inventario está el formulario de ingreso de productos a la tabla de la

base de datos para que el usuario pueda actualizar la información de ese registro mediante

la sentencia UPDATE de MySQL.

 Imagen 21. Actualizar productos. (30 de abril de 2019). "Elaboración propia"

 Luego de acceder al menú inventario podemos ver las diferentes opciones y de segundo

tenemos la actualización de los productos con los campos que vemos a continuación. En

este caso primero colocamos el código del producto que se ingresó anteriormente y luego

se modifican los demás valores.

Imagen 22. Actualizar productos. (30 de abril de 2019). "Elaboración propia"

 Dentro del menú de Inventario está el formulario de ingreso de productos a la tabla de la

base de datos para que el usuario pueda eliminar ese producto de la base de datos,

mediante la operación DELETE de MySQL.

Imagen 23. Eliminar productos. (30 de abril de 2019). "Elaboración propia"

 Luego de acceder al menú inventario podemos ver las diferentes opciones y de tercero

tenemos la eliminación de los productos con los campos que vemos a continuación. En

este caso primero colocamos el código del producto y luego en el botón Eliminar.

Imagen 24. Eliminar productos. (30 de abril de 2019). "Elaboración propia"

 Dentro del menú de Inventario está el formulario de ingreso de productos a la tabla de la

base de datos para que el usuario pueda mostrar el registro asociado a ese número,

mediante la sentencia SELECT de MySQL.

Imagen 25. Consultar productos. (30 de abril de 2019). "Elaboración propia"

 Luego de acceder al menú inventario podemos ver las diferentes opciones y de último

tenemos la consulta de los productos con los campos que vemos a continuación. En este

caso primero colocamos el código del producto y luego en el botón Consultar.

Imagen 26. Consultar productos. (30 de abril de 2019). "Elaboración propia"

Imagen 27. Consultar productos. (30 de abril de 2019). "Elaboración propia"
 CONCLUSIONES

A través del anterior trabajo se desarrollaron las actividades de la fase 4 del curso de Programación de

sitios web, enriqueciéndonos a través de la creación de una propuesta para un aplicativo web respecto a la

problemática entregada usando los fundamentos teóricos de introducción y planeación de sitios web.

Esto como estudiantes y futuros profesionales nos enseña el manejo y la construcción de aplicaciones

web, fortaleciendo el ágil desarrollo y la implementación de las prácticas arquitectónicas (como el MVC)

como una de las mejores tecnologías de punta para la construcción de software.

 REFERENCIAS BIBLIOGRÁFICAS

Hilarion Novoa, F. (2016). Formularios Html y Php. [Archivo de video]. Recuperado de:

http://hdl.handle.net/10596/9079

Solórzano, P. B. (2006). Planeación y desarrollo de web site. (Páginas. 3 - 6). Recuperado de:

https://bibliotecavirtual.unad.edu.co:2538/lib/unadsp/reader.action?ppg=3&docID=31706

57&tm=1544023208758

Ordoñez, A. Z. (2004). Patrones de diseño. Solo programadores, (Páginas. 46-50).

Hilarion Novoa, F. (2016). Conexión Base de datos php. [Archivo de video]. Recuperado de:

http://hdl.handle.net/10596/9096

Vara, Mesa, Juan Manuel, et al. Desarrollo web en entorno servidor, RA-MA Editorial, 2014.

(Páginas. 125 - 155). ProQuest Ebook Central. Recuperado de:

https://bibliotecavirtual.unad.edu.co:2538/lib/unadsp/reader.action?ppg=126&docID=322

9695&tm=1544024077565

Vara, Mesa, Juan Manuel, et al. Desarrollo web en entorno servidor, RA-MA Editorial, 2014.

(Páginas. 49 - 88). ProQuest Ebook Central. Recuperado de:

https://bibliotecavirtual.unad.edu.co:2538/lib/unadsp/reader.action?ppg=50&docID=3229

695&tm=1544023658116

Río, M. Á. D. (2012). Manual PHP 6.0: formación para el empleo. (Páginas. 187 - 197) Madrid,

ES: Editorial CEP, S.L. Recuperado de:

https://bibliotecavirtual.unad.edu.co:2538/lib/unadsp/reader.action?ppg=188&docID=321

4043&tm=1544023725284