Se ha denunciado esta presentación.
Utilizamos tu perfil de LinkedIn y tus datos de actividad para personalizar los anuncios y mostrarte publicidad más relevante. Puedes cambiar tus preferencias de publicidad en cualquier momento.

Prototipado de Aplicaciones web con Firebase #CampusGivers

469 visualizaciones

Publicado el

Charla en Campus Madrid, dentro del programa Campus Givers donde explico las principales alternativas y herramientas disponibles para desarrollar aplicaciones web con Firebase, Polymer y React y lanzar cuanto antes tu proyecto al mercado.

Publicado en: Tecnología
  • ♣♣ 10 Easy Ways to Improve Your Performance in Bed... ◆◆◆ https://tinyurl.com/rockhardxxx
       Responder 
    ¿Estás seguro?    No
    Tu mensaje aparecerá aquí
  • Sé el primero en recomendar esto

Prototipado de Aplicaciones web con Firebase #CampusGivers

  1. 1. @carlosazaustre carlosazaustre.es #CampusGivers
  2. 2. @carlosazaustre carlosazaustre.es #CampusGivers Carlos Azaustre CTO y Cofundador en Chefly Desarrollador Web Formador / Blogger / Youtuber Papá
  3. 3. @carlosazaustre carlosazaustre.es #CampusGivers Quiero desarrollar una aplicación
  4. 4. @carlosazaustre carlosazaustre.es #CampusGivers
  5. 5. @carlosazaustre carlosazaustre.es #CampusGivers
  6. 6. @carlosazaustre carlosazaustre.es #CampusGivers
  7. 7. @carlosazaustre carlosazaustre.es #CampusGivers
  8. 8. @carlosazaustre carlosazaustre.es #CampusGivers
  9. 9. @carlosazaustre carlosazaustre.es #CampusGivers ¿Qué herramientas/alternativas tengo?
  10. 10. @carlosazaustre carlosazaustre.es #CampusGivers
  11. 11. @carlosazaustre carlosazaustre.es #CampusGivers Progressive Web Apps
  12. 12. @carlosazaustre carlosazaustre.es #CampusGivers ● HTTPS - letsencrypt.org ● Responsive Design - Mobile Friendly Test ● Offline - Service Workers ● Add to Home Screen (Installable) - Web App Manifest ● Push Notifications - Service Workers
  13. 13. @carlosazaustre carlosazaustre.es #CampusGivers ¿Cómo empiezo una PWA desde cero?
  14. 14. @carlosazaustre carlosazaustre.es #CampusGivers 1. React.js
  15. 15. @carlosazaustre carlosazaustre.es #CampusGivers
  16. 16. @carlosazaustre carlosazaustre.es #CampusGivers 2. Polymer
  17. 17. @carlosazaustre carlosazaustre.es #CampusGivers
  18. 18. @carlosazaustre carlosazaustre.es #CampusGivers
  19. 19. @carlosazaustre carlosazaustre.es #CampusGivers
  20. 20. @carlosazaustre carlosazaustre.es #CampusGivers
  21. 21. @carlosazaustre carlosazaustre.es #CampusGivers <app-location route="{{route}}"></app-location> <app-route route="{{route}}" pattern="[[rootPattern]]:page" data="{{routeData}}" tail="{{subroute}}"></app-route> <app-drawer-layout fullbleed> <!-- Drawer content --> <app-drawer id="drawer" slot="drawer"> <app-toolbar>Menu</app-toolbar> <iron-selector selected="[[page]]" attr-for-selected="name" class="drawer-list" role="navigation"> <a name="view1" href="view1">View One</a> <a name="view2" href="view2">View Two</a> <a name="view3" href="view3">View Three</a> </iron-selector> </app-drawer> <!-- Main content --> <app-header-layout has-scrolling-region> <app-header slot="header" condenses reveals effects="waterfall"> <app-toolbar> <paper-icon-button icon="my-icons:menu" drawer-toggle></paper-icon-button> <div main-title>My App</div> </app-toolbar> </app-header> </app-header-layout> </app-drawer-layout> </template>
  22. 22. @carlosazaustre carlosazaustre.es #CampusGivers <app-location route="{{route}}"></app-location> <app-route route="{{route}}" pattern="[[rootPattern]]:page" data="{{routeData}}" tail="{{subroute}}"></app-route> <app-drawer-layout fullbleed> <!-- Drawer content --> <app-drawer id="drawer" slot="drawer"> <app-toolbar>Menu</app-toolbar> <iron-selector selected="[[page]]" attr-for-selected="name" class="drawer-list" role="navigation"> <a name="view1" href="view1">View One</a> <a name="view2" href="view2">View Two</a> <a name="view3" href="view3">View Three</a> </iron-selector> </app-drawer> <!-- Main content --> <app-header-layout has-scrolling-region> <app-header slot="header" condenses reveals effects="waterfall"> <app-toolbar> <paper-icon-button icon="my-icons:menu" drawer-toggle></paper-icon-button> <div main-title>My App</div> </app-toolbar> </app-header> </app-header-layout> </app-drawer-layout> </template>
  23. 23. @carlosazaustre carlosazaustre.es #CampusGivers Vale el Frontend lo tenemos cubierto, pero… ¿Y el Backend?
  24. 24. @carlosazaustre carlosazaustre.es #CampusGivers
  25. 25. @carlosazaustre carlosazaustre.es #CampusGivers Firebase Hosting Firebase Database Cloud Storage for Firebase Cloud Functions for Firebase Firebase Auth
  26. 26. @carlosazaustre carlosazaustre.es #CampusGivers Firebase Hosting Firebase Database Cloud Storage for Firebase Cloud Functions for Firebase Firebase Auth Machine Learning APIs Cloud Vision API Cloud Speech API Cloud Jobs API Cloud Translation API Cloud Natural Language API Cloud Video Intelligence API ...
  27. 27. @carlosazaustre carlosazaustre.es #CampusGivers ¿Cómo es Firebase?
  28. 28. @carlosazaustre carlosazaustre.es #CampusGivers
  29. 29. @carlosazaustre carlosazaustre.es #CampusGivers
  30. 30. @carlosazaustre carlosazaustre.es #CampusGivers
  31. 31. @carlosazaustre carlosazaustre.es #CampusGivers ¿Qué se puede hacer con las Cloud Functions?
  32. 32. @carlosazaustre carlosazaustre.es #CampusGivers
  33. 33. @carlosazaustre carlosazaustre.es #CampusGivers
  34. 34. @carlosazaustre carlosazaustre.es #CampusGivers
  35. 35. @carlosazaustre carlosazaustre.es #CampusGivers Codelabs by Google Aprende practicando codelabs.developers.google.com
  36. 36. @carlosazaustre carlosazaustre.es #CampusGivers https://codelabs.developers.google.com/codelabs/polymer-firebase-pwa/
  37. 37. @carlosazaustre carlosazaustre.es #CampusGivers https://codelabs.developers.google.com/codelabs/firebase-cloud-functions/
  38. 38. @carlosazaustre carlosazaustre.es #CampusGivers Curso Gratis Aprende React.js y Firebase desarrollando una aplicación web como Instagram carlosazaustre.es/guia-react

×