Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.

Hipster JS: Angular & Firebase (Tri-JS Meetup)

1.525 Aufrufe

Veröffentlicht am

A fast and loose overview of AngularJS & Firebase.

Veröffentlicht in: Technologie
  • Loggen Sie sich ein, um Kommentare anzuzeigen.

Hipster JS: Angular & Firebase (Tri-JS Meetup)

  1. 1. Hipster JS A Brief Introduction to ! Angular & Firebase very ^
  2. 2. About ME • Python Programmer • Hate JS • Realized I had to suck it up • Learned Angular and like it • (Coffeescript is cool too)
  3. 3. Superheroic Javascript MVW Framework (HTML enhanced for web apps!)
  4. 4. MVW?
  5. 5. Model! View! Whatever You Want
  6. 6. Different approach to web app architecture. Boiler plate and cruft replaced with black magic and voodoo. But seriously- it is a different approach. Apps, Controllers, Directives, Services
  7. 7. Apps (modules) You’ll probably only have one Essential building block var heroes = angular.module('heroes', []); It’s your namespace
  8. 8. Controllers If the HTML is the where and the JS is the what… controllers are the how… Most importantly- they give you a scope. (and lots of other stuff) heroes.controller('HeroController', ['$scope', function($scope){ $scope.hero = 'Spiderman'; }]);
  9. 9. Directives This is really the where- they are used in the HTML Encapsulate logical functionality and display Can have templates Can have controllers Can have an isolated scope
  10. 10. Services There are providers, services, and factories Let’s focus on factory heroes.factory('HeroFactory', function(){ return function(name) { return { name: name, superpower: null, alterEgo: null } } });
  11. 11. Code https://github.com/leetrout/jsheroes
  12. 12. Store & Sync Data Instantly • NoSQL • JSON Documents • Plug and play with Angular
  13. 13. Plug and play Angular with Firebase
  14. 14. Learning More egghead.io learn-angular.org codeschool.com firebase.com codecademy.comangularfire.com
  15. 15. Thanks!