T E C R I O V E R D E
Ingeniería Sistemas Computacionales
Programación Web
Alumnos: Sánchez Vázquez María Jessica Núñez Reynaga Luz Elisa Fong Badillo César Alberto
Trabajo: Reporte - Página Web
7º Semestre, Turno Matutino
Rioverde, S.L.P. a 8 de Octubre de 2010
Contenido INTRODUCCION ........................................................................................................................ 1 TIPO DE ARQUITECTURA ........................................................................................................... 2 LENGUAJE DEL LADO DE SERVIDOR ........................................................................................... 3 LENGUAJE DEL LADO DE CLIENTE .............................................................................................. 4 HERRAMIENTAS DE DESARROLLO A UTILIZAR ............................................................................ 5 Wampserver ......................................................................................................................... 5 Apache.................................................................................................................................. 6 NetBeans .............................................................................................................................. 7 Dreamweaver ....................................................................................................................... 8 GESTOR PARA LA BASE DE DATOS ......................................................................................... 9 MySQL .................................................................................................................................. 9 METODOLOGIA ....................................................................................................................... 10 TIPOS DE USUARIOS ............................................................................................................ 10 ROLES DE USUARIO ............................................................................................................. 10 DISEÑO DE NAVEGACIÓN .................................................................................................... 11 DIAGRAMAS DE CASO Y USO ............................................................................................... 13 DISEÑO DE LA INTERFAZ ...................................................................................................... 14 ESQUEMA DE SEGURIDAD ....................................................................................................... 15 SSL ...................................................................................................................................... 15 CONCLUSIONES....................................................................................................................... 17 CONTACTOS ............................................................................................................................ 18
INTRODUCCION El siguiente trabajo muestra el informe de una página web desarrollada en Windows, la cual trata de una zapatería, donde se pretende mostrar (ó dar publicidad) por medio de este medio informático las diferentes variedades de calzado que existen en dicha zapatería, mostrando así; el tipo, número, color, estilo, material, existencia, entre otras propiedades de cada modelo de zapato, además proporcionar los datos de las diferentes sucursales que existen como lo son: dirección, teléfono, horario de trabajo para facilitarle al cliente o usuario la localización del lugar por si está interesado en algún tipo de calzado y saber si esta en existencia o en que sucursal lo puede encontrar.
1
TIPO DE ARQUITECTURA El tipo de arquitectura que se utilizará en esta página web será la de tres capas porque permite el diseño de arquitecturas escalables donde se pueda modificar conforme las necesidades vayan aumentando, así será más sencillo al momento de dar de alta un zapato, o modificar cualquier otro aspecto.
2
LENGUAJE DEL LADO DE SERVIDOR
El lenguaje que se utilizara será PHP, porque es un lenguaje interpretado de propósito general ampliamente usado, diseñado especialmente para desarrollo web y puede ser incrustado dentro de código HTML lo cual facilita la creación de la pagina, además de que tiene varias ventajas, ya que puede ser desplegado en la mayoría de los servidores web y en casi todos los sistemas operativos y plataformas sin costo alguno. Otra de los aspectos de tomar sobre la decisión de este lenguaje, es que aunque todo en su diseño está orientado a facilitar la creación de página web, es posible crear aplicaciones con una interfaz gráfica para el usuario, utilizando la extensión PHP-Qt o PHP-GTK, lo cual la hace más llamativa y atractiva para el usuario. Además permite la conexión a diferentes tipos de servidores de bases de datos tales como MySQL, lo cual al ser compatible con HTML será de gran ayuda para la creación de esta página.
3
LENGUAJE DEL LADO DE CLIENTE El lenguaje de lado de cliente será HTML, como ya se menciono antes es compatible con el lenguaje del lado de servidor PHP, además de que la forma de utilización de este lenguaje no es complicada y puede ser creado y editado con cualquier editor de textos básico, como puede ser el bloc de notas.
4
HERRAMIENTAS DE DESARROLLO A UTILIZAR Wampserver WAMP es el acrónimo usado para describir un sistema de infraestructura de internet que usa las siguientes herramientas:
Windows, como sistema operativo;
Apache, como servidor web;
MySQL, como gestor de bases de datos;
PHP (generalmente), Perl, o Python, como lenguajes de programación. El uso de un WAMP permite servir páginas html a internet, además de
poder gestionar datos en ellas, al mismo tiempo un WAMP, proporciona lenguajes de programación para desarrollar aplicaciones web.
5
Apache
El servidor HTTP Apache es un servidor web HTTP de código abierto para plataformas Unix (BSD, GNU/Linux, etc.), Microsoft Windows, Macintosh y otras, que implementa el protocolo HTTP/1.1 y la noción de sitio virtual. El servidor Apache se desarrolla dentro del proyecto HTTP Server (httpd) de la Apache Software Foundation. Apache presenta entre otras características altamente configurables, bases de datos de autenticación y negociado de contenido, pero fue criticado por la falta de una interfaz gráfica que ayude en su configuración. Apache es el componente de servidor web en la popular plataforma de aplicaciones LAMP, junto a MySQL y los lenguajes de programación PHP/Perl/Python (y ahora también Ruby).
6
NetBeans
NetBeans es una plataforma que permite que las aplicaciones sean desarrolladas a partir de un conjunto de componentes de software llamados módulos. Un módulo es un archivo Java que contiene clases de java escritas para interactuar con las APIs de NetBeans y un archivo especial (manifest file) que lo identifica como módulo. Las aplicaciones construidas a partir de módulos pueden ser extendidas agregándole nuevos módulos. Debido a que los módulos pueden ser desarrollados independientemente, las aplicaciones basadas en la plataforma, NetBeans puede ser extendido fácilmente por otros desarrolladores de software. La selección de esta plataforma es porque es un proyecto de código abierto de gran éxito con una gran base de usuarios, una comunidad en constante crecimiento, y con cerca de 100 socios en todo el mundo. Además de que permite crear aplicaciones Web con PHP 5, un potente debugger integrado y además viene con soporte para Symfony un gran framework MVC escrito en php. Al tener también soporte para AJAX, cada vez más desarrolladores de aplicaciones LAMP o WAMP, están utilizando NetBeans como IDE.
7
Dreamweaver
La elección principal de este programa es porque es una de las herramientas de diseño de páginas web más avanzadas, además este programa dispone de funciones para acceder al código HTML generado. La aplicación permite crear sitios de forma totalmente gráfica, también la conexión a un servidor, a base de datos, soporte para programación en ASP, PHP, Javascript, cliente FTP integrado, etc. Dreamweaver Cumple perfectamente el objetivo de diseñar páginas con aspecto profesional, y soporta gran cantidad de tecnologías, además muy fáciles de usar:
Hojas de estilo y capas
Javascript para crear efectos e interactividades
Inserción de archivos multimedia...
8
Además es un programa que se puede actualizar con componentes, que fabrica tanto Macromedia como otras compañías, para realizar otras acciones más avanzadas. En resumen, el programa es realmente satisfactorio, incluso el código generado es de buena calidad. La única pega consiste en que al ser tan avanzado, puede resultar un poco difícil su manejo para personas menos experimentadas en el diseño de webs.
GESTOR PARA LA BASE DE DATOS MySQL
La elección de este sistema de BD fue porque ya se tienen conocimientos básicos a cerca del mismo, por cursos anteriores en otras materias como lo fue Base de datos, además de que permite la conexión con el servidor PHP que se utilizará. Por un lado se ofrece bajo la GNU GPL para cualquier uso compatible con esta licencia. Otro de los motivos de la elección es que para realizar la base de datos es que MySQL esta patrocinado por una empresa privada, que posee el copyright de la mayor parte del código. Esto es lo que posibilita el esquema de licenciamiento anteriormente mencionado. Además de la venta de licencias privativas, la compañía ofrece soporte y servicios. Para sus operaciones contratan trabajadores alrededor del mundo que colaboran vía Internet. 9
METODOLOGIA TIPOS DE USUARIOS El usuario administrador. Es la persona a la que va destinada dicho producto de software una vez que ha superado las fases de desarrollo correspondientes. En principio es el propietario del mismo aunque éste puede designar más administradores. El usuario anónimo (Cliente). Aquel que navegara en el sitio web sin autenticarse como usuario registrado. Normalmente, el usuario registrado goza de mayores privilegios que el usuario anónimo; en este caso se utilizara solo usuarios anónimos. ROLES DE USUARIO El usuario administrador. Tiene acceso a todas las operaciones de gestión que se pueden realizar en la página. Trabajará en tareas de configuración de la aplicación, como dar mantenimiento a la base de datos, actualizarla, hacer cambios en la interfaz de la misma, puede publicar y editar los artículos; todo en cuanto a modificaciones se refiera. Principalmente el software se desarrolla pensando en la comodidad del usuario final, y por esto se presta especial interés y esfuerzo en conseguir una interfaz de usuario lo más clara y sencilla posible. El usuario anónimo (Cliente). Estos usuarios podrán navegar en la página Web sin la necesidad de registrarse para acceder a otras partes de la misma, así también no podrá hacer modificaciones, ni editar aspectos de la página.
10
DISEÑO DE NAVEGACIÓN Descripción En la primera vista de la pagina web estará un botón en el cual al dar un click, mandara a otro sitio donde se encontraran las dos sucursales de la zapatería. Sucursal 1 Sucursal 2 Al seleccionar cualquiera de las dos sucursales mandara al siguiente sitio donde se podrán ver los datos donde se encuentra localizado la sucursal, como lo es la dirección y el teléfono, así como el horario de trabajo de la zapatería y los tipos de calzado con los que cuenta. En esa misma interfaz se podrá seleccionar el tipo de calzado que desee ver el usuario, ejemplo: “botas” y mandara a otro sitio donde se encuentran los diferentes tipos de bota que se tienen en existencia, así como las propiedades de cada una (modelo, tipo, textura, color, talla, precio, material, etc). Así el cliente tendrá una idea más clara y se sentirá motivado para visitar la sucursal de su preferencia.
11
Página Principal
ENTRAR SUCURSAL 2
SUCURSAL 1
Dirección:
Dirección:
Teléfono:
Teléfono:
SUCURSAL 1 Tipo de calzado niño
Tipo calzado adultos
SUCURSAL 2
Zapatos
Zapatos
Tennis
Tennis
Botas
Botas
Zapatillas
Guaraches
Guaraches
Zapatos Imagen
Modelo
Talla
Tipo
Color
Material
Textura
Precio
…
…
… 12
…
…
…
…
…
…
…
…
…
…
…
Menú de Inicio
DIAGRAMAS DE CASO Y USO
Operaciones de Gestión Dar mantenimiento a la BD Actualizar la BD
Hacer cambios en la interfaz
Administrador Publicar y editar artículos
Corregir errores
Ingresar a la página web
Consultar información (artículos, mercancía)
Usuario Anónimo (Cliente)
13
DISEÑO DE LA INTERFAZ
como la moda no hay dos
Anúnciate con nosotros
14
ESQUEMA DE SEGURIDAD SSL
SSL es la abreviatura de "Secure Sockets Layer" Una de las decisiones de tomar este esquema de seguridad, es porque es soportado por todos los navegadores comunes de internet que existen. Los datos transmitidos mediante una conexión SSL están protegidos por la encriptación de los datos, un mecanismo que previene y evita que los datos sean vistos por terceras partes o que puedan ser alterados. Además Los navegadores de internet pueden conectarse con los servidores web mediante http y https. Una conexión mediante https implica escribir https:// antes del nombre de dominio o URL y, suponiendo que el servidor web disponga de un certificado SSL, la conexión se realizará de forma segura y encriptada. La misión del protocolo SSL es permitir establecer una conexión segura entre el servidor web y el visitante que accede al web mediante un navegador de internet, encriptando los datos entre ambos de forma que, lo datos que viajan por internet entre el servidor y el visitante (y viceversa) no sean legibles por terceros si fueran interceptados.
15
Para que se pueda utilizar el protocolo SSL en un servidor web, debe obtenerse un "certificado SSL" emitido por una "Entidad Emisora de Certificados" reconocida tanto por el servidor como por el navegador del visitante. El navegador indica que se está bajo una "sesión segura" cambiando la dirección de navegación de http:// a https:// y mostrando generalmente un pequeño candado en la parte inferior del navegador. Los visitantes pueden pinchar sobre el candado para ver el certificado SSL, quien lo emitió, a nombre de quien lo emitió, y hasta cuando es válido.
16
CONCLUSIONES Al término de este documento, que tan solo es un avance teórico, se desea llevar a cabo realmente, con la utilización de las herramientas antes mencionadas. Gracias a la investigación previa para la realización del mismo, se tiene un concepto más claro de lo que se quiere llegar con el desarrollo de la página y las necesidades que el cliente requiere; así como las problemáticas que pudieran presentarse. Los conocimientos obtenidos en la materia de programación web han sido un apoyo eficiente, ya que motiva a seguir aprendiendo a cerca del desarrollo y programación de páginas, no solo en lo que estamos acostumbrados sino, abriendo caminos a nuevas expectativas María Jessica Sánchez Vázquez Ya concluido el reporte y haber recopilado la información necesaria, sobre como hacer una pagina web me dejo los conocimientos necesarios para poderla realizar mas adelante. Mas adelante se planea poderla realizar e implementarla ya al publico para hacer publicidad al negocio y a la vez tener mayor productividad. Se obtuvieron buenos resultados en la elaboración de este reporte para poderlo hacer en un futuro. Luz Elisa Núñez Reynaga. Una vez que se ha llegado al culmen del presente, en donde se esta planificando la elaboración de una pagina web, la cuál será aplicada a una zapatería, en donde en un principio su funcionalidad será la promoción y difusión de los productos. En un principio para poder empezar a realizarla, debemos tener bien definidos los objetivos y metas las cuales nos fijaremos a realizar. César Alberto Fong Badillo
17
CONTACTOS
[email protected] [email protected] [email protected]
18