Modulo1-Presentaciones-parte01.1.ppt
- 1. Secretaría de Extensión Universitaria - UTN Santa Fe. Objetivos • Formar al alumno en los aspectos técnicos necesarios para el diseño y desarrollo de aplicaciones Web empresariales. El alumno adquirirá experiencia en el manejo de los entornos de desarrollo más populares y en la interacción con los servidores Web más utilizados. • Al finalizar el curso el alumno sea capaz de: • diseñar y desarrollar una aplicación Web. Contará con los conocimientos necesarios para trabajar en las capas: presentación, lógica de negocio y persistencia. Además poseerá los fundamentos para un buen diseño de aplicaciones multicapas. • Diferenciar cuando usar patrones. • Manejar los gestores de contenidos mas difundidos hoy en el mercado. • Conocer los recursos actuales de aplicación para el desarrollo de Sitios Web dinámicos. • Utilizar las buenas prácticas de la disciplina informática, incorporando las etapas apropiadas del proceso de desarrollo.
- 2. Secretaría de Extensión Universitaria - UTN Santa Fe. Contenido Proyectos en PHP Comprenderemos para qué sirve versionar el desarrollo de un sistema, más allá de si se trabaja individualmente o en un equipo de desarrolladores. Conoceremos las tendencia de las metodologías ágiles para mejorar un diseño que ya tiene un código haciendo uso del refactoring y el testing. Utilizaremos las potencialidades de php5 como las excepciones. – Excepciones – Versionado de Software – Refactoring de código – Introducción al Testing Seguridad En esta unidad veremos las consideraciones básicas de seguridad que debemos tener en cuenta al momento de la planificación de la aplicación web a desarrollar. – Introducción – Variables globales – Nombres de archivos – Subida de archivos – Bibliotecas – Formularios – Inyección SQL
- 3. Secretaría de Extensión Universitaria - UTN Santa Fe. Contenido Templates Separaremos el XHTML o HTML del código php, es decir, nuestra plantilla no tendrá código php, así que a la hora de diseñar solo nos preocuparemos por eso, de diseñar únicamente. Esto nos permitirá obtener una mejor organización de los archivos – Qué son? – Por qué usarlas? – Funcionamiento – Smarty – Pear AJAX En esta unidad veremos como combinar los lenguajes de servidor PHP y el gestor de base de datos MySQL con el objeto XMLHttpRequest (lo que hace posible AJAX) para llamadas asíncronas. – El objeto XMLHttpRequest – Creación del objeto XMLHttpRequest – Realizar una petición con AJAX – Recibir la petición AJAX – La respuesta AJAX – Tratamiento de la respuesta AJAX – Implementaciones de AJAX – Prototype - Funciones Ajax
- 4. Secretaría de Extensión Universitaria - UTN Santa Fe. Contenido JQUERY Hacer uso de manera tradicional de AJAX a través del objeto JavaScript XMLHttpRequest es muy engorroso a la hora de codificar. La librerías JavaScript actuales han simplificado el trabajo. Haremos uso de la librería jQuery. – Que es JQUERY – Características – Elementos – Métodos – Eventos – Administración de Eventos CMS Veremos la utilidad de los gestores de contenidos y sus diversas aplicaciones. Mostraremos como instalar cada paquete para luego dar comienzo al desarrollo de un portal. Introducción general a: – MadeSimple – Joomla – Jimdo – Moodle – Os commerce
- 5. Secretaría de Extensión Universitaria - UTN Santa Fe. Contenido Fusion Chart Utilizaremos la herramienta FusionCharts animada a través de la serie de archivos Macromedia Flash (swf) que la componen. – Ventajas – Versiones – Tipos de Gráficos PATRONES Los patrones de software significan reuso de diseños apoyados en experiencias de otros. Los patrones de diseño pretenden: * Proporcionar catálogos de elementos reusables en el diseño de sistemas software.* Evitar la reiteración en la búsqueda de soluciones a problemas ya conocidos y solucionados anteriormente. • Veremos los patrones del GOF – Introducción a los patrones de diseño – Singleton – Facade – Factory
- 6. Secretaría de Extensión Universitaria - UTN Santa Fe. Características del Curso • 8 encuentros presenciales • 1 Parcial (1 recuperatorio del parcial) • Practicas semanales de seguimiento • 1 Examen final (1 recuperatorio del ex. final) • Trabajos prácticos
- 7. Secretaría de Extensión Universitaria - UTN Santa Fe. Conceptos previos y repaso Clase 01
- 8. Introducción • El gran uso de Internet la está convirtiendo en el escenario en el cual se desarrollan muchas de las actividades académicas, económicas, de entretenimiento y hasta políticas del hombre moderno. • Ello ha impulsado a su vez el desarrollo constante de nuevas tecnologías que buscan extender su uso mucho más allá de la simple navegación y convertirla en un medio para la prestación de múltiples servicios a través de aplicaciones que pueden llegar a ser tan complejas como las clásicas aplicaciones multinivel, lo cual requiere contar con las herramientas de desarrollo adecuadas, entre las que son imprescindibles las técnicas y herramientas de modelado.
- 9. La Web La Web se puede considerar como una plataforma o “sistema operativo” en el cual los recursos están distribuidos en la red y están siendo extendidos en todo momento con posibilidades ilimitadas. La Web se ha hecho popular con aplicaciones tales como clientes de correo, buscadores, portales, foros, chats, IRCs, RSSs, blogs y demás. Además de estas aplicaciones de propósito general existe adicionalmente una gran diversidad de soluciones que se acomodan al ambiente Web como son: Administradores de Contenido (CMS), Administrador de proyectos, Administración de relaciones con el cliente (CRM), ERP y demás
- 10. Secretaría de Extensión Universitaria - UTN Santa Fe. La Web •La Web se reinventa día a día, lo que ayer parecía imposible hoy es una realidad. •Años atrás (o quizás meses) no nos imaginamos que hubiera muchas opción para realizar una hoja de calculo (Excel) en plataforma Web docs.google.com o que tal un juego animado de construcción de mundos (Age of empires) www.travian.net, un sistema de búsqueda mapas y direcciones (Google maps) maps.google.com. Google es uno de tantos que ha ayudado y sirve de infraestructura para llevar a cabo tales ideas a la realidad.
- 11. Secretaría de Extensión Universitaria - UTN Santa Fe. Sitio Web vs. Aplicación Web Aplicación Web “Sitio Web donde las entradas del usuario (navegación y entrada de datos) afectan al estado de negocio” Jim Conallen “Una Aplicación Web usa un Sitio Web como fachada de una aplicación tradicional”
- 12. Secretaría de Extensión Universitaria - UTN Santa Fe. Aplicaciones Web En la Ingeniería de Software se denomina Aplicación Web a aquellas aplicaciones que los usuarios pueden utilizar accediendo a un servidor web a través de Internet o de una Intranet mediante un navegador. En otras palabras, es una aplicación software que se codifica en un lenguaje (HTML, JavaScript, Java, etc.) soportado por los navegadores Web en la que se confía la ejecución al navegador.
- 13. Secretaría de Extensión Universitaria - UTN Santa Fe. Aplicación Web Las Aplicaciones Web son populares debido a lo práctico del Navegador Web como cliente Web, así como a la facilidad para actualizar y mantener Aplicaciones Web sin distribuir e instalar software a miles de usuarios potenciales. Es importante mencionar que una página Web puede contener elementos que permiten una comunicación activa entre el usuario y la información. Esto permite que el usuario acceda a los datos de modo interactivo, gracias a que la página responderá a cada una de sus acciones. Ejemplo rellenar y enviar formularios, participar en juegos diversos y acceder a gestores de base de datos de todo tipo.
- 14. Secretaría de Extensión Universitaria - UTN Santa Fe. Antecedentes En los primeros tiempos de la informática cliente-servidor, cada aplicación tenía su propio programa cliente que servía como interfaz de usuario que tenía que ser instalado por separado en cada ordenador personal de cada usuario. El cliente realizaba peticiones a otro programa: el servidor que le daba la respuesta. Una mejora en el servidor, como parte de la aplicación, requería normalmente una mejora de los clientes instalados en cada ordenador personal, añadiendo un coste de soporte técnico y disminuyendo la productividad.
- 15. Secretaría de Extensión Universitaria - UTN Santa Fe. Aplicación Web • Por las similitudes con una arquitectura cliente- servidor, con un cliente "no ligero", existen discrepancias sobre el hecho de llamar a estos sistemas “Aplicaciones Web”; un término alternativo es “Aplicación Enriquecida de Internet”.
- 16. Secretaría de Extensión Universitaria - UTN Santa Fe. ¿Por que este concepto ha tomado tanta relevancia? La esencia del concepto es: no dejar que el cliente realice demasiadas tareas, solo lo necesario para que lleve a cabo su trabajo y dejar que en el lado del servidor se realicen las operaciones importantes: • almacenamiento de datos, • transacciones, • reglas del negocio y • la lógica del programa.
- 17. Secretaría de Extensión Universitaria - UTN Santa Fe. Aplicación Web • Una ventaja es que las Aplicaciones Web deberían funcionar igual independientemente de la versión del sistema operativo instalado en el cliente. En vez de crear clientes para Windows, Mac OS X, GNU/Linux, y otros sistemas operativos, la Aplicación Web se escribe una vez y se ejecuta igual en todas partes. Sin embargo, hay aplicaciones inconsistentes escritas con HTML, CSS, DOM y otras especificaciones para navegadores Web que pueden causar problemas en el desarrollo y soporte de las aplicaciones Web. Adicionalmente, la posibilidad de los usuarios de personalizar muchas de las características de la interfaz (tamaño y color de fuentes, tipos de fuentes, inhabilitar Javascript) puede interferir con la consistencia de la aplicación Web.
- 18. Secretaría de Extensión Universitaria - UTN Santa Fe. Aplicación Web • Las Aplicaciones Web generan dinámicamente una serie de páginas en un formato estándar, como HTML o XHTML, que soportan por los navegadores Web comunes. Se utilizan lenguajes interpretados en el lado del cliente, tales como JavaScript, para añadir elementos dinámicos a la interfaz de usuario. Generalmente cada página Web en particular se envía al cliente como un documento estático, pero la secuencia de páginas ofrece al usuario una experiencia interactiva. Durante la sesión, el navegador Web interpreta y muestra en pantalla las páginas, actuando como cliente para cualquier Aplicación Web.
- 19. Secretaría de Extensión Universitaria - UTN Santa Fe. Problemas con las Aplicaciones de Escritorio • Con la división del problema en dos partes, se logra centralizar la administración en general a un solo lado: el servidor, resolviendo una gran cantidad de problemas anteriormente encontrados en las aplicaciones de escritorio mono usuario, como son: • Duplicidad de datos por la falta de unificación de los mismos. • Diseminación de la información y lógica en muchas partes (cada computador que la use). • Falta de portabilidad de la aplicación a diferentes sistemas operativos. • Traumas a la hora de realizar actualizaciones o correcciones al programa ya que las instalaciones están diseminadas. • La administración de la seguridad, controlando el acceso a los usuarios a información no relevante o privada es un caos. • Dificultad para configurar cada una de las instalaciones.(deployments) dependiendo de las necesidades de cada usuario.
- 20. Secretaría de Extensión Universitaria - UTN Santa Fe. Arquitectura Cliente/Servidor • Si analizamos el modelo conceptual de una arquitectura Cliente/Servidor, la comunicación se reduce a una simple interacción conformada por un “request/response”
- 21. Secretaría de Extensión Universitaria - UTN Santa Fe. Estructura de las Aplicaciones Web Normalmente estructurada como una aplicación de tres-capas. En su forma más común: • El Navegador ofrece la primera capa. • Un motor capaz de usar alguna tecnología Web Dinámica (ejemplo: PHP, Java Servlets o ASP, ASP.NET, CGI, ColdFusion, embPerl, Python (programming language) o Ruby on Rails) constituye la capa del medio. • Una base de datos constituye la tercera y última capa. El navegador manda peticiones a la capa del medio que ofrece servicios valiéndose de consultas y actualizaciones a la base de datos y a su vez proporciona una interfaz de usuario.
- 22. Secretaría de Extensión Universitaria - UTN Santa Fe. Estructura de las Aplicaciones Web Presentación (navegador) Lógica (servidor Web) Base de Datos PHP/Perl Capa 1 Capa 2 Capa 3 ODBC/PG/ MySQL/DBI
- 23. Secretaría de Extensión Universitaria - UTN Santa Fe. Estructura de las Aplicaciones Web La separación es necesaria y nos dará muchas ventajas: • Primera y más importante, evitamos hacer dependiente todo un sitio Web (scripts, diseño gráfico y maquetación) de una sola tecnología o aplicación. • El diseñador no tendrá que preocuparse de aspectos de programación o base de datos. • Podemos usar cualquier software para el desarrollo del diseño de la Página Web. Normalmente los diseñadores tienen su herramienta preferida. Puede ser que dicha herramienta no permita trabajar con MySQL, Postgres o PHP, pero esto no debería significar ningún impedimento.
- 24. Secretaría de Extensión Universitaria - UTN Santa Fe. Estructura de las Aplicaciones Web • Al permitir que un diseñador use su herramienta favorita, aumentaremos la productividad. Tampoco se puede pretender que el diseñador tenga que cambiar de software cada vez que se desarrolla una Web sobre tecnologías distintas (hoy puede ser PHP y MySQL, mañana Python o Postgres). • No se le puede exigir a los programadores que aprendan a usar un determinado software de diseño o maquetación, que normalmente están orientados a diseñadores y con una curva de aprendizaje bastante elevada. • Si permitimos que el trabajo de los programadores sea lo más independiente del diseño posible, y además le dejamos que usen sus propias herramientas, aumentaremos la productividad. • Y la última y no menos importante, las herramientas de desarrollo están evolucionando muy rápidamente, lo que es bueno hoy, podría ser muy malo mañana.
- 25. Secretaría de Extensión Universitaria - UTN Santa Fe. Páginas Cliente-Servidor
- 26. Secretaría de Extensión Universitaria - UTN Santa Fe. Interfaz de Usuario • Las Interfaces Web tienen ciertas limitaciones en las funcionalidades que se ofrecen al usuario. • Hay funcionalidades comunes en las aplicaciones de escritorio como dibujar en la pantalla o arrastrar-y-soltar que no están soportadas por las tecnologías Web estándar. Los desarrolladores Web utilizan lenguajes interpretados o script en el lado del cliente para añadir más funcionalidades, especialmente para ofrecer una experiencia interactiva que no requiera recargar la página cada vez (lo que suele resultar molesto a los usuarios). • Recientemente se han desarrollado tecnologías para coordinar estos lenguajes con tecnologías en el lado del servidor, como por ejemplo PHP. • Como ejemplo, AJAX, es una técnica de desarrollo Web que usa una combinación de varias tecnologías
- 27. Secretaría de Extensión Universitaria - UTN Santa Fe. Introducción al funcionamiento de una Aplicación Web • Arquitectura cliente-servidor: múltiples clientes se conectan a un servidor en forma simultanea. El tipo servidor depende de la instalación de la APP, mientras que el cliente suele ser un browser (navegador), en general Google Chrome, Mozilla o Microsoft Explorer. • Como en todo esquema cliente-servidor debe existir un protocolo que especifique de que forma se comunican e intercambian datos el cliente y el servidor, el protocolo utilizado en un Web Site es el HTTP (HiperText Transfer Protocol)
- 28. Secretaría de Extensión Universitaria - UTN Santa Fe. Aplicación en Internet
- 29. Secretaría de Extensión Universitaria - UTN Santa Fe. Fin del Repaso
- 30. Secretaría de Extensión Universitaria - UTN Santa Fe. Proyectos en PHP Clase 01
- 31. Secretaría de Extensión Universitaria - UTN Santa Fe. Excepciones • Las excepciones son el concepto generalizado de los errores: comportamiento anómalo del código • Para realizar un tratamiento de excepciones: – Se encierra en un bloque try el código que pueda provocar una excepción – Y se utiliza un bloque catch para procesarla try{ //código a ejecutar } Catch(Exception $e){ echo $e->getMessage(); }
- 32. Secretaría de Extensión Universitaria - UTN Santa Fe. Excepciones • En PHP las excepciones deben generarse manualmente try{ //código a ejecutar throw new Exception($mesage, $code); } • La palabra clave throw desencadena el mecanismo de control de excepciones.
- 33. Secretaría de Extensión Universitaria - UTN Santa Fe. Excepciones • Por debajo del bloque try necesitamos al menos un bloque catch con el siguiente aspecto: Catch(Exception $e){ //controle la excepción } • Puede haber más de un bloque catch asociado a un bloque try.
- 34. Secretaría de Extensión Universitaria - UTN Santa Fe. Excepciones • Hay situaciones en que la funcionalidad predeterminada proporcionada por la clase de excepción no es suficiente. • la forma más rápida de resolver este problema consiste en ampliar la propia clase, como se hace regularmente con las clases definidas por el usuario, y obtener una o más clases hijas que manejan errores específicos. • Puede haber más de un bloque catch asociado a un bloque try.
- 35. Secretaría de Extensión Universitaria - UTN Santa Fe. Excepciones • PHP 5 permite definir sus propias clases que la heredan de la clase Exception . Puede hacerlo de la siguiente forma: <?php class Excepcion extends Exception{ //codigo interesante } • Lo que hacemos es derivar una clase hija de la clase Exception, de modo que es posible controlar los errores directamente por las partes internas de la clase, en lugar de dentro de la "captura" de bloque. (en este caso, el constructor de la clase Exception no haya sido sustituido).
- 36. Secretaría de Extensión Universitaria - UTN Santa Fe. Excepciones • Desde PHP 5 podemos hacer el uso de excepciones como casi en cualquier lenguaje de programación. • Pero hay que tener en cuenta que aunque las excepciones sean una gran herramienta, también podrían ser peligrosas cuando son usadas indebidamente, por ejemplo nuestra aplicación podría consumir muchos recursos.
- 37. Secretaría de Extensión Universitaria - UTN Santa Fe. Cuando no utilizar excepciones • Veamos un ejemplo del mal uso de excepciones: <?php function foo() { if ($usuario !== "Hola") { throw new Exception("Usuario incorrecto"); } } ?>
- 38. Secretaría de Extensión Universitaria - UTN Santa Fe. Actividad Práctica