Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Ionic adventures - Hybrid Mobile App Development rocks

22,920 views

Published on

Ionic frameworks is the new kid on the block related to Hybrid Mobile Apps created by Drifty and rapidly growth with a variety of tools like ionic lab, ionic creator, ionic view, ionic crosswalk integration and other exciting tools is coming this year like ionic PUSH.

Check this presentation to have a short getting start in this amazing framework.
Let's create amazing apps with Ionic. \o/

Published in: Technology

Ionic adventures - Hybrid Mobile App Development rocks

  1. 1. Ionic Adventures Hybrid Mobile development rocks @juarezpaf
  2. 2. http://plus.google.com/+JuarezPAFilho/about +JuarezPAFilho California Lover <3 http://plus.google.com/+JuarezPAFilho/about Hybrid Mobile development rocks @juarezpaf An enthusiastic Front end Engineer with over 7 years of experience, after his first CSS class devoted completely to Front End and UX. Front end Engineer at madewithlove Caravana Web Founder GDG Casts and GDG Organizer Ionic & Firebase Enthusiast
  3. 3. Hybrid Mobile development rocks @juarezpaf Hybrid Apps? Nah… Native is better!
  4. 4. Hybrid Mobile development rocks @juarezpaf Native Hybrid • Proficiency in each platform required • Entirely separate code bases • Timely & expensive development • Diminishing returns • More Platforms. More Problems. • Why are we still coding for multiple platforms? • Hybrid Apps: HTML5 that acts like native • Web wrapped in native layer • Direct access to native APIs • Familiar web dev environment • Develop a single code base (web platform) http://ionicframework.com/present-ionic/ Native versus Hybrid
  5. 5. Facebook Biggest Mistake Check this out Zuck Hybrid Mobile development rocks @juarezpafOpen your mind, hybrid apps [pt-BR] http://slidesha.re/1wwZ1FC Native versus Hybrid
  6. 6. Native SDKs No Web SDK Hybrid Mobile development rocks @juarezpafSmashing Magazine: Hybrid apps http://goo.gl/pU09WO Native versus Hybrid • Common UI • Views • Navigation and stack history • Transitions • Gestures • It's the wild-west for hybrid apps • We need to bridge the gap between web and native • We need rich, native-style UI components and interactions • We need UI APIs, not just jQuery widgets
  7. 7. Hybrid Mobile development rocks @juarezpafhttp://ionicframework.com/
  8. 8. Hybrid Mobile development rocks @juarezpafhttp://ionicframework.com/docs/guide/preface.html
  9. 9. Hybrid Mobile development rocks @juarezpafhttp://ionicframework.com/ MIT LICENSED Free to use (even commercially)
  10. 10. $ npm install -g cordova ionic $ npm install -g install ios-sim Hybrid Mobile development rocks @juarezpafhttp://ionicframework.com/docs/guide/installation.html How to install Ionic?
  11. 11. What about Windows? Hybrid Mobile development rocks @juarezpafhttp://bit.ly/visual-studio-2015-rc-tools
  12. 12. $ ionic start myApp Hybrid Mobile development rocks @juarezpafhttp://ionicframework.com/docs/cli/start.html
  13. 13. $ ionic serve Hybrid Mobile development rocks @juarezpafhttp://ionicframework.com/docs/cli/test.html $ ionic platform add ios $ ionic platform add android
  14. 14. Hybrid Mobile development rocks @juarezpafhttp://ionicframework.com/docs/components/ Ionic CSS Components
  15. 15. Hybrid Mobile development rocks @juarezpafhttp://ngcordova.com
  16. 16. Ionic Lab Hybrid Mobile development rocks @juarezpafhttp://ionicframework.com/blog/ionic-lab/ $ ionic serve ——lab
  17. 17. Ionic Crosswalk Integration Hybrid Mobile development rocks @juarezpafhttp://ionicframework.com/blog/crosswalk-comes-to-ionic/ $ ionic browser add crosswalk $ ionic run android
  18. 18. http://blog.ionic.io/ionic-platform-services-making-development-easier/
  19. 19. https://apps.ionic.io/
  20. 20. http://blog.ionic.io/announcing-the-new-ionic-creator/
  21. 21. http://usecreator.com/
  22. 22. http://view.ionic.io/
  23. 23. http://ionicframework.com/blog/view-app-is-alive/ 23eace9f
  24. 24. Ionic Playground, a fun new tool that makes it incredibly easy to build Ionic apps and demos in the browser. Hybrid Mobile development rocks @juarezpafhttp://play.ionic.io/
  25. 25. Hybrid Mobile development rocks @juarezpafhttps://twitter.com/_AmitYadav/status/596034526486335488
  26. 26. Hybrid Mobile development rocks @juarezpafhttp://blog.ionic.io/the-ionic-playground/
  27. 27. Hybrid Mobile development rocks @juarezpafhttp://lab.ionic.io
  28. 28. http://blog.ionic.io/announcing-ionic-lab-mix-it-up-with-our-new-gui-tool/
  29. 29. Hybrid Mobile development rocks @juarezpafhttp://docs.ionic.io/docs/push-from-scratch
  30. 30. Hybrid Mobile development rocks @juarezpafhttp://docs.ionic.io/docs/push-overview
  31. 31. Hybrid Mobile development rocks @juarezpafhttp://devdactic.com/ionic-push-notifications/
  32. 32. http://blog.ionic.io/optimize-your-apps-growth-with-ionic-analytics-now-in-alpha/
  33. 33. Hybrid Mobile development rocks @juarezpafhttp://docs.ionic.io/v1.0/docs/deploy-from-scratch
  34. 34. Hybrid Mobile development rocks @juarezpafhttp://blog.ionic.io/announcing-ionic-1-0/
  35. 35. Hybrid Mobile development rocks @juarezpafhttp://showcase.ionicframework.com/
  36. 36. Hybrid Mobile development rocks @juarezpafhttp://blog.ionic.io/learning-ionic-in-your-living-room/
  37. 37. Hybrid Mobile development rocks @juarezpafhttp://www.appcamp.io/
  38. 38. http://bit.ly/ionic-adventures The ultimate guide to learn Ionic Framework and be tuned in to
  39. 39. Hybrid Mobile development rocks @juarezpafhttps://twitter.com/juarezpaf/status/625711814102360064
  40. 40. Hybrid Mobile development rocks @juarezpafhttps://twitter.com/demianborba/status/631867909564841985
  41. 41. http://devblog.blackberry.com/2015/08/ionic-adventures-the-ultimate-guide-to-learn-ionic/
  42. 42. Hybrid Mobile development rocks @juarezpafhttps://github.com/IonicBrazil/guia-do-desenvolvedor
  43. 43. Hybrid Mobile development rocks @juarezpafhttps://github.com/IonicBrazil/guia-do-desenvolvedor
  44. 44. Hybrid Mobile development rocks @juarezpafhttps://gitter.im/driftyco/ionic
  45. 45. Hybrid Mobile development rocks @juarezpafhttp://forum.ionicframework.com/
  46. 46. Hybrid Mobile development rocks @juarezpafhttp://ionicworldwide.herokuapp.com/
  47. 47. http://blog.ionic.io/introducing-the-ionic-market-buy-and-sell-ionic-starters-plugins-and-themes/
  48. 48. http://market.ionic.io/ Hybrid Mobile development rocks @juarezpaf
  49. 49. http://blog.ionic.io/ionic-and-the-internet-of-things/ Hybrid Mobile development rocks @juarezpaf
  50. 50. http://blog.ionic.io/ionic-and-the-internet-of-things/ Hybrid Mobile development rocks @juarezpaf
  51. 51. http://blog.ionic.io/ionic-and-the-internet-of-things-part-2 Hybrid Mobile development rocks @juarezpaf
  52. 52. http://blog.ionic.io/built-with-ionic-bitcoin-apps/
  53. 53. https://twitter.com/jthake/status/656398834868842496
  54. 54. http://ionic.io/2 Hybrid Mobile development rocks @juarezpaf
  55. 55. http://ionicframework.com/docs/v2/
  56. 56. http://ccoenraets.github.io/es6-tutorial/
  57. 57. Totally awesome!
  58. 58. Yaaaay! Let’s create amazing apps with Ionic Hybrid Mobile development rocks @juarezpafhttps://ionicframework.com

×