Conferencia-presentación Javascript

1,123 views

Published on

Aproximación a la historia y fundamente del lenguaje de programación web Javascript.

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,123
On SlideShare
0
From Embeds
0
Number of Embeds
19
Actions
Shares
0
Downloads
45
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Conferencia-presentación Javascript

  1. 1. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Javascript Javier Infante <jabi@irontec.com> Donosti :: EHU / UPV ::16/10/2009
  2. 2. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? ¿QUÉ ES JAVASCRIPT?
  3. 3. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Lenguaje de scripting.
  4. 4. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? No se compila, es LENTO.
  5. 5. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? ¿QUÉ NO ES JAVASCRIPT?
  6. 6. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? No es un applet de Java. (No necesita una máquina virtual para ejecutarse)
  7. 7. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? No es un Flash. (No necesita un plugin para ejecutarse)
  8. 8. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Su ámbito principal es un navegador web.
  9. 9. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? El script se DESCARGA y se interpreta en el navegador
  10. 10. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Es totalmente independiente de la tecnología que haya en el servidor.
  11. 11. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde?
  12. 12. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Javascript es simplemente código descargado desde el servidor web. Sin más. (Es un lenguaje común e independiente de todas las plataformas de desarrollo web)
  13. 13. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Un poco de historia
  14. 14. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Historia 1995
  15. 15. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Historia Brendan Eich...
  16. 16. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Historia ...inventa el lenguaje Mocha. Se rebautizará como Livescript y finalmente...
  17. 17. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Historia …el 4 de Diciembre de 1995...
  18. 18. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Historia Sun y Netscape anuncian conjuntamente la aparición de Javascript en su navegador Netscape Communicator.
  19. 19. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Julio 1996
  20. 20. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Microsoft responde anunciando su propio dialecto de Javascript para IE3: Nacía JScript.
  21. 21. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Junio 1997
  22. 22. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? ECMA* adopta Javascript como un estándar: ECMAScript. (ISO lo adoptará en 1998) *ECMA: European Computer Manufactures
  23. 23. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Historia 2000
  24. 24. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Historia W3C diseña y propone el estándar DOM*. *DOM: Document Object Model
  25. 25. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? En resumen: Tenemos distintas implementaciones de JS en distintos navegadores (CAOS). Intentos de estandarización sin mucho éxito. Así que en aquellos primeros años de Javascript...
  26. 26. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Javascript era casi como un juguete
  27. 27. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? ¿Es Asterisk una alternativa fiable? Además un juguete bastante caótico... (y sigue siéndolo)
  28. 28. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Era la época del prompt, los alerts, y los popups...
  29. 29. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? El copia y pega de scripts “super útiles” desde montones de sitios... javascriptsource.com dynamicdrive.com
  30. 30. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? ¿Es Asterisk una alternativa fiable? Nieve en tu página web (GRATIS!)
  31. 31. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Cuenta atrás!
  32. 32. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Protección contra ladrones de fotos
  33. 33. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Historia LA REVOLUCIÓN. La revolución estaba cerca...
  34. 34. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? 2003
  35. 35. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? En la conferencia SXSW, Steve Champeon y Nick Fink presentan: “Progressive Enhancement and the Future of Web Design*” SXSW: South by SouthWest
  36. 36. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Básicamente introducen nuevas pautas en el desarrollo web: Separación de contenido y presentación. Marcado semántico. Estándares web. Disponibilidad de cualquier sitio web para cualquier cliente.
  37. 37. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Traducido a Javascript: - El sitio web es usable con cualquier navegador, tenga o no tenga soporte Javascript. - Todo el JS tiene que estar en ficheros externos. - No se permiten etiquetas para control de eventos (onclick / etc). - Los elementos dependientes de Javascript, son añadidos dinámicamente. - Las funcionalidades Javascript deben enriquecer la experiencia de usuario, no dar acceso exclusivo a la información.
  38. 38. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Básicamente viene a decir: Tu “user-experience” será proporcional a la calidad de tu navegador. Pero la información será siempre accesible.
  39. 39. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? 18 Febrero de 2005
  40. 40. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Jesse James Garrett ...
  41. 41. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? ...escribe un artículo bautizando un nuevo paradigma en Javascript: AJAX
  42. 42. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Historia http://adaptivepath.com/ideas/essays/archives/000385.php
  43. 43. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? AJAX: Asyncronous Javascript and XML. - Peticiones asíncronas al servidor directamente desde Javascript. - Permite actualizar contenido (DOM), sin necesidad de recargar la página. - Acerca la lógica del servidor a Javascript. Lo hace más práctico.
  44. 44. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde?
  45. 45. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Aunque no fue la primera gran compañía en utilizar AJAX, Google lo puso de moda.
  46. 46. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Hoy, no vemos un portal o aplicación web sin Javascript.
  47. 47. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Historia Javacript es un lenguaje maduro y muy POTENTE (y respetado por fin).
  48. 48. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Ya tenemos la idea sobre como queremos desarrollar webs potentes, y con interfaces de usuarios amigables y accesibles . Pero....
  49. 49. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Seguimos teniendo que ejecutar Javascript en los navegadores...
  50. 50. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Y muchos navegadores, todavía no respetan esos estándares ECMAScript...
  51. 51. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Pero queremos seguir desarrollando siguiendo el modelo de mejora progresiva y haciendo webs con AJAX y animaciones... ¿Qué hacemos?
  52. 52. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? (IE6+IE7 cuentan con aproximadamente un 30% del mercado actualmente... no se pueden obviar)
  53. 53. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Opción A) Podemos programar nuestras propias librerías de abstracción para resolver todos los conflictos CROSS-BROWSER. Opción B) Utilizar Librerías de abstracción ya desarrolladas, y olvidarnos de una parte importante de Javascript.
  54. 54. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Opción A) Podemos programar nuestras propias librerías de abstracción para resolver todos los conflictos CROSS-BROWSER. Opción B) Utilizar Librerías ya desarrolladas, y dejar de programar en Javascript. - Evitamos cambiar nuestras librerías cuando cambien los navegadores. - Llegaremos a todos los bugs conocidos en todos los navegadores. - El desarrollo de la comunidad siempre será más fiable y eficiente.
  55. 55. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Presentamos: y la “elegida”:
  56. 56. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? ¿Por qué jQuery? ● API muy potente e intuitiva basada en selectores CSS. ● Excelente respeto por el namespacing global. (simplemente se quedan con “$”, y puede evitarse). ● Buen soporte para plugins. ● Excelente documentación.
  57. 57. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? ¿Por qué NO todas las demás? ● YUI: demasiado “escueta”, su “namespacing” es severo, pero incómodo, aunque tiene buena documentación. ● Prototype: demasiado inspirada en Ruby on Rails, demasiadas funciones en el contexto global y demasiadas modificaciones de los tipados internos. ● DOJO: curva de aprendizaje alta y documentación no tan buena. ● MOOTOOLS: No es muy compatible con otras librerías, API poco intuitiva y poco respeto por el contexto global
  58. 58. Javascript. ¿Qué? ¿Cómo? ¿De dónde? ¿Hasta dónde? Licencias / Créditos Fotos Brandon Deth: http://www.flickr.com/photos/bdeth/ SkinnyDiver: http://www.flickr.com/photos/tangysd/ AcidJazzed: http://en.wikipedia.org/wiki/User:AcidJazzed Topgold: http://www.flickr.com/photos/topgold/ CSSBlog: http://cssblog.es Licencia Este documento está protegido bajo la licencia Reconocimiento- SinObraDerivada 2.1 España de Creative Common (http://creativecommons.org/licenses/by-nc-sa/3.0/es/) Copyright © 2009 Javier Infante <jabi@irontec.com> Se permite la copia, modificación, distribución, uso comercial y realización de la obra, siempre y cuando se reconozca la autoría de la misma, a no sea ser que se obtenga permiso expreso del autor. El autor no permite distribuir obras derivadas a esta. Esta nota no es la licencia completa de la obra, sinouna traducción de la nota orientativa de la licenciaoriginal completa (jurídicamente válida).

×