Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Tecnologías Web

3,176 views

Published on

Introducción a las tecnologías web más utilizadas

Published in: Technology

Tecnologías Web

  1. 2. Árbol de tecnologías web
  2. 3. Árbol de tecnologías web <ul><li>Azul: paquetes de software </li></ul><ul><li>Beige: lenguajes de programación </li></ul><ul><li>Verde: corazón de las tecnologías web </li></ul><ul><li>Gris: infraestructura relacionada </li></ul><ul><li>http://modernl.com/article/web-tech-family-tree </li></ul>
  3. 4. Páginas estáticas vs Páginas dinámicas <ul><li>Página web estática : </li></ul><ul><ul><li>Contenido que no cambia frecuentemente </li></ul></ul><ul><ul><li>Información en archivos HTML (y otras tecnologías como Flash) </li></ul></ul><ul><ul><li>Se actualiza manualmente </li></ul></ul><ul><ul><li>Se utiliza algún tipo de programa editor </li></ul></ul><ul><li>Página web dinámica : </li></ul><ul><ul><li>Puede tener cambios frecuentes en la información </li></ul></ul><ul><ul><li>Los contenidos se almacenan en una base de datos </li></ul></ul><ul><ul><li>Se actualiza a través de un gestor de contenidos (CMS) </li></ul></ul>
  4. 5. Páginas dinámicas de cliente o de servidor <ul><li>Servidor: Ordenador que, formando parte de una red, provee servicios a otros ordenadores denominados clientes </li></ul><ul><li>Servidor: Una aplicación informática o programa que realiza algunas tareas en beneficio de otras aplicaciones llamadas clientes </li></ul>
  5. 6. Páginas dinámicas de cliente o de servidor <ul><li>Páginas dinámicas de cliente : </li></ul><ul><ul><li>El navegador es una aplicación que interpreta HTML </li></ul></ul><ul><ul><li>Puede tener insertados otros lenguajes, como Java y JavaScript </li></ul></ul><ul><ul><li>A través de plugins puede contener elementos multimedia </li></ul></ul><ul><ul><li>Las llamadas a un servidor remoto sólo descargan los archivos en memoria </li></ul></ul><ul><ul><li>Todo el proceso se realiza en el ordenador del usuario </li></ul></ul>
  6. 7. Páginas dinámicas de cliente o de servidor <ul><li>Páginas dinámicas de servidor : </li></ul><ul><ul><li>Están hechas en lenguajes que son reconocidos, ejecutados e interpretados por el propio servidor </li></ul></ul><ul><ul><li>Se envían al cliente en un formato comprensible para él (HTML) </li></ul></ul>
  7. 8. Páginas dinámicas de cliente o de servidor <ul><li>Páginas dinámicas de servidor : </li></ul>
  8. 9. Lenguajes de programación <ul><li>HTML (HyperText Markup Language) : </li></ul><ul><ul><li>No es un lenguaje de programación </li></ul></ul><ul><ul><li>Lenguaje de marcado basado en etiquetas (< >) </li></ul></ul><ul><ul><li>Empleado para dar forma al contenido de las páginas web </li></ul></ul><ul><ul><li>El estándar lo define el W3C (World Wide Web Consortium) </li></ul></ul><ul><ul><li>Definido por el SGML (Standard Generalized Markup Language) </li></ul></ul><ul><ul><li>Extensiones de archivos .html ó .htm </li></ul></ul>
  9. 10. Lenguajes de programación <ul><li>HTML (HyperText Markup Language) : </li></ul>
  10. 11. Lenguajes de programación <ul><li>XML (Extensible Markup Language) : </li></ul><ul><ul><li>Metalenguaje extensible de etiquetas desarrollado por el W3C </li></ul></ul><ul><ul><li>Es una forma de definir lenguajes para diferentes necesidades </li></ul></ul><ul><ul><li>Estándar para el intercambio de información estructurada entre diferentes plataformas </li></ul></ul><ul><ul><li>Se puede usar en bases de datos, editores de texto, hojas de cálculo, etc. </li></ul></ul><ul><ul><li>Definido por el SGML (Standard Generalized Markup Language) </li></ul></ul><ul><ul><li>Extensiones de archivos .xml </li></ul></ul>
  11. 12. Lenguajes de programación <ul><li>XML </li></ul>
  12. 13. Lenguajes de programación <ul><li>XHTML (Extensible Hypertext Markup Language) : </li></ul><ul><ul><li>Sustituto para HTML como estándar para las páginas web </li></ul></ul><ul><ul><li>Cumple especificaciones más estrictas de XML </li></ul></ul><ul><ul><li>El contenido de la WWW ahora puede visualizarse desde numerosos dispositivos </li></ul></ul><ul><ul><li>Necesidad de estándares estrictos </li></ul></ul><ul><ul><li>La información y la forma de presentarla deben estar claramente separadas </li></ul></ul><ul><ul><li>Base para la creación de la web semántica </li></ul></ul>
  13. 14. Lenguajes de programación <ul><li>XHTML (Extensible Hypertext Markup Language) : </li></ul>Ejemplo: http://www.latevaweb.com/
  14. 15. Lenguajes de programación <ul><li>JavaScript : </li></ul><ul><ul><li>Sigue las especificaciones del ECMAScript </li></ul></ul><ul><ul><li>Lenguaje de scripts basado en objetos </li></ul></ul><ul><ul><li>Permite la creación de páginas dinámicas </li></ul></ul><ul><ul><li>Se incrustra en el documento HTML </li></ul></ul><ul><ul><li>Se maneja del lado del cliente </li></ul></ul><ul><ul><li>No permite consultar datos del lado del servidor </li></ul></ul><ul><ul><li>Estándar definido y mantenido por W3C a través del DOM (Document Object Model) </li></ul></ul>
  15. 16. Lenguajes de programación <ul><li>JavaScript : </li></ul>Ejemplos: http://www.gamarod.com.ar/javascript/
  16. 17. Lenguajes de programación <ul><li>ActionScript : </li></ul><ul><ul><li>Lenguaje de programación orientado a objetos (OOP) </li></ul></ul><ul><ul><li>Utilizado en el entorno Adobe Flash </li></ul></ul><ul><ul><li>Basado en especificaciones de ECMAScript </li></ul></ul><ul><ul><li>Similar a JavaScript </li></ul></ul><ul><ul><li>La versión 3.0 ha significado una mejora en el manejo de programación orientada a objetos </li></ul></ul>
  17. 18. Lenguajes de programación <ul><li>ActionScript : </li></ul>Ejemplos: http://www.thefwa.com/
  18. 19. Lenguajes de programación <ul><li>PHP (Hypertext Preprocessor) : </li></ul><ul><ul><li>Usado principalmente para sitio dinámicos </li></ul></ul><ul><ul><li>Del lado del servidor </li></ul></ul><ul><ul><li>Embebido en HTML </li></ul></ul><ul><ul><li>Necesita de servidor Web (Apache o IIS con las librerías de PHP) </li></ul></ul><ul><ul><li>Lenguaje libre </li></ul></ul><ul><ul><li>Multiplataforma </li></ul></ul><ul><ul><li>Descataca su conectividad con MySQL </li></ul></ul><ul><ul><li>Extensiones de archivo .php </li></ul></ul>
  19. 20. Lenguajes de programación <ul><li>PHP : </li></ul>Ejemplo: http://digg.com/
  20. 21. Lenguajes de programación <ul><li>ASP (Active Server Pages) : </li></ul><ul><ul><li>Creado por Microsoft </li></ul></ul><ul><ul><li>Del lado del servidor </li></ul></ul><ul><ul><li>Requiere Internet Information Server (IIS) </li></ul></ul><ul><ul><li>Óptimo con el manejador de base de datos SQL Server </li></ul></ul><ul><ul><li>Tecnología propietaria </li></ul></ul><ul><ul><li>Hospedaje costoso </li></ul></ul><ul><ul><li>Extensiones de archivo .asp </li></ul></ul>
  21. 22. Lenguajes de programación <ul><li>ASP </li></ul>Ejemplos: http://www.asptutor.com/asp/todoslosarticulos.asp
  22. 23. Lenguajes de programación <ul><li>ASP.NET : </li></ul><ul><ul><li>Es un framework de desarrollo </li></ul></ul><ul><ul><li>Comercializado por microsoft </li></ul></ul><ul><ul><li>Se puede usar C#, VB.NET o J# en los desarrollos Web </li></ul></ul><ul><ul><li>Las aplicaciones necesitan de Framework de .NET </li></ul></ul><ul><ul><li>Se ejecuta en el lado del servidor </li></ul></ul><ul><ul><li>Orientado a objetos </li></ul></ul><ul><ul><li>Los archivos son extensión .aspx </li></ul></ul>
  23. 24. Lenguajes de programación <ul><li>ASP.NET : </li></ul>
  24. 25. Lenguajes de programación <ul><li>JSP (Java Server Pages) : </li></ul><ul><ul><li>Orientado a desarrollar páginas Web en Java </li></ul></ul><ul><ul><li>Lenguaje multiplataforma </li></ul></ul><ul><ul><li>Se ejecuta en el lado del servidor </li></ul></ul><ul><ul><li>Similar a ASP.NET en la potencia de los desarrollos </li></ul></ul><ul><ul><li>Necesita para su funcionamiento el servidor Tomcat </li></ul></ul><ul><ul><li>Permite separar el código dinámico del estático </li></ul></ul><ul><ul><li>El código JSP se puede incrustar en HTML </li></ul></ul><ul><ul><li>Utiliza el motor de servlets de Java </li></ul></ul><ul><ul><li>La extensión de archivo es .jsp </li></ul></ul>
  25. 26. Lenguajes de programación <ul><li>JSP (Java Server Pages) : </li></ul>Ejemplos: http://www.sun.com/
  26. 27. Lenguajes de programación <ul><li>ColdFusion : </li></ul><ul><ul><li>Desarrollado por Macromedia </li></ul></ul><ul><ul><li>Usado para crear sitios dinámicos </li></ul></ul><ul><ul><li>Del lado del servidor </li></ul></ul><ul><ul><li>Requiere servidor ColdFusion </li></ul></ul><ul><ul><li>Interactúa de manera simple con bases de datos (Sybase, Oracle, MySQL, SQL Server, o Access) </li></ul></ul><ul><ul><li>Extensión de archivo .cfm </li></ul></ul>
  27. 28. Lenguajes de programación <ul><li>ColdFusion : </li></ul>Ejemplos: http://www.adobe.com/products/coldfusion/customers/
  28. 29. Lenguajes de programación <ul><li>Perl : </li></ul><ul><ul><li>Toma elementos del lenguaje C y shell </li></ul></ul><ul><ul><li>Lenguaje de propósito general </li></ul></ul><ul><ul><li>Multiparadigma (programación orientada a objetos, programación estructurada y programación funcional) </li></ul></ul><ul><ul><li>Pensado para la plataforma UNIX, pero disponible para varios sistemas operativos </li></ul></ul><ul><ul><li>Los archivos son extensión .pl </li></ul></ul>
  29. 30. Lenguajes de programación <ul><li>Perl : </li></ul>Ejemplos: http://royal.pingdom.com/2009/11/06/perl-far-from-dead-more-popular-than-you-think/
  30. 31. Lenguajes de programación <ul><li>Python : </li></ul><ul><ul><li>Lenguaje creado en el año 1991 por Guido Van Rossum </li></ul></ul><ul><ul><li>Considerado como el más limpio para programar </li></ul></ul><ul><ul><li>Permite crear todo tipo de aplicaciones incluyendo sitios web </li></ul></ul><ul><ul><li>Se ejecuta en el lado del servidor </li></ul></ul><ul><ul><li>Licencia de código abierto (Opensource) </li></ul></ul><ul><ul><li>Multiplataforma </li></ul></ul><ul><ul><li>Multiparadigma (programación orientada a objetos, programación estructurada y programación funcional) </li></ul></ul><ul><ul><li>La extensión de archivo es .py </li></ul></ul>
  31. 32. Lenguajes de programación <ul><li>Python : </li></ul>Ejemplo: http://www.youtube.com
  32. 33. Lenguajes de programación <ul><li>Ruby : </li></ul><ul><ul><li>Lenguaje desarrollado por Yukihro “Matz” Matsumoto </li></ul></ul><ul><ul><li>Inspirada en Python y Perl </li></ul></ul><ul><ul><li>Distribuido bajo licencia de software libre </li></ul></ul><ul><ul><li>Orientado a objetos </li></ul></ul><ul><ul><li>Los archivos son extensión .rb </li></ul></ul><ul><li>Ruby on Rails </li></ul><ul><ul><li>Framework de aplicaciones web de código abierto escrito en el lenguaje de programación Ruby </li></ul></ul>
  33. 34. Lenguajes de programación <ul><li>Ruby : </li></ul>Ejemplo: http://www.43things.com/
  34. 35. Lenguajes de programación <ul><li>Ajax (Asynchronous JavaScript And XML) : </li></ul><ul><ul><li>Técnica de desarrollo web para crear aplicaciones interactivas o RIA (Rich Internet Applications) </li></ul></ul><ul><ul><li>Se ejecutan en el cliente mientras mantienen la comunicación asíncrona con el servidor en segundo plano </li></ul></ul><ul><ul><li>Permite realizar cambios sobre las páginas sin necesidad de recargarlas </li></ul></ul><ul><ul><li>Se aumenta la interactividad, velocidad y usabilidad en las aplicaciones </li></ul></ul>
  35. 36. Lenguajes de programación <ul><li>Ajax (Asynchronous JavaScript And XML) : </li></ul>Ejemplos: http://www.ajaxdaddy.com/
  36. 37. Lenguajes de programación <ul><li>CSS (Cascading Style Sheets) : </li></ul><ul><ul><li>Lenguaje usado para definir la presentación de un documento estructurado (HTML, XHTML) </li></ul></ul><ul><ul><li>Desarrollado por el W3C </li></ul></ul><ul><ul><li>La idea que se encuentra detrás del desarrollo de CSS es separar la estructura de un documento de su presentación </li></ul></ul><ul><ul><li>Extensión .css </li></ul></ul>
  37. 38. Lenguajes de programación <ul><li>CSS (Cascading Style Sheets) : </li></ul>Ejemplos: http://www.csszengarden.com/tr/espanol/

×