Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Workshop: Rompiendo el Mundo Binario con Vue.js

Workshop: Rompiendo el Mundo Binario con Vue.js

6c3e7ef20801b4b967dc1643f63d6233?s=128

Ignacio Anaya

December 03, 2017
Tweet

Transcript

  1. Workshop: Rompiendo el Mundo Binario con Vue.js !" @ianaya89 Breaking

    the Binary World with Vue.js ! " - @ianaya89 1
  2. ! Nacho Anaya @ianaya89 • Full Stack Developer, Tech Trainer

    & Speaker • Embajador @Auth0 • Organizador @Vuenos_Aires Breaking the Binary World with Vue.js ! " - @ianaya89 2
  3. Breaking the Binary World with Vue.js ! " - @ianaya89

    3
  4. Breaking the Binary World with Vue.js ! " - @ianaya89

    4
  5. ⬇ ~1M / month Breaking the Binary World with Vue.js

    ! " - @ianaya89 5
  6. ✨ ~ 75K Breaking the Binary World with Vue.js !

    " - @ianaya89 6
  7. !" ~ 300K Breaking the Binary World with Vue.js !

    " - @ianaya89 7
  8. ! 73 Repositorios Breaking the Binary World with Vue.js !

    " - @ianaya89 8
  9. ! Empresas Breaking the Binary World with Vue.js ! "

    - @ianaya89 9
  10. ! Comunidad Breaking the Binary World with Vue.js ! "

    - @ianaya89 10
  11. ! Por Qué Vue.js? Breaking the Binary World with Vue.js

    ! " - @ianaya89 11
  12. ! Complegidad > Inherente vs. Instrumental Breaking the Binary World

    with Vue.js ! " - @ianaya89 12
  13. ! Inherente > El Proyecto Breaking the Binary World with

    Vue.js ! " - @ianaya89 13
  14. ! Instrumental > El Precio Breaking the Binary World with

    Vue.js ! " - @ianaya89 14
  15. ! ! Breaking the Binary World with Vue.js ! "

    - @ianaya89 15
  16. ! ! Breaking the Binary World with Vue.js ! "

    - @ianaya89 16
  17. ! El Framework Progresivo • Vista • Core • VDOM

    • Reactivo • Componentes Breaking the Binary World with Vue.js ! " - @ianaya89 17
  18. Breaking the Binary World with Vue.js ! " - @ianaya89

    18
  19. ! Rendering Declarativo Breaking the Binary World with Vue.js !

    " - @ianaya89 19
  20. !" <script src="https://unpkg.com/vue"></script> <div id="app"> {{ hello }} </div> <script>

    new Vue({ el: '#app', data: function() { return { hello: 'Hola FreeCodeCamp!' } } }); </script> Breaking the Binary World with Vue.js ! " - @ianaya89 20
  21. ! render() new Vue({ el: '#app', data() { return {

    hello: 'Hola FreeCodeCamp!' } }, render(h) { return ( <h1>{this.hello}</h1> ) } }) Breaking the Binary World with Vue.js ! " - @ianaya89 21
  22. ! Sistema de Componentes Breaking the Binary World with Vue.js

    ! " - @ianaya89 22
  23. ! Semantica <main> <top-bar></top-bar> <container> <login-form></login-form> </container> <annoying-banners></annoying-banners> <bottom-bar></bottom-bar> </main>

    Breaking the Binary World with Vue.js ! " - @ianaya89 23
  24. ! .vue Breaking the Binary World with Vue.js ! "

    - @ianaya89 24
  25. ♻ Life Cycle Hooks new Vue({ created: function() { console.log('I

    am alive ') } }); Breaking the Binary World with Vue.js ! " - @ianaya89 25
  26. ☎ Comunicación • ⬇ Propiedades Abajo • ⬆ Eventos Arriba

    Breaking the Binary World with Vue.js ! " - @ianaya89 26
  27. ! DX Breaking the Binary World with Vue.js ! "

    - @ianaya89 27
  28. ! vue-cli Breaking the Binary World with Vue.js ! "

    - @ianaya89 28
  29. ! Dev Tools Breaking the Binary World with Vue.js !

    " - @ianaya89 29
  30. ! Work Shop Time Breaking the Binary World with Vue.js

    ! " - @ianaya89 30
  31. ! vue-router > Single Page Applications Breaking the Binary World

    with Vue.js ! " - @ianaya89 31
  32. ! vuex > State Management (Flux) Breaking the Binary World

    with Vue.js ! " - @ianaya89 32
  33. ! Native & Nuxt.js > Server Side Rendering Breaking the

    Binary World with Vue.js ! " - @ianaya89 33
  34. ! Native Script & Weex > Mobile Native Rendering Breaking

    the Binary World with Vue.js ! " - @ianaya89 34
  35. ! Take Away • ! Progresivo (Simple & Complejo) •

    " Rendering Declarativo • # Sistema de Componentes • $ Ecosistema muy amplio • % Una gran comunidad Breaking the Binary World with Vue.js ! " - @ianaya89 35
  36. Breaking the Binary World with Vue.js ! " - @ianaya89

    36
  37. Gracias! @ianaya89 Breaking the Binary World with Vue.js ! "

    - @ianaya89 37