1. Hybrid Apps with Angular &
Ionic Framework
<cihad-horuzoglu>

2. Cihad Horuzoğlu
Front-end & Mobile Developer
at CicekSepeti.com
@cihadhoruzoglu
http://cihadhoruzoglu.com

3. Do you need a mobile app?

4. More Platforms, More Problems

5. Native Apps
● Platform specific
● Respective development tools
● Best performance
● Time consuming
● Expensive development

6. Want to support all major platforms
even mobile web?

7. You need cool web technologies..

8. Hybrid Apps
● Platform independent (iOS, Android etc.)
● HTML5, CSS3 & JS
● Limited performance
● Quick development
● Direct access to native APIs with Cordova

9. Apache Cordova is a platform for building native
mobile applications using HTML, CSS and
JavaScript

10. ● Battery Status
● Camera
● Contacts
● Device
● Device Orientation
● Dialogs
● File Transfer
● Geolocation
● Globalization
● In-App Browser
● Media Capture
● Network Information
● Splashscreen
● Statusbar
● Vibration
Platforms
● Amazon Fire OS
● Android
● Bada
● Blackberry
● FirefoxOS
● iOS
● Mac OS X
● Qt
● Tizen
● Ubuntu
● WebOS
● Windows (desktop)
● Windows Phone 7
● Windows Phone 8
● Browser
Plugins

11. What is Angular JS?

12. Superheroic JavaScript MVW Framework.
Angular Provides; Directives, Filters, Two way data binding,
Services, DI & Testability

13. What is Ionic?

14. An open source framework for developing
hybrid mobile apps with Angular, Sass and
Cordova

17. Ionic solves multiple device
resolution issues

25. Routing in Ionic

26. ion-content with ion-list

27. also you need a good friend..

28. Chrome Developer Tools

30. Install Ionic & Cordova Globally
$ npm install -g ionic cordova

31. Ionic Templates

32. $ ionic start yourProject sidemenu
template name
Clone demo project
project name & folder

33. Add Platform, Build & Emulate
$ ionic platform add ios
$ ionic build ios
$ ionic emulate ios
$ ionic serve

34. Let’s build..

35. Q & A

36. Thank you.
Image source: ionicframework.com <cihad-horuzoglu />