This document discusses the goals and plans for Sprint #0 of a mobile app project using the Ionic framework. It introduces Ionic, AngularJS, and Cordova, explaining what they are and how they can be used together. It provides tutorials and code snippets for setting up projects with these technologies. The document also lists some additional tools that could be useful, such as Ionic View, Ionic Creator, Ionic Playground, and ngCordova.

1. Listfy Sprint #0

2. I am ridermansb
I'm curious, enthusiastic and student most of
the time, like the rest of the time to write code.
You can find me at @ridermansb
Hello!

3. Sprint #0 ?
It’s for eat?
1

4. “
PO terá tempo suficiente para organizar da
melhor forma possível o Product Backlog...

5. “
forma de conciliar o trabalho da equipe de
desenvolvimento com o do PO...

6. “
Scrum team might be assembled and technical issues
like hardware, software and colocation issues sorted
out....

7. Any questions ?
You can find me at
◉ @ridermansb
◉ ridermansb@gmail.com
Thanks!

8. Let's start!
This is not what it seems

9. Sprint #0 !0
Or nearly that...

10. What's the problem?
◉ Skill..
◉ Prove a theory..
Goal?
◉ Just for fun...
… always program for fun!
◉ Money…

11. An app to manage shopping
lists
Shopping list and products shared
Native of course!Native of course!

12. Endless war
It should not be a war

13. Hybrid project
◉ Theory easier,
faster and tastier to
develop
◉ Skill angular, ionic
and cordova

14. Where we can begin ...
Learn BuildPlan

15. Learn
Cordova… Angular... Ionic ...

16. Cordova
What is it? What I learned?
1
◉ Originally PhoneGap
◉ Html5, CSS3 and JS
◉ Plugins based
Apache Cordova is a platform for
building native mobile applications using
HTML5, CSS and Javascript.

17. Can I use HTML5, JS and CSS libraries I use everyday

18. Re-use existents web frameworks/skills

19. Cordova for dummies
◉ npm install -g cordova
◉ cordova create hello net.take.hellocordova HelloCordova
◉ cordova
o platform add android
o plugin search camera apache
o plugin add org.apache.cordova.camera
o build android
o emulate/run android

20. AngularJS
What is it? What I learned?
3
Open-source web application framework
maintained by Google and by a community to
address many of the challenges encountered in
developing SPA.
◉ Improve the testability
◉ Encourage good programming practices
◉ by Google
http://bit.ly/1IV2zfd
Wikipedia: bit.ly/1FaUNrf

21. Angular's Adoption bit.ly/1epOiKy

44. So what?I need all this?

45. Benefits
◉ A declarative user interface
◉ Great separation of concerns
◉ DOM manipulations where they belong
◉ Unit/e2e testing ready (using Karma/Protractor)
from http://www.sitepoint.com/10-reasons-use-angularjs/

46. Ionic Framework
What is it? What I learned?
2
◉ Alpha: November 2013
◉ Beta: March 2014
◉ 1.0.0 (uranium-unicorn): May 2015
Offers a library of mobile-optimized
HTML, CSS and JS components for
building highly interactive apps. Built with
Sass and optimized for AngularJS.

47. 16,500+Github Stars
Top 50Most starred Github repos
400,00+Apps have been started from CLI
2,300+CLI averages downloads/day
100%
Top 10Trending JS Github repos
Success!
Ionic's Adoption

48. Ionic for dummies
◉ npm install -g ionic
◉ ionic start myapp sidemenu
◉ ionic
o platform add android
o plugin add org.apache.cordova.camera
o emulate/run android
o server --lab
`ionic server` it allows you to edit code in www and see it reflected immediately.
And by immediately, I mean immediately.

49. Show me something
◉ List Directive
◉ Tabs Example
◉ Ionic Actionsheet
◉ Pull to Refresh

50. And has more ...
Ionic View App
It allows you to easily view, share,
and test the Ionic apps round the
world, all without ever going
through the App Store.
Ionic Creator
Lets you rapidly mockup and
prototype a real mobile app in
minutes. Best of all, it's totally
free.
Ionic Playground
A new tool that makes it incredibly
easy to build Ionic apps and demos
in the browser, without having to
install anything.
Crosswalk
● Android < 4.4 use Android's no named default
browser
○ which is slower and less compliant than
Chrome.
● Specify version of Chrome to run your App.
● Up to 10x performance increase
● App will grow ~10-15 mb in size.
From: http://slides.com/digitaldrummerj/ionic-framework#/49
ngCordova
Is a collection of 63+ AngularJS extensions on top of
the Cordova API that make it easy to build, test, and
deploy Cordova mobile apps with AngularJS.

51. Push Notification
Easily send any user on any
platform dynamic push
notifications using our simple API.
No more running your own servers
or dealing with platform protocols.
And more… ufaa..
Ionic Lab
● Simplify testing against
multiple platforms
● Side by Side view of
Android and iOS Phone
● Supports Live Reload

52. Any questions ?
You can find me at
◉ @ridermansb
◉ ridermansb@gmail.com
Thanks!