Programacin Web

Investigacin de unidad 1
(Trabajo)
Ingeniera En Sistemas Computacionales
Octavo Semestre-Grupo B
-ING. Rusell Renan Iuit Manzanero
(Docente)

Cesar Daniel Eugenio Prez

Leonardo Rodrigo Maldonado Lpez
Jairo Israel Medina Cervera
Carlos Israel Soberanis Cupul
(Nombre De los Alumnos)
Fecha de Entrega:
Jueves 26 de Febrero del 2015
1.1 EVOLUCIN DE LAS APLICACIONES.
La evolucin de la tecnologa informtica y las telecomunicaciones ha
otorgado a la red Internet y al World Wide Web un papel predominante en el
mundo tecnolgico y econmico.

Las aplicaciones en Internet han modificado la forma cotidiana de obtener

informacin, realizar negocios e intercambios comerciales, recibir instruccin y
comunicarse. La red Internet es un importante medio para organizaciones e
individuos, quienes interactan empleando aplicaciones desarrolladas con
tecnologa Internet las cuales se han vuelto muy populares ya que poseen
ventajas significativas sobre las aplicaciones tradicionales en una variedad de
escenarios.
Debido a este auge, en el mercado han proliferado las tecnologas y
herramientas para el desarrollo de aplicaciones en Internet.
Tecnologas para desarrollo de aplicaciones con Tecnologa Internet Clases,
exposiciones y laboratorios de diversas tecnologas del lado del cliente y del
servidor para el desarrollo de aplicaciones con tecnologa Internet.
Tecnologas a considerar:
JavaScript
Cascading Style Sheets [CCS]
Document Object Model [DOM]
Servidores Web [HTTP-D]
Servidores de Aplicaciones
Java Servlets
Java Server Pages [JSP]
Java Database Connectivity [JDBC]
.NET
Preprocessed Hypertext Pages [PHP]
Extensible Markup Language [XML]
Extensible Style Sheets [XSL]
Extensible Server Pages [XSP]
Servicios Web e intercambio de informacin (SOAP, XML, UDDI, WSDL).
MySQL, Oracle, Microsoft SQL Server
ActionScript.
Evolucin
En sus orgenes, la Web era utilizada por los navegantes para obtener
informacin. La unidad de trabajo era la pgina Web y, de esta forma, los
usuarios navegaban entre mltiples pginas a travs de hipervnculos. En esta
conceptualizacin, el elemento central es el servidor Web con su informacin.
Generalmente, estos sitios consistan en sitios corporativos, sitios de noticias,
sitios de informacin especfica.

El siguiente paso en esta evolucin consisti en utilizar la red como

comunidades, en las que los propios navegantes (o usuarios de la Web)
pudieran interaccionar, ya sea entre ellos o con otros sitios que ofrecan
servicios. Durante esta fase aparecieron servicios tales como foros de
discusin, servicios de e-banking, servicios de mensajera, compras
electrnicas basadas en comunidades, etc.
El paso actual, es la visin de la Web como una plataforma, es decir, como el
medio para la distribucin de servicios y para la construccin de informacin,
su seleccin, etc. Tambin, detrs de esta nueva visin, surgen nuevos
modelos de negocio basados en la web como plataforma. Si bien no existe
una forma nica en que las aplicaciones de la Web 2.0 deben desarrollarse,
existen algunas herramientas y tecnologas que permiten su desarrollo:
Transformar las aplicaciones de escritorio en aplicaciones basadas en la Web.
En este sentido, el software como servicio es uno de los modelos de negocio
que apoya esta transformacin.
Estandarizar las interfaces, utilizando XHTML, XML u otros estndares.
Separacin del contenido de la presentacin.
Utilizar sindicacin de contenidos. Sindicacin web es una forma de
subscripcin en la cual parte del material de un sitio web se hace disponible en
otros sitios web o de un lector especial.
Incorporar la tcnica AJAX en las aplicaciones, de forma tal de poder trabajar
con unidades de navegacin ms granulares y especficas, en lugar de
navegar a travs de pginas HTML.

1.2 ARQUITECTURA DE LAS APLICACIONES WEB

La arquitectura tradicional de cliente/servidor tamin es conocida como
arquitectura de dos capas. Requiere una interfaz de usuario que se instala y se
ejecuta en una PC o estacin de trabajo y enva solicitudes a un servidor para
ejecutar operaciones complejas.
Por ejemplo, una estacin de trabajo utilizada como cliente puede ejecutar una
aplicacin de interfaz de usuario que interroga a un servidor central de ases de
datos.

Ventajas del Sistema de Dos Capas:

El desarrollo de aplicaciones en un ambiente de dos capas funciona
adecuadamente, pero no es necesariamente lo ms eficiente. Las
herramientas para el desarrollo con dos capas son robustas y ampliamente
evaluadas.
Las tcnicas de ingeniera de software de prototipo se emplean fcilmente. Las
soluciones de dos capas trabajan bien en ambientes no dinmicos estales,
pero no se ejecutan bien en organizaciones rpidamente cambiantes.
Desventajas del sistema de dos capas:
Los ambientes de dos capas requieren control excesivo de las versiones y
demandan esfuerzo de distribucin de la aplicacin cuando se les hacen
cambios. Esto se desee al hecho de que la mayora de la aplicacin lgica
existe en la estacin de trabajo del cliente.
La seguridad del sistema en un diseo de dos capas es compleja y a menudo
requiere administracin de las bases de datos; esto es debido al nmero de
dispositivos con acceso directo al ambiente de esas bases de datos.
Las herramientas del cliente y de la base de datos, utilizadas en diseos de
dos capas, constantemente estn cambiando. La dependencia a largo plazo
de cualquier herramienta, puede complicar el escalamiento futuro o las
implementaciones.

Arquitectura de tres capas

La arquitectura de tres capas es un diseo reciente que introduce una capa
intermedia en el proceso. Cada capa es un proceso separado y bien definido
corriendo en plataformas separadas. En la arquitectura tradicional de tres
capas se instala una interfaz de usuario en la computadora del usuario final (el
cliente). La arquitectura asada en Web transforma la interfaz de bsqueda
existente (el explorador de Web), en la interfaz del usuario final.
La arquitectura de las aplicaciones Web suelen presentar un esquema de tres
niveles

El primer nivel consiste en la capa de presentacin que incluye no slo el

navegador, sino tambin el servidor web que es el responsable de presentar
los datos un formato adecuado.
El segundo nivel est referido habitualmente a algn tipo de programa o script.
Finalmente, el tercer nivel proporciona al segundo los datos necesarios para
su ejecucin. Una aplicacin Web tpica recoger datos del usuario (primer
nivel), los enviar al servidor, que ejecutar un programa (segundo y tercer
nivel) y cuyo resultado ser formateado y presentado al usuario en el
navegador (primer nivel otra vez).
Las diferentes capas suelen ser:
Capa 1: Cliente de aplicacin: Navegador Web
Capa 2: Servidor de Aplicaciones: Apache, Servidor Tomcat con servlets
Capa 3: Servidor de Datos: base de datos, servidor SMTP
Ventajas de la arquitectura de tres capas:
Las llamadas de la interfaz del usuario en la estacin de trabajo, al servidor de
capa intermedia, son ms flexibles que en el diseo de dos capas, ya que la
estacin solo necesita transferir parmetros a la capa intermedia.
Con la arquitectura de tres capas, la interfaz del cliente no es requerida para
comprender o comunicarse con el receptor de los datos. Por lo tanto, esa
estructura de los datos puede ser modificada sin cambiar la interfaz del usuario
en la PC.

El cdigo de la capa intermedia puede ser reutilizado por mltiples

aplicaciones si est diseado en formato modular.
La separacin de roles en tres capas, hace ms fcil reemplazar o modificar
una capa sin afectar a los mdulos restantes.
Desventajas de las Arquitecturas de Tres Capas y azadas en Web
Los ambientes de tres capas pueden incrementar el trfico en la red y requiere
ms balance de carga u tolerancia a las fallas.
Los exploradores actuales no son todos iguales.

La estandarizacin entre diferentes proveedores ha sido lenta en

desarrollarse. Muchas organizaciones son forzadas a escoger uno en lugar de
otro, mientras que cada uno ofrece sus propias y distintas ventajas.

1.3 TECNOLOGAS PARA EL DESARROLLO DE APLICACIONES WEB.

Las fases de un desarrollo web, as como los lenguajes de programacin

usados, son muy extensos y variados, y por ello necesitamos herramientas
especficas para cada una de ellas. Conoceremos a continuacin las
principales herramientas existentes para poder desarrollar fcilmente un
proyecto web.
En el desarrollo web tenemos unas herramientas para el diseo, otras para la
maquetacin, otras para la programacin, y para la depuracin. Todas las
herramientas que usemos son muy importantes, desde el Sistema Operativo
hasta el comando ms insignificante, y por ello debemos elegir la ms
adecuada a nuestras necesidades y capacidades.

Para desarrollar una web, lo primero que necesitamos es un Sistema

Operativo, como es lgico, y su eleccin no es tan trivial. Hay que tener en
cuenta las aplicaciones de las que dispone el Sistema Operativo y sus costes.
Por ejemplo, tenemos Microsoft Windows, cuyas aplicaciones son muy caras,
como Photoshop, Dreamweaver, Fireworks, ASP .NET Y por otro lado
tenemos GNU/Linux, con GIMP, Inkscape, Amaya, Aptana, PHP (aunque todos
ellos tambin estn disponibles en Windows).
Otra caracterstica a tener en cuenta es las facilidades que el Sistema
Operativo aporta al desarrollador, y en este sentido GNU/Linux se lleva de
calle a Windows. Y esto es porque Windows no fue diseado para los
desarrolladores, sino para personas que no tienen muchos conocimientos
sobre informtica.
Y por el contrario GNU/Linux fue creado por desarrolladores, y para
desarrolladores; y por lo tanto en GNU/Linux podemos encontrar infinidad de
herramientas que nos harn la vida mucho ms fcil, que adems son libres.

Fases de desarrollo de una web

Para elegir las herramientas a utilizar, antes debemos identificar las fases del
proceso que forman el ciclo de vida de un desarrollo web.
Diseo:
El diseo consiste en crear esbozos de la web final mediante una herramienta
grfica, como Photoshop, GIMP o Inkscape.

Maquetacin HTML/CSS:
La maquetacin consiste en convertir los esbozos creados en la fase anterior
en plantillas HTML, su respectiva hoja de estilos, y las imgenes usadas. Es
posible saltarse la fase anterior para comenzar directamente con esta fase,
dependiendo de si dominamos herramientas como Photoshop o no.
Programacin cliente:
La programacin cliente consiste bsicamente en Javascript. Una web puede
no tener necesidad de hacer programacin cliente, como puede ser una
pequea web corporativa con poca informacin esttica, o puede que requiera
enormes esfuerzos en esta fase, como ocurre con los proyectos Web 2.0.

Programacin servidor:
En esta fase, que se desarrolla junto con la anterior, crearemos la aplicacin
web en un lenguaje de servidor, como puede ser PHP, ASP .NET, Python, Perl,
etc.
Depuracin:
Esta fase enlaza la anterior con la siguiente, y es donde haremos las pruebas
unitarias, aserciones, trazas, etc.
Pruebas en local:
En nuestro servidor local haremos todas las pruebas posibles.
Subir ficheros al hosting:
Una vez nuestra web est completada y bien testeada en nuestro servidor
local (desarrollo), la subiremos al servidor del hosting elegido (produccin).
Dependiendo del hosting, podremos usar FTP, SFTP (SSH), WebDAV, o
incluso Subversin.
Pruebas en hosting:
Realizaremos las ltimas pruebas en el servidor del hosting para comprobar
que el cambio de servidor no ha afectado a nada. Para evitar problemas,
nuestro servidor local debe tener exactamente la misma configuracin que el
servidor del hosting.
Herramientas: desarrollo en PHP
A continuacin se enumeran las herramientas bsicas para el desarrollo de
una web en PHP, en sus diferentes fases de diseo e implementacin.
Fases: diseo y maquetacin

Adobe PhotoShop
GIMP:
Inkscape
Adobe Fireworks
Dreamweaver, Aptana, Amaya:

Fase: maquetacin
Fases: maquetacin, programacin cliente

Fase: programacin servidor

Otra aplicacin muy til que est muy ligada a Zend Studio es Zend Platform,
un mdulo para Apache que permite depurar una web directamente en el
navegador (Internet Explorer o Firefox), adems de otras funciones ms
complejas, como alertas configurables para que nos enve un email por cada
error ocurrido en la web, o cuando un script sobrepase un tiempo determinado
de ejecucin, por ejemplo.
Fase: prueba local

Apache

Firefox / Firebug / Web Developer Extension

Fases: pruebas en local, depuracin
Con Firebug podremos depurar Javascript, editar HTML y CSS en la misma
pgina para ver los cambios en tiempo real, consultar los tiempos de carga de
la pgina en conjunto, de las imgenes, javascripts, hojas de estilo, etc, as
como sus tamaos, etc. Y Web Developer nos ofrece herramientas muy tiles
como ver las cookies de la web, ocultar imgenes, cambiar el tamao del
navegador a resoluciones estndar, etc.

1.4 PLANIFICACIN DE APLICACIONES WEB

A menudo antes de empezar un proyecto no tenemos claro cul es el objetivo

del mismo o qu pretendemos alcanzar por eso esta pequea lista te puede
ayudar a la hora de planificar un proyecto.
Planificar una aplicacin web implica pensar y definir muchas cuestiones de
importancia:
1. Planificar el futuro
Puede sonar un poco duro que nos tengamos planear el futuro de algo que
an no existe pero es as, que pasa si en un futuro tuviramos problemas de
escalabilidad, y s tuviramos que migrar las bases de datos de MySql a
Oracle, de una buena planificacin depende la dificultad en un futuro de
realizar cambios en la plataforma que sostiene nuestra aplicacin.

2. Documentacin
Documenta todo lo que puedas tu aplicacin en especial aquellas partes de la
misma que hayan requerido un mayor tiempo de desarrollo, en un futuro
cercano te librar de ms de un quebradero de cabeza.
3. No empieces por los pequeos detalles
A menudo es ms sencillo plantearse el desarrollo de pequeos servicios
cmo pueden ser los RSS o una galera de imgenes, pero es fundamental
comenzar por lo que vendr a ser la base de nuestra aplicacin, de este modo
podremos ir completando nuestra aplicacin en un orden lgico, primero los
cimientos
4. Diseo de la interfaz
Esta entrada puede que te ayude en esta parte, es importante conseguir un
buen diseo para nuestra interfaz, es importante conseguir un interfaz que se
atractivo y til para la gran mayora de los usuarios, lo ms importante es
llegar a conectar con el usuario y la mejor manera es ofrecerle la mayor
cantidad de informacin posible para que se llegue a sentir parte del proyecto
pero todo esto muchas veces no lo llegamos a conseguir por una mala
eleccin en la combinacin de los colores que se integran en nuestra interfaz.

5. Evita construirte libreras o frameworks innecesarios

Muchas personas siempre sostienen que es mejor que cada desarrollador
utilice sus propias libreras, pero la realidad es que en muchas ocasiones esto
supone una gran prdida de tiempo, es mejor buscar una librera o framework
que se parezca lo ms posible a lo deseado que desarrollarlo por ti mismo.
6. Ten un plan de proyecto
Asegrate de que cada desarrollador que trabaje en el proyecto sepa qu es lo
que debe de hacer y cundo tiene que hacerlo, teniendo todo esto redactado
en un documento te ayudar a identificar problemas.
7. Elige el lenguaje adecuado
Ya sabes que hay numerosas discusiones sobre Cul es el mejor lenguaje
de programacin?, la respuesta a menudo es depende de para que quieras
utilizarlo, por eso asegrate de escoger el lenguaje adecuado.

8. Evita las distracciones

Optimiza tu tiempo, cuando ests trabajando que nada te distraiga, ni llamadas
telefnicas, ni clientes de mensajeras instantneas, proponte un buen nmero
de horas al da de trabajo aislado dedicado al proyecto.
9. Sigue un buen control de calidad
Muchas veces nos equivocamos al planificar los tiempos de proyecto y esto
lleva a menudo a los desarrolladores a tener que escribir cdigo sucio, esta
es una buena opcin si lo que quieres es una demo de la aplicacin
funcionando pero esa actitud te traer problemas en el futuro.
10. Plantate los pasos a seguir despus del desarrollo
Ten en cuenta que est fase de desarrollo algn da deber acabar, estudia
con qu frecuencia se deber actualizar y que se necesita para que este
funcione.