Your SlideShare is downloading. ×

Angular js and phonegap unite

2,267

Published on

Presented live on Nov 7-8, 2013 at FITC's Web Unleashed event in Boston. …

Presented live on Nov 7-8, 2013 at FITC's Web Unleashed event in Boston.
with Lukas Ruebbelke

Native mobile development can be painful! So unless you are a masochist, there is a better way to develop mobile applications. This entire presentation will be dedicated to building a pain-free application using AngularJS and the awesome new features of PhoneGap 3.0. In less than an hour? Yep! Is it going to hurt? Nope!

Published in: Education, Technology, Business
0 Comments
8 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,267
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
46
Comments
0
Likes
8
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. AngularJS and PhoneGap Unite!
  • 2. Who am I?
  • 3. Lukas Ruebbelke Blogs at http://onehungrymind.com/ Tweets at @simpulton Contributed to AngularJS Co-Author of AngularJS in Action
  • 4. What is the goal?
  • 5. Mobile development feels like this.
  • 6. It should feel like this.
  • 7. Get feedback faster
  • 8. Being honest I AM LAZY!
  • 9. We all want to spend more time BEING AWESOME!
  • 10. Do you have an application?
  • 11. Is it responsive?
  • 12. You are here...
  • 13. And here we are!
  • 14. Part Zero: Foundation
  • 15. History of AngularJS Developed in 2009 by Misko Hevery. Publicly released as version 0.9.0 in October 2010 Currently at version 1.0.8 stable or 1.2.0rc3 unstable
  • 16. The AngularJS Elevator Pitch An intuitive framework that makes it easy to organize your code. Testable code makes it easier to sleep at night. Two-way data binding saves you hundreds of lines of code. Templates that are HTML means you already know how to write them. Data structures that are just JavaScript make integration really easy. 99 Problems but scope ain’t one of them!
  • 17. Hello AngularJS From Scratch / srp.s / citj aglrmdl(MAp,[) nua.oue'yp' ] .otolr'antl,fnto(soe { cnrle(MiCr' ucin$cp) $cp.ol ='hei! soewrd Ponx; }; ) / idxhm / ne.tl <tln-p=MAp> hm gap"yp" <oyn-otolr"antl> bd gcnrle=MiCr" <1Hlo{wrd}/1 h>el {ol}<h> <bd> /oy
  • 18. The Big AngularJS Picture
  • 19. Model View Whatever Choose “whatever” pattern helps you be more productive
  • 20. Controller and $scope $scope is the glue between the Controller and the View The Controller is responsible for constructing the model on $scope and providing commands for the View to act upon $scope provides context
  • 21. View and Templates The View is AngularJS compiled DOM The View is the product of $compile merging the HTML template with $scope DOM is no longer the single source of truth.
  • 22. Models and Services Services carry out common tasks specific to the web application Services are consumed via Dependency Injection Services are application singletons Services are instantiated lazily
  • 23. The 80/20 Rule
  • 24. Part One: AngularJS
  • 25. Stop! Demo Time!
  • 26. Part Two: Firebase
  • 27. Stop! Demo Time!
  • 28. Part Three: PhoneGap
  • 29. PhoneGap 3.0 Whoa! $ sudo npm install -g phonegap $ phonegap create hello com.example.hello HelloWorld $ cd hello $ phonegap run ios
  • 30. Step One Install the SDKs for the platforms you are targeting
  • 31. Step Two Install the CLI $ sudo npm install -g phonegap
  • 32. Step Three Create your project $ phonegap create leaderboard com.example.leaderboard Leaderboard $ cd leaderboard
  • 33. Step Four Run your project $ phonegap run ios $ phonegap run android
  • 34. Stop! Demo Time!
  • 35. Resources
  • 36. AngularJS http://angularjs.org/ Year of Moo http://www.yearofmoo.com/ One Hungry Mind http://onehungrymind.com/ Egghead.io http://egghead.io/
  • 37. Firebase https://www.firebase.com/ http://angularfire.com/
  • 38. PhoneGap http://phonegap.com/ Andrew Trice http://www.tricedesigns.com/ Christophe Coenraets http://coenraets.org/blog/ Holly Schinsky http://devgirl.org/
  • 39. Thanks!

×