Save 37% off PRO during our Black Friday Sale! »

Meteor: Javascript Framework - Basics

Efc709112cd51a0b72e5baae3c5ed03c?s=47 Juan
June 03, 2013
2

Meteor: Javascript Framework - Basics

Speaker at “Engineering Week” - National Technological University.

Slides destined to introduce this javascript framework for real-time applications to the community of developers whether they have backend or frontend knowledge.

Github Repository with example app:
https://github.com/juanroldan1989/code-blast-meteor-chat

News article:
http://www.frt.utn.edu.ar/eventos/semanaingenieria/?s=973

Efc709112cd51a0b72e5baae3c5ed03c?s=128

Juan

June 03, 2013
Tweet

Transcript

  1. Meteor

  2. Juan Roldán Ingeniero en Computación

  3. Plataforma open-source para construir aplicaciones web en una fracción de

    tiempo, siendo developer experto o principiante.
  4. insignia-list.meteor.com

  5. Comenzando...

  6. github.com/meteor/meteor

  7. $ curl https://install.meteor.com | /bin/sh $ meteor create myapp $

    cd myapp $ meteor => Meteor server running on: http://localhost:3000/ $ meteor deploy myapp.meteor.com
  8. MyApp - insignia-myapp.meteor.com

  9. MyApp - insignia-myapp.meteor.com

  10. MyApp - insignia-myapp.meteor.com

  11. Elementos fundamentales...

  12. Modelo M.V.V-M (Modelo - Vista - VistaModelo) Modelo "MVC Anidado"

    Base de datos: MongoDB (Documentos) Vistas: Plantillas - Handlebars (Vista)
  13. Puro Javascript Tanto en el cliente como en el servidor

    notificaciones, sliders, pop-ups Coffeescript Soportado en cliente y en servidor Archivos .coffee se compilan automáticamente
  14. Actualización en vivo Se escriben las plantillas a usar, automáticamente

    se actualizan de acuerdo a los cambios en la BD. Soporte para cualquier lenguaje de plantillas: (Handlebars - Jade - Mustache)
  15. Actualización en vivo

  16. Sincronización de datos En 1 solo archivo se puede definir

    el código que se corre en el servidor, en el cliente y en ambos. Desde el cliente se puede tener acceso a la BD local y remota.
  17. Sincronización de datos

  18. Compensación de latencia Usuario hace un cambio, su pantalla se

    actualiza inmediatamente sin esperar por el servidor. Meteor se encarga de re-sincronizar la info en cliente y servidor, sin intervención del developer. Ej: Leaderboard con puntajes.
  19. Hay BD en cliente y servidor. Meteor se encarga de

    mantenerlas sincronizadas.
  20. Hot Code Pushes En modo development, la app se actualiza

    a medida que modificamos los archivos. En modo production, se puede actualizar la app mientras los usuarios están conectados sin molestarlos. Cuando se actualiza ("deploy") la app con nuevo código, Meteor se encarga de inyectar el nuevo código en los browsers donde la app esté siendo ejecutada.
  21. insignia-list.meteor.com

  22. Web Chat

  23. github.com/juanroldan1989/code- blast-meteor-chat

  24. Ejemplo interesante...

  25. insignia-parties.meteor.com

  26. "Meteor takes care of all the real-time magic behinds the

    scenes, letting you spend a minimal time on the back-end and focus on the UI." sachagreif.com/introducing-telescope/
  27. Ejemplos más interesantes...

  28. chess.meteor. com wordplay.meteor.com toy-piano. meteor.com cool- counter. meteor.com

  29. Telescope (demo.telesc.pe) App de noticias sociales construida con Meteor. Nuestro

    propio Reddit o HackerNews, pero en tiempo real. 1.- Posts and comentarios en tiempo real 2.- Votos, usuarios, categorias... 3.- Signup por password o twitter. 4.- Notificaciones
  30. Telescope (demo.telesc.pe) github.com/SachaG/Telescope

  31. SidebarIO (sidebar.io) Usa el resumen diario de Telescope para mostrar

    los 5 mejores links del día de una determinada categoría. Canalizar un tipo de información al cliente en tiempo real.
  32. SidebarIO (sidebar.io)

  33. MUCHAS GRACIAS :)