UNIVERSIDAD TECNOLÓGICA DE BAHÍA DE BANDERAS PORTAFOLIO DE ACTIVIDADES DE APRENDIZAJE

Transcripción

1 UNIVERSIDAD TECNOLÓGICA DE BAHÍA DE BANDERAS PORTAFOLIO DE ACTIVIDADES DE APRENDIZAJE PROGRAMA EDUCATIVO ASIGNATURA DESARROLLO DE APLICACIONES WEB ACADEMIA TECNOLOGÍAS DE LA INCIÓN Y COMUNICACIÓN FECHA DE ELABORACIÓN 15 DE FEBRERO DE 2011 U N I V E R S I D A D T E C N O L Ó G I C A D E B A H Í A D E B A N D E R A S ORGANISMO PÚBLICO DESCENTRALIZADO DEL GOBIERNO DEL ESTADO DE NAYARIT Boulevard Nayarit No. 65 Poniente, Nuevo Vallarta, Nayarit, C.P Tels. (322) ,

2 ÍNDICE 1. INTRODUCCIÓN OBJETIVO DE LA ASIGNATURA COMPETENCIA A LA QUE CONTRIBUYE DESGLOSE DE UNIDADES TEMÁTICAS ACTIVIDADES POR UNIDAD TEMÁTICA RÚBRICAS DE LAS ACTIVIDADES... 5 Actividad 1.1. Entorno de las aplicaciones Web... 5 Actividad 1.2. Metodología de desarrollo y publicación de un Sitio Web... 6 Actividad 1.3. Desarrollo HTML... 7 Actividad 1.4. Listas y formatos... 8 Actividad 1.5. Enlaces y anclas... 9 Actividad 1.6. Tablas... Actividad 2.1. Frames Actividad 2.2. Inputs y forms Actividad 2.3. Examen Actividad 2.4. CSS (Cascade Style Sheet) Actividad 2.5. JavaScript Actividad 2.6. Alert y prompt Actividad 2.7. Calculadora JS Actividad 2.8. Reloj JS Actividad 2.9. Ciclos JS Actividad 2.. Introducción a PHP Actividad Conexiones a bases de datos Actividad Consultas PHP MySQL AUTORES

3 1. INTRODUCCIÓN En esta materia conocerás las bases de la programación orientada a la web, en donde crearás páginas mediante lenguajes de programación orientados a la web. Además de esto, crearás sitios web que realicen consultas y conexiones hacia bases de datos, permitiendo crear aplicaciones web dinámicas. Respecto a las actividades, los tiempos para entrega y criterios de evaluación se harán de acuerdo a la siguiente tabla: Fecha de entrega Evaluación a) Entrega en tiempo y forma Ordinario con base de calificación. b) Entrega a los 3 días hábiles posteriores a la fecha del inciso a) Ordinario con base 9 de calificación. c) Entrega posterior a la indicada en el inciso b). No será tomada en cuenta para la evaluación ordinaria. En caso de que el alumno no obtenga una calificación aprobatoria en la unidad, éste deberá presentar las actividades no acreditadas o el examen correspondiente en las evaluaciones remediales, extraordinarias o de última asignatura en las fechas que el profesor titular establezca. 2. OBJETIVO DE LA ASIGNATURA El alumno desarrollará un sitio y aplicaciones web con acceso a base de datos, para eficientar procesos en una organización. 2

4 3. COMPETENCIA A LA QUE CONTRIBUYE Implementar aplicaciones de software mediante técnicas de programación y considerando los requerimientos de la organización para eficientar sus procesos. UNIDADES TEMÁTICAS 4. DESGLOSE DE UNIDADES TEMÁTICAS HORAS PRÁCTICAS TEÓRICAS TOTALES I. Fundamentos de sitios Web II. Programación de una aplicación Web Totales

5 5. ACTIVIDADES POR UNIDAD TEMÁTICA Unidad Temática 1. Fundamentos de programación orientada a objetos ACTIVIDAD SEMANA DE ENTREGA NOMBRE DE LA ACTIVIDAD VALOR (%) Entorno de las aplicaciones Web (Internet, Intranet y Extranet) Metodología de desarrollo y publicación de un Sitio Web Desarrollo HTML Listas y formatos Enlaces y anclas Tablas 20 TOTAL 0 Unidad Temática 2. Ambiente de desarrollo de la POO ACTIVIDAD SEMANA DE ENTREGA NOMBRE DE LA ACTIVIDAD VALOR (%) Frames Inputs y forms Examen CSS (Cascade Style Sheet) JavaScript Alert y prompt Calculadora JS 2.8 Reloj JS Ciclos JS Introducción a PHP Conexiones a bases de datos Consultas PHP MySQL TOTAL 0 4

6 6. RÚBRICAS DE LAS ACTIVIDADES ACTIVIDAD 1.1. ENTORNO DE LAS APLICACIONES WEB INSTRUCCIONES De manera individual, describir las características de: -Internet, Intranet y Extranet como entornos Web. INDICADOR O VARIABLE Datos generales Redacción. Puntualidad en entrega Aspectos generales Introducción Contenido Bibliografía TO DE ENTREGA Resumen, enviar archivo al correo electrónico. DESCRIPCIÓN PORCENTAJE Asignatura, Unidad temática, Nombre de la actividad, Nombre del alumno(os), matrícula, nombre del profesor, 3 fecha.. Se entrega el trabajo en la fecha estipulada por el profesor. Archivo en formato Word, Márgenes 3 cm, hoja tamaño carta, interlineado 1.5, sangría 1.25 a partir del segundo 2 párrafo, paginado a partir de la 2ª página, portada con los datos generales Incluye un texto a manera de introducción al tema de esta actividad, en el que se describe su importancia y 25 alcance. Incluye información de fuentes confiables y redacta correctamente lo solicitado en el apartado 55 Instrucciones. Inclusión apropiada de citas bibliográficas. Reportar todas las fuentes correctamente en formato 5 APA TOTAL 0 5

7 ACTIVIDAD 1.2. METODOLOGÍA DE DESARROLLO Y PUBLICACIÓN DE UN SITIO WEB INSTRUCCIONES En equipos de 3 integrantes Definir los conceptos de: Tipos de Sitios Web, Requerimientos técnicos y de publicación del sitio (requerimientos de instalación, Modelo Cliente/Servidor, FTP, HTTP, Hospedaje y dominios de sitios Web), Medidas de seguridad en sitios web como (Autentificación y Encriptación), Especificaciones del cliente, Estructura del Sitio Web, Contenido del Sitio Web, Mapa de Sitio Web. Realizar una propuesta de creación de sitio web para una empresa o negocio, en el que se indique la necesidad que se tiene y el porqué crear un sitio web para solventar dicha necesidad. Crear mapa de sitio para dicha propuesta. INDICADOR O VARIABLE TO DE ENTREGA Ensayo, enviar archivo al correo electrónico DESCRIPCIÓN PORCENTAJE Asignatura, Unidad temática, Nombre de la actividad, Datos Nombre del alumno(os), matrícula, nombre del generales profesor, fecha. 3 Redacción. Puntualidad en. Se entrega el trabajo en la fecha estipulada entrega por el profesor. Archivo en formato Word, Márgenes 3 cm, hoja Aspectos tamaño carta, interlineado 1.5, sangría 1.25 a partir generales del segundo párrafo, paginado a partir de la 2ª 2 página, portada con los datos generales Título Proponer un titulo para el proyecto 5 Introducción Debe de establecer un panorama de lo que trata el documento y define el problema que se tiene actualmente en una organización Desarrollo Define la propuesta de creación del sitio web 40 Conclusión Presenta un cierre retomando la problemática o interrogante planteada en la introducción, dándoles respuesta. Define las metas que espera alcanzar con el desarrollo del sitio web. 20 Bibliografía Inclusión apropiada de citas bibliográficas. Reportar todas las fuentes correctamente en formato APA TOTAL

8 ACTIVIDAD 1.3. DESARROLLO HTML OBJETIVO DE LA PRÁCTICA: Desarrollo HTML Fundamentos de sitios Web. Metodología de desarrollo y publicación de un Sitio Web Codificar páginas web básicas con etiquetas de lenguaje HTML TIEMPO DE LA PRÁCTICA: 4 horas FECHA: Desarrollar una página web que muestre información sobre una película a manera de sinapsis. Notepad ++, Computadora con Windows XP o superior Crear una descripción de una película. Resaltar los nombres de los actores con negrita. Colocar una imagen representativa de la película. Enviar el archivo electrónico al correo electrónico indicado por el profesor Título Usa la etiqueta correcta para el titulo 20 sinapsis Usa etiquetas correctas para desarrollar la sinapsis 40 imagen Define la imagen de la película TOTAL 0 7

9 ACTIVIDAD 1.4. LISTAS Y TOS OBJETIVO DE LA PRÁCTICA: Listas y formatos Fundamentos de sitios Web. Metodología de desarrollo y publicación de un Sitio Web Codificar una página web, que muestre listas en diversos formatos. TIEMPO DE LA PRÁCTICA: 4 horas FECHA: Desarrollar una página web que muestre información sobre una película a manera de sinapsis. Notepad ++, Computadora con Windows XP o superior Crear una página web que contenga los siguientes elementos. Lista ordenada con 5 colores, utilizando el color correspondiente en cada elemento. Lista desordenada con 5 elementos de un salón de clases. Lista ordenada en números romanos con 3 enlaces hacia 3 sitios WEB. Lista ordenada con 5 colores, utilizando el color correspondiente en cada elemento siguiendo la numeración de la lista de colores anterior. Enviar el archivo electrónico al correo electrónico indicado por el profesor Listas Usa la etiqueta correcta para las listas. 20 Desarrollo Entrega la página con el código correcto como se describe en el procedimiento. TOTAL 0 8

10 ACTIVIDAD 1.5. ENLACES Y ANCLAS Enlaces y anclas Fundamentos de sitios Web. Metodología de desarrollo y publicación de un Sitio Web OBJETIVO DE LA PRÁCTICA: Codificar una página web, que simule la de Wikipedia TIEMPO DE LA PRÁCTICA: 4 horas FECHA: Desarrollar una página web que simule la wikipedia, hablando sobre un tema libre y que contenga 3 secciones. Notepad ++, Computadora con Windows XP o superior Crear una página web que contenga un menú a manera de índice que contenga 3 secciones. Cada elemento del índice deberá ser parte de una lista ordenada. Desarrollar anclas para cada sección. Incluir información en las 3 secciones sobre algún tema libre. Utilizar un fondo de pantalla adecuado. Aplicar formato de texto justificado. Incluir un enlace de regresar al índice al final de cada sección. Incluir una imagen dentro de cada sección Enviar el archivo electrónico al correo electrónico indicado por el profesor Anclas Usa la etiqueta correcta para crear anclas de cada sección. 20 Desarrollo Entrega la página con el código correcto como se describe en el procedimiento. TOTAL 0 9

11 ACTIVIDAD 1.6. TABLAS Tablas Fundamentos de sitios Web. Metodología de desarrollo y publicación de un Sitio Web OBJETIVO DE LA PRÁCTICA: Codificar una página web, que contenga Tablas TIEMPO DE LA PRÁCTICA: 4 horas FECHA: Desarrollar una página web que contenga tablas para mostrar información de una manera ordenada. Notepad ++, Computadora con Windows XP o superior Crear un menú horizontal con imágenes contenidas dentro de celdas de una tabla sin bordes. Crear una tabla con 5 filas y 3 columnas, en la primer columna colocará imágenes, en la segunda columna, colocará listas de 3 elementos, en la tercer columna colocará enlaces hacia otras páginas. Enviar el archivo electrónico al correo electrónico indicado por el profesor Tablas Usa la etiqueta correcta para crear las tablas solicitadas en el procedimiento 20 Desarrollo Entrega la pagina con el código correcto como se describe en el procedimiento TOTAL 0

12 ACTIVIDAD 2.1. FRAMES Frames Programación de una aplicación Web Fundamentos de programación Web OBJETIVO DE LA PRÁCTICA: Codificar un frameset que contenga menú y página principal TIEMPO DE LA PRÁCTICA: 4 horas FECHA: Desarrollar una página web que contenga un frameset que muestre diferentes páginas web, realizadas con anterioridad Notepad ++, Computadora con Windows XP o superior Crear un frameset de medidas 30, 70. En el frame 30 mostrar un menú En el frame 70 mostrar páginas que sean llamadas desde el frame 30 Enviar el archivo electrónico al correo electrónico indicado por el profesor frames Usa la etiqueta correcta para crear los frames 20 Desarrollo Entrega la pagina con el código correcto como se describe en el procedimiento TOTAL 0 11

13 ACTIVIDAD 2.2. INPUTS Y FORMS OBJETIVO DE LA PRÁCTICA: Inputs y forms Programación de una aplicación Web Fundamentos de programación Web Codificar una página web que contenga los diferentes elementos de la etiqueta input TIEMPO DE LA PRÁCTICA: 4 horas FECHA: Desarrollar una página web que contenga un form que muestre diferentes elementos de la etiqueta input. Notepad ++, computadora con Windows XP o superior Crear un form. Crear un registro que solicite los siguientes datos: nombre, apellidos, fecha de nacimiento, sexo, domicilio, fotografía, usuario password y correo. Colocar un botón de tipo reset, que borre la información capturada. Colocar un botón de tipo submit para guardar datos. Enviar el archivo electrónico al correo electrónico indicado por el profesor inputs Usa la etiqueta correcta para crear los controles de entrada de datos adecuados al tipo de dato 20 solicitado Desarrollo Entrega la pagina con el código correcto como se describe en el procedimiento TOTAL 0 12

14 ACTIVIDAD 2.3. EXAMEN INSTRUCCIONES El alumno resolverá el examen. El examen se compone de reactivos de opción múltiple abarcando etiquetas vistas en las actividades previas del portafolio, así como la elaboración de código para el desarrollo de una página Web. TO DE ENTREGA Examen Escrito INDICADOR O VARIABLE DESCRIPCIÓN PORCENTAJE Resultados Se resuelven los ejercicios de manera correcta 0 TOTAL 0 13

15 ACTIVIDAD 2.4. CSS (CASCADE STYLE SHEET) OBJETIVO DE LA PRÁCTICA: CSS Programación de una aplicación Web Configuración del Entorno Web Codificar una hoja de estilos en cascada que aplique formatos de texto e imagen a un archivo HTML TIEMPO DE LA PRÁCTICA: 4 horas FECHA: Desarrollar una hoja de estilo en cascada que sea llamada por un archivo HTML Notepad ++, Computadora con Windows XP o superior Crear una página web que contenga 3 de texto e imágenes Crear una hoja de estilo en cascada que aplique formato a las etiquetas de estilo de texto, para modificar color y orientación de texto Agregar estilo a las imágenes para ajustar su tamaño a 2 X 2 Px. Enviar los archivos electrónicos al correo electrónico indicado por el profesor CSS Crea un archivo CSS de manera correcta y la manda llamar desde el archivo.html 20 Desarrollo Entrega la pagina con el código correcto como se describe en el procedimiento TOTAL 0 14

16 ACTIVIDAD 2.5. JAVASCRIPT INSTRUCCIONES De manera individual, describir las características, historia requerimientos y uso actual de JavaScript. TO DE ENTREGA Resumen, enviar archivo al correo electrónico indicado por el profesor. INDICADOR O DESCRIPCIÓN PORCENTAJE VARIABLE Datos generales Redacción. Puntualidad en entrega Aspectos generales Introducción Contenido Bibliografía Asignatura, Unidad temática, Nombre de la actividad, Nombre del alumno(os), matrícula, nombre del profesor, fecha.. Se entrega el trabajo en la fecha estipulada por el profesor. Archivo en formato Word, Márgenes 3 cm, hoja tamaño carta, interlineado 1.5, sangría 1.25 a partir del segundo párrafo, paginado a partir de la 2ª página, portada con los datos generales Incluye un texto a manera de introducción al tema de esta actividad, en el que se describe su importancia y alcance. Incluye información de fuentes confiables y redacta correctamente lo solicitado en el apartado Instrucciones. Inclusión apropiada de citas bibliográficas. Reportar todas las fuentes correctamente en formato APA TOTAL

17 ACTIVIDAD 2.6. ALERT Y PROMPT OBJETIVO DE LA PRÁCTICA: Alert y prompt Programación de una aplicación Web Configuración del Entorno Web Codificar una página web que muestre distintos alerts y prompts para mostrar y solicitar datos al usuario TIEMPO DE LA PRÁCTICA: 4 horas FECHA: Codificar una página web que muestre distintos alerts y prompts para mostrar y solicitar datos al usuario, como su nombre, apellidos, correo, edad, domicilio Notepad ++, computadora con Windows XP o superior Crear una página web que muestre un alert de bienvenida al usuario. Crear una serie de prompts para solicitar los datos descritos en la descripción de la práctica. Mostrar los datos en pantalla al usuario, haciendo una validación de la edad, si esta es menor a 18 poner edad en color rojo, si edad >= 18 poner en azul. Enviar los archivos electrónicos al correo electrónico indicado por el profesor Alerts y prompts Crea los objetos de JavaScript correspondientes para solicitar y mostrar la información requerida 20 Desarrollo Entrega la página con el código correcto como se describe en el procedimiento. TOTAL 0 16

18 ACTIVIDAD 2.7. CALCULADORA JS OBJETIVO DE LA PRÁCTICA: Calculadora JS Programación de una aplicación Web Configuración del Entorno Web Codificar una página web que muestre una calculadora con las funciones de suma, resta multiplicación y división TIEMPO DE LA PRÁCTICA: 3 horas FECHA: Usando JavaScript, desarrollar una calculadora en una página web Notepad ++, Computadora con Windows XP o superior Crear botones para cada número, función, punto decimal y borrar. Crear inputs de tipo text para mostrar resultado. Desarrollar las funciones de JavaScript necesarias para ejecutar las operaciones matemáticas. Enviar el archivo electrónico al correo electrónico indicado por el profesor Funciones Crea las funciones necesarias para la ejecución correcta de la calculadora Desarrollo Entrega la página con el código correcto como se describe en el procedimiento 20 TOTAL 0 17

19 ACTIVIDAD 2.8. RELOJ JS Reloj JS Programación de una aplicación Web Configuración del Entorno Web OBJETIVO DE LA PRÁCTICA: Codificar un cronometro y un reloj en JavaScript TIEMPO DE LA PRÁCTICA: 3 horas FECHA: Usando JavaScript, desarrollar un cronometro y un reloj en JavaScript Notepad ++, Computadora con Windows XP o superior Crear botones para iniciar, detener y reiniciar el cronómetro. Crear 2 inputs de tipo text, uno para mostrar cronómetro y otro para mostrar el reloj. Desarrollar las funciones de JavaScript necesarias para ejecutar el reloj y el cronómetro. Enviar el archivo electrónico al correo electrónico indicado por el profesor Funciones Crea las funciones necesarias para la ejecución correcta del reloj y del cronometro Desarrollo Entrega la página con el código correcto como se describe en el procedimiento 20 TOTAL 0 18

20 ACTIVIDAD 2.9. CICLOS JS Ciclos JS Programación de una aplicación Web Configuración del Entorno Web OBJETIVO DE LA PRÁCTICA: Codificar una página web con ciclos TIEMPO DE LA PRÁCTICA: 4 horas FECHA: Usando JavaScript, mostrar en una página web, las tablas del 1 al Notepad ++, Computadora con Windows XP o superior Crear las funciones necesarias para mostrar cada una de las tablas Crear una tabla de X donde se muestre el resultado de cada multiplicación utilizando un ciclo. Enviar el archivo electrónico al correo electrónico indicado por el profesor Ciclos Crea las funciones necesarias para la ejecución correcta de las tablas de multiplicar Desarrollo Entrega la página con el código correcto como se describe en el procedimiento 20 TOTAL 0 19

21 ACTIVIDAD 2.. INTRODUCCIÓN A PHP INSTRUCCIONES De manera individual, describir las características, historia requerimientos y uso actual de PHP. TO DE ENTREGA Resumen, enviar archivo al correo electrónico indicado por el profesor. INDICADOR O DESCRIPCIÓN PORCENTAJE VARIABLE Datos generales Redacción. Puntualidad en entrega Aspectos generales Introducción Contenido Bibliografía Asignatura, Unidad temática, Nombre de la actividad, Nombre del alumno(os), matrícula, nombre del profesor, fecha.. Se entrega el trabajo en la fecha estipulada por el profesor. Archivo en formato Word, Márgenes 3 cm, hoja tamaño carta, interlineado 1.5, sangría 1.25 a partir del segundo párrafo, paginado a partir de la 2ª página, portada con los datos generales Incluye un texto a manera de introducción al tema de esta actividad, en el que se describe su importancia y alcance. Incluye información de fuentes confiables y redacta correctamente lo solicitado en el apartado Instrucciones. Inclusión apropiada de citas bibliográficas. Reportar todas las fuentes correctamente en formato APA TOTAL

22 ACTIVIDAD CONEXIONES A BASES DE DATOS Conexiones a bases de datos Programación de una aplicación Web Métodos de conexión de forma abierta OBJETIVO DE LA PRÁCTICA: Crear conexiones a bases de datos desde PHP TIEMPO DE LA PRÁCTICA: 4 horas FECHA: Usando PHP crear una conexión a un SGBD Notepad ++, PHP 5 o superior, SGBD Mysql 5 o superior, Apache web server 2.2 o superior (en su defecto puede utilizar XAMPP o WAMP), Computadora con Windows XP o superior o GNU/Linux kernel >=2.6 Desarrollar el código necesario para crear una conexión a una base de datos desde PHP Desarrollar el script de SQL donde cree una tabla para dar de alta productos, donde los campos son: nombre del producto, cantidad, costo, precio, código de barras imagen. Desarrollar un formulario de captura de los campos correspondientes. Enviar los archivos electrónicos al correo electrónico indicado por el profesor Archivos PHP SQL Crea los archivos necesarios para realizar una conexión a una base de datos Desarrollo Entrega la página con el código correcto como se describe en el procedimiento 20 TOTAL 0 21

23 ACTIVIDAD CONSULTAS PHP MYSQL Conexiones a bases de datos Programación de una aplicación Web Métodos de conexión a datos usando directamente los drivers del proveedor. OBJETIVO DE LA PRÁCTICA: Crear consultas a bases de datos desde PHP TIEMPO DE LA PRÁCTICA: 4 horas FECHA: Usando PHP, ejecutará consultas de altas, bajas modificación y eliminación de registros de una base de datos Notepad ++, PHP 5 o superior, SGBD Mysql 5 o superior, Apache web server 2.2 o superior (en su defecto puede utilizar XAMPP o WAMP), Computadora con Windows XP o superior o GNU/Linux kernel >=2.6 Desarrollar un formulario de captura de productos según lo establecido en la actividad Desarrollar un formulario de modificación de productos. Desarrollar un formulario de baja de productos. Desarrollar un catálogo de productos Enviar los archivos electrónicos al correo electrónico indicado por el profesor Archivos PHP SQL Crea los archivos necesarios para realizar las consultas correspondientes Desarrollo Entrega la página con el código correcto como se describe en el procedimiento 20 TOTAL 0 22

24 7. AUTORES Ing. Héctor Gerardo Núñez Ing. Mónica Piñón López Ing. Luis Antonio Reynoso Salcedo MCE José César Ávila Hernández REVISÓ VALIDÓ AUTORIZÓ MCE JOSÉ CÉSAR ÁVILA HERNÁNDEZ PRESIDENTE DE ACADEMIA DE TECNOLOGÍAS DE LA INCIÓN Y COMUNICACIÓN ING. LUIS OCTAVIO GALLARDO ARCEGA DIRECTOR DE DIVISIÓN INGENIERÍAS ING. JUAN GABRIEL ÁVALOS LEMUS SECRETARIO ACADÉMICO FECHA: 23 Marzo 2011 FECHA: 04-Abril-2011 FECHA: 09 Mayo