AngularFire - Build heroic and extraordinary apps !

Transcript

1. Prepared by Manan Jadhav (@curosmj) http://curos.in AngularFire Build heroic and extraordinary apps !
2. Prepared by Manan Jadhav (@curosmj) http://curos.in About Me Open Source Enthusiast | Full stack developer Contributed to Laravel Framework. Worked with jQuery, Angular, Firebase, NodeJS, Mongo, MySQL, Bootstrap, Android… and more... Tech Lead @ TheCollegeStore.in Co Founder @ Utonexus.com Active GDG Member @ GDG Baroda & GDG Ahm.
3. Prepared by Manan Jadhav (@curosmj) http://curos.in + == AngularFire
4. Prepared by Manan Jadhav (@curosmj) http://curos.in var say = “Hello Firebase !”;
5. Prepared by Manan Jadhav (@curosmj) http://curos.in What is Firebase ? DBaaS (Database as a service) in the cloud. RESTful API, serves JSON. Easy to setup, easy to scale. SDKs are available for all major platforms. In built authentication. (with OAuth)
6. Prepared by Manan Jadhav (@curosmj) http://curos.in What else? You won’t need to write backend code. Write code for frontend only. Lets you concentrate on UI/UX. Keeps your data in sync (across all clients) via SDKs. Free hosting for static assets.
7. Prepared by Manan Jadhav (@curosmj) http://curos.in https://zoomchat.firebaseapp.com/
8. Prepared by Manan Jadhav (@curosmj) http://curos.in Platforms supported by
9. Prepared by Manan Jadhav (@curosmj) http://curos.in say = “Hello Angular !”;
10. Prepared by Manan Jadhav (@curosmj) http://curos.in What is Angular ? Build SPAs and RIAs JavaScript MVC framework View - Model binding is the key One way and two way binding Allows DOM manipulation Lots of useful services ($http, $ngAnimate, $ngRoute)
11. Prepared by Manan Jadhav (@curosmj) http://curos.in Bindings in Angular. One way : Two way : Model (JS Object) View (HTML) Model (JS Object) View (HTML)
12. Prepared by Manan Jadhav (@curosmj) http://curos.in http://angular-demos.curos.in/
13. Prepared by Manan Jadhav (@curosmj) http://curos.in Alternatives to Angular? Backbone : Does not provide bindings. React (by Facebook): Merely provides the “V” of MVC. EmberJS : Does not let you use native JS objects for models . Angular and Firebase are backed by Google.
14. Prepared by Manan Jadhav (@curosmj) http://curos.in + == AngularFire
15. Prepared by Manan Jadhav (@curosmj) http://curos.in AngularFire A library by Firebase team. Provides a “firebase” module for use in AngularJS projects. Exposes three services : $firebaseArray, $firebaseObject, $firebaseAuth. Allows for 3 way binding And 6 way binding
16. Prepared by Manan Jadhav (@curosmj) http://curos.in 3 way & 6 way bindings 3 Way Binding : 6 Way Binding : Model (JS Object) View (HTML) DB (Firebase) Model (JS Object) View (HTML) DB (Firebase)
17. Prepared by Manan Jadhav (@curosmj) http://curos.in https://6way.firebaseapp.com/
18. Prepared by Manan Jadhav (@curosmj) http://curos.in Links This presentation : https://goo.gl/DbQ3Vm Demos & their code : Firebase Basic Demo : https://zoomchat.firebaseapp.com/ | GitHub Repo Angular Demo : http://angular-demos.curos.in | GitHub Repo AngularFire Demo : https://6way.firebaseapp.com | GitHub Repo Firebase Website (Guides, Docs & more) : http://firebase.com/ AngularJS Website (Guides, Docs & more) : https://angularjs.org/ AngularFire Documentation : https://www.firebase.com/docs/web/libraries/angular/ Catch up with me : http://curos.in | curos@utonexus.com | Facebook | Twitter | GitHub
19. Prepared by Manan Jadhav (@curosmj) http://curos.in That’s all folks !