Laboratorio #1: Manejo de datos en el servidor e interacción con el cliente mediante una aplicación web

Solución

Laboratorio #1: Manejo de datos en el servidor e interacción con el cliente mediante una aplicación web

Contexto:

Se crea una página web de un inventario de motocicletas para una empresa que maneja dos sedes. Una sede principal y una sede secundaria.

La página permite validar los siguientes datos de una motocicleta:

 Sede del almacén

 Placa de la motocicleta

 Color

 Cilindraje

 Marca

 Modelo

 Tipo de motocicleta

 Fecha de ingreso

La plataforma permite agregar nuevas motocicletas ingresadas, editar o eliminar los datos de los registros.

Se utiliza un MVC para el desarrollo del laboratorio.

Diseño de la base de datos

Se crea una base de datos llamada “almacen-db” y dentro de la base de datos se maneja una tabla llamada “inventario_motocicleta”.

Los datos de acceso de la base de datos son:

 Usuario: root

 Contraseña: jose10

A continuación se muestran los campos creados para la tabla:

Modelo - Vista – Controlador

Estructura de carpetas:

A continuación se muestra como se encuentran distribuidos los ficheros del aplicativo:

Se maneja un fichero index.php encargado de discernir entre las acciones a realizar y los controladores a utilizar durante la navegación.

La carpeta controlador contiene un fichero moto-controlador.php encargado de realizar la construcción de la vista y llamar las funciones definidas en el modelo. Es decir, el fichero moto-controlador.php se encarga de orquestar el funcionamiento entre la vista y el modelo de la aplicación.

La carpeta modelo contiene dos ficheros. El primer fichero denominado db.php contiene una clase encargada de realizar la conexión a la base de datos mencionada en el apartado anterior. El segundo fichero denominado moto.php contiene la clase moto, con todos sus atributos y funciones necesarias para realizar las acciones de crear, listar, actualizar y eliminar datos de la base de datos.

Por ultimo, la carpeta vista, contiene una subcarpeta llamada moto con dos ficheros por dentro que se encargan de generar la visualización de los resultados arrojados por la consulta, ya sea para listar el inventario de motos o para mostrar el formulario para crear un nuevo registro o para editar un registro ya creado.

Dentro de la carpeta vista es importante tener en cuenta que se crearon dos ficheros adicionales, el encabezado y al pie de página (header.php y footer.php). El encabezado hace un llamado el CDN de Boostrap para darle un estilo un poco mas llamativo a la página web.

Funcionamiento y resultados:

Para ingresar a la página web ingresamos por la IP interna debido a que el ejercicio se realizo en una maquina virtual Linux con XAMP instalado.

La IP de acceso es 192.168.0.29 y dentro de la carpeta donde se alojan los archivos de apache de creó la estructura de carpetas y ficheros mencionados en el apartado anterior:

Al existir un archivo index.php al ingresar a la IP desde el navegador directamente se abre la página con la vista programada.

Como se puede observar en la imagen anterior ya existen dos registros guardados en la base de datos. Que se pueden editar o eliminar. También está la opción de crear un nuevo registro.

Para crear un nuevo registro se hace clic sobre el botón Nuevo registro y aparece un formulario donde se diligencian los datos de la motocicleta como se muestra a continuación:

Una vez se hace clic en el botón guardar el registro se ingresa en la base de datos y aparece la página de visualización del listado de motocicletas ingresadas que incluyen el último registro

...