▸ Software Engineer @ MC
▸ I <3 Open Source
▸ I Advocate Open Source.
▸ Web Development is my main area
▸ GDG serial speaker / volunteer.
▸ Originally from Mansoura
3. WHAT TO EXPECT?
▸ Why not Hybrid?
▸ An introduction to ionic framework.
▸ Quick AngularJS introduction.
▸ A quick start guide.
▸ Small app
▸ Tips and tricks for ionic.
▸ Resources and Summary.
6. SOUNDS COOL WHAT IS IT ?
▸ Ionic is the missing piece.
▸ Ionic’s ultimate goal is to make it easier to develop native
mobile apps with HTML5, also known as Hybrid apps.
▸ It’s not replacement for Cordova / phoneGap.
▸ It’s not replacement for your JS framework.
▸ It’s not a css framework also but it did/ is doing pretty
much the same what Twitter Bootstrap did to web.
7. SOUNDS COOL WHAT IS IT ?
NO REALLY, WHAT’S IONIC
▸ Ionic is open source.
▸ Ionic is wrapper for Cordova.
▸ Ionic is utilising AngularJS specially in 2-way data binding, routing,
directives, etc.. to make the user experience more standard and user friendly.
▸ Ionic look and feel is so native specially for iOS7+.
▸ Ionic provides a toolset for developers and designers to do a quick yet
icon set, different view types, etc..
▸ Ionic utilises great pool of ngCordova plugins that interacts with device
sensors like camera, GeoLocation, etc..
8. BEFORE WE START
QUICK ANGULARJS INTRODUCTION
▸ AngularJS by Google
▸ Session of last year’s DevFest by
▸ 2-way binding.
▸ Dependency Injection.
9. IT’S IONIC TIME
GETTING STARTED WITH IONIC
▸ npm install -g cordova ionic
▸ npm install ios-sim
▸ yo ionic #for Yeoman people
▸ ionic platform add <platform name>
▸ ionic build # just for building
▸ ionic emulate #emulator / simulator
▸ ionic run #device test
11. SAVE SOME SEARCH TIME
TIPS AND TRICKS
▸ Use proxies whenever you interact
with APIs to avoid CORS.
▸ Run ionic serve -cls to have console
▸ Always test on device.
▸ Use the xcode project to run on