Unidades 3 Paso 4

Programación en PHP en la construcción de proyectos web

Participante:

Luis Felipe Maturana Vergara. Código: 1.087.986.207

Grupo #2

Tutor:

Rafael Pérez Holguín.

UNIVERSIDAD NACIONAL ABIERTA Y A DISTANCIA UNAD

Programación Web 1

Mayo, 2018
 DESARROLLO

Dando respuesta a la problemática planteada por parte de la Universidad Nacional Abierta

y a Distancia UNAD en la cual solicitan la creación de una página web que pueda
sistematizar la información de aspirantes a ingresar a cualquiera de los programas
académicos y el dónde el aspirante a través de un formulario registre:
a. Seleccionar si es un estudiante nuevo o es un estudiante antiguo. Si es nuevo debe
pagar inscripción.
b. Debe seleccionar si es para Pregrado (Tecnología o ingeniería), especialización o
maestría.
c. Seleccionar el descuento sobre el costo de toda la matrícula: si es por certificado
electoral, tendrá descuento del 10%. (URL sobre descuentos por convenios institucionales:
https://estudios.unad.edu.co/tecnologia-en-desarrollo-de-software/costos/descuentos-por-
convenios-institucionales
(recordemos que un estudiante puede tener hasta un 25% de descuentos).
d. Si el estudiante es egresado de algún programa académico de la UNAD, tendrá un
descuento adicional del 30% sobre toda la matricula.
e. Digitar la cantidad de créditos a matricular, la cual debe ser multiplicada por el
costo del crédito actual del 2017.
f. Se debe sacar el costo a pagar de la matrícula de acuerdo a las anteriores
restricciones.
Y por último la UNAD busca que la información registrada en el formulario del paso 3 sea
registrada (Almacenada en una base de datos) y con dichos datos almacenados se pueda:
almacenar, actualizar y borrar registros.

De manera individual se plantea la siguiente solución para el curso de Programación Web I

en el Paso 4:

1. Una página principal llamada index.

2. Una carpeta llamada imágenes.
3. Una carpeta llamada marcos.
4. Una carpeta llamada subpaginas.
La solución tiene un total de 21 archivos HTML, 4 archivos PHP y un archivo sql
(MySQL), distribuidos así:

Archivos HTML: Una página índex ,5 frames o marcos vinculadas a la página índex y 15
subpaginas.

Archivos PHP: Un archivo llamado guardar.php y otro llamado ConexBD.php (ubicados

en la carpeta marcos) y dos llamados formulario.php y el otro cotizar.php (ubicados en la
carpeta una subpágina).

Archivo sql: Un archivo llamado registrounad.sql que es la base de datos de la actividad.

Cronograma de actividades

El desarrollo e implementación de la página web con los requerimientos exigidos fue de

dos semanas; finalizando entrega antes del día 14 de mayo de 2.018.

Peso
Momento
Nombre de la evaluativo
de la e- Actividad académica Tipo de actividad Inicia Finaliza
unidad (en
evaluación
puntajes)
Paso 4: Programación en PHP en la
Unidad 3: construcción de proyectos web
Programación Revisar entregas en la fase individual, con 16/ABR/2018 13/MAY/2018
Intermedio Individual/Colaborativa 120
Web los cuales se selecciona y mejora 00:00 23:55
Avanzada grupalmente el desarrollo la tercera etapa
del proyecto.
Árbol de carpetas.
Contenido de la solución:

1. En la página índex se encuentran alojados los 6 marcos o frames, en su orden:

Dichos frames se encuentran en la carpeta marcos.

 En el frame 1 (encabezado.html). Allí se encuentra el logo Institucional de la

Universidad Nacional Abierta y a Distancia (UNAD) junto con el escudo de
Colombia, seguido del título “PROGRAMAS ACADÉMICOS”. En la parte de
abajo del título se observan los accesos en forma de iconos a las redes sociales de la
Universidad (Twitter, Facebook, YouTube, FlickR e Instagram).
 En el frame 2 (menu.html) se encuentra el listado de programas académicos de la
ECBTI, que son un total de 15 entre maestría, especializaciones, profesionales y
tecnologías.
 En el Marco 3 (contenido.html). Allí se muestra el Formulario de Registro
Aspirantes UNAD en PHP.
 En el frame 4 (Marco2.html). Se encuentra la lista de Opciones para manejo de
información Aspirantes UNAD (Ingresar)
 En el frame 5 (pie_pagina.html) se encuentra la información de contacto de la
universidad en su sede principal.
 El archivo guardar.php que es allí donde quedan registrados los datos ingresados en
el formulario de Aspirantes UNAD.
 El archivo ConexBD.php contiene abreviaciones utilizadas en la base de datos.
 El archivo registrounad.sql es allí donde se encuentra alojado la base de datos de
Mysql.
2. En la carpeta imágenes se encuentran 9 imágenes en formato .png y .jpg que forman
parte del complemento de los demás frames.

3. En la carpeta subpáginas hay un total de 16 subpáginas de cada uno de los

programas académicos de la Escuela de Ciencias Básicas, Tecnología e Ingeniería
(ECBTI) y los archivos php.
 En el frame 6 (formulario.php) se encuentra formulario del programa académico
para averiguar cuál es el costo de la inscripción, dependiendo del número de
créditos que se quieran matricular. –Archivo PHP-
 Y el archivo cotizar.php se muestra el resultado de la anterior consulta en el mismo
frame 6. Este resultado da con formato de pesos ($) y separado por comas (,) los
miles.
Características

 La página web se desarrolló con el editor de texto de Windows; bloc de notas y la

aplicación Adobe Dreamweaver CC 2015
 El contenido en su totalidad fue extraído de la página oficial de la Universidad
Nacional Abierta y a Distancia UNAD.
 Los elementos de la página web se encuentran organizados por carpetas.
 Tanto los colores y las imágenes son los predominantes en la Escuela de Ciencias
Básicas, Tecnología e Ingeniería (ECBTI).
 Se utilizó CSS para brindar un estilo más apropiado a la página web y lograr así que
está no quedara tan plana.
 Se añade formulario en Lenguaje PHP utilizando AppServ Open Project - 2.5.10 for
Windows.
 MySQL Server como administrador de la base de datos.
Funcionamiento

Index
Esta es la página principal de nuestro trabajo, en ella podemos ver todos los marcos, los
cuales están divididos horizontal y verticalmente.
Índice

Horizontal vamos a encontrar el frame 1, (conjunto del frame 2-3-4-6) y el frame 5. En el

parte superior horizontal (frame1) vamos a encontrar imágenes que relaciona la página de
la universidad y las redes sociales de la misma y en la parte inferior horizontal (frame5)
vamos a encontrar el contacto de la universidad y demás datos como contacto, números,
dirección de la sede principal que es en Bogotá. En la parte central horizontal (conjunto de
frames 2-3-4-6) lo explicaremos más adelante.
Frame 1

Frame 5

En la parte central horizontal lo explicaremos de la siguiente manera: Verticalmente

encontraremos los frame 2, 3, 4 y 6. En el marco dos vamos a encontrar la información de
los programas que ofrece la universidad, los cuales tendrán un enlace, el cual si le damos
clic a cada uno de ellos, nos mostrara la información de la carrera en el marco 3.
Frame 2

Frame 4
Vamos a encontrar la opción para diligenciar el formulario de los aspirantes UNAD (Primer
requisito del problema del curso) y se presenta de la siguiente manera:

Frame 3
Contiene el formulario de la información que se necesita guardar, modificar y/o eliminar de
la actividad, dicha información se guardará en el DBMS llamado MySQL. Por tanto, en el
archivo guardar.php se enlaza con el archivo ConexBD.php. En el primer archivo se crea la
conexión con la base de datos y se enlaza los registros que se van a administrar.
Marco 6 (Segundo requisito del problema del curso)

Este marco se creó con el nombre de formulario; el cual nos enlaza a una subpágina
llamada cotizar dentro del mismo frame, esta nos muestra el resultado de los datos
ingresados en el formulario anterior.

En este espacio el cliente (aspirante o estudiante de la UNAD) podrá consultar con facilidad
y sin tener que comunicarse a alguna línea de atención para solicitar información;
simplemente elije el programa en el que está interesado e ingresa la cantidad de créditos de
los cuales desea saber su valor le da clic en consultar y el sistema automáticamente le
arrojará el valor que debe cancelar por concepto de matrícula y créditos.

Criterios del formulario:

 Tipo de Estudiante (Nuevo o Antiguo). Ya que, si es nuevo debe pagar inscripción.

 Seleccione el Programa (Tecnología, Ingeniería, Especialización o Maestría). Para
poder determinar el costo del crédito académico; varía dependiendo del tipo del
Programa.
 Egresado UNAD. Ya que, si el estudiante es egresado de algún programa
académico de la UNAD, tendrá un descuento adicional del 30% sobre toda la
matricula.
 Descuento Electoral. Si selecciona SI tendrá un descuento del 10% en el costo de la
matrícula.
 Convenios 5%, 10%, 15%. Si el estudiante presenta certificado de algún tipo de
convenios; estos tienen un descuento según el convenio (recordemos que un
estudiante puede tener hasta un máximo 25% de descuentos en convenios).
 Créditos. Digitar la cantidad de créditos a matricular, la cual se multiplica por el
costo del crédito actual del 2018.

Ejemplo:
En la imagen anterior se muestra un ejemplo de cuando el aspirante ingrese a la página los
datos requeridos en el formulario; el sistema le muestra como resultado el costo del crédito
académico y la inscripción del tipo de programa que selecciono ya con los descuentos en
formato de pesos ($).

Con este nuevo marco que se ha creado en la página de la UNAD (Universidad Nacional
Abierta y a Distancia) le facilitará al aspirante hacer sus respectivas cotizaciones, evitando
realizar largas llamadas o incluso de desplazarse hasta la sede que le corresponda.
 EXPLICACIÓN DEL DESARROLLO Y FUNCIONAMIENTO
DE LA PAGINA EN ESTA ETAPA DE LA ACTIVIDAD(CODIGO)

Para el desarrollo y funcionamiento de la página se utilizó el lenguaje de etiquetas HTML y

el lenguaje de programación PHP con el cual se ejecutó un programa que realiza las
cotizaciones automáticamente de los diferentes programas que ofrece la UNAD
dependiendo de los créditos a matricular, dicho código se explicara a continuación:

Archivo cotizar.php:

Archivo formulario.php

En este archivo se crea el marco 6, el cual contiene un formulario donde se listan los
criterios (formulario) de costos para calcular; los cuales direccionan a la página de
cotizar.php y envía por el método POST el valor de las variables seleccionadas (criterios);
esto dependiendo del programa seleccionado.

Por otro lado, para la conexión a la base de datos con MySQL Server, se crea en el archivo
guardar.php que incluye el archivo ConexBD.php y posterior a eso realiza la conexión con
la base de datos (archivo llamado registrorunad.sql).
Archivo guardar.php

Archivo ConexBD.php

Script registrounad.sql

-- phpMyAdmin SQL Dump

-- version 2.10.3
-- http://www.phpmyadmin.net
--
-- Servidor: localhost
-- Tiempo de generación: 02-05-2018 a las 17:19:56
-- Versión del servidor: 5.0.51
-- Versión de PHP: 5.2.6
SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO";
--
-- Base de datos: `registrounad`
--
-- --------------------------------------------------------
--
-- Estructura de tabla para la tabla `estudiante`
--
CREATE TABLE `estudiante` (
`Nombre` varchar(50) collate utf8_spanish_ci NOT NULL,
`Apellidos` varchar(50) collate utf8_spanish_ci NOT NULL,
`tipoID` varchar(50) collate utf8_spanish_ci NOT NULL,
`NúmeroDocumento` int(11) NOT NULL,
`fecha` date NOT NULL,
`correo` varchar(50) collate utf8_spanish_ci NOT NULL,
`Edad` int(11) NOT NULL,
`ciudad` varchar(50) collate utf8_spanish_ci NOT NULL,
`programa` varchar(50) collate utf8_spanish_ci NOT NULL,
PRIMARY KEY (`NúmeroDocumento`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8 COLLATE=utf8_spanish_ci;

Registros realizados:
--

-- Volcar la base de datos para la tabla `estudiante`

--

INSERT INTO `estudiante` VALUES ('', '', '', 0, '2018-04-26', '', 0, '', '');
 Bibliografía

Achour, M., Betz, F., & Dovgal, A. (2016). Manual de la Pagina Web Oficial de
PHP. Capítulo 6: Características. Recuperado de:
http://bibliotecavirtual.unad.edu.co:2051/login.aspx?direct=true&db=ir00913a&AN=unad.
10596.5617&lang=es&site=eds-live

Pérez, R. (21,07,2017). El lenguaje de programación PHP. [Archivo de video].

Recuperado de: http://hdl.handle.net/10596/12601

W3Schools, H. (2016). Tutorial de PHP 5. Chapter 5: At W3Schools you will find

complete references of all PHP functions. Recuperado de:
http://bibliotecavirtual.unad.edu.co:2051/login.aspx?direct=true&db=ir00913a&AN=unad.
10596.5589&lang=es&site=eds-live