Sani Yusuf PRO
Founder Of Haibrid. Co-Organiser Of Ionic UK. I Am Good At Making You Want To Use Ionic.
Building Mobile Apps Progressively With Ionic
Shalom
Sani Yusuf
- Founder Of Haibrid
- Co-Organiser Of Ionic-UK
- Author & Trainer
- Recently Traveled The World
- Big Fan Of Avatar Movie
@saniyusuf
Why Am I Here?
-
IOS App
- Android App
- Windows App (Yes Still Alive)
- Progressive Web App
All With One Code Base
To Show You How You Can Use Ionic To Create:
That's 4 Apps In One
Let Me Show You
An open source SDK that lets web developers build mobile applications
It's Really Just Web
Built On Top Of Angular
How It All Fits
Native App Container
WebView
Angular
Ionic
Your App's <code>
Cordova
Device Features
Let's See Some Features Of Ionic
Native Esque Components
- Performant Components
- Modelled Off Native SDKs
- Ionicons Library
- Semantic & Extensible
<ion-header>
<ion-navbar>
<ion-title>Angular UP</ion-title>
</ion-navbar>
</ion-header>
<ion-content>
{{firstName}} {{lastName}}
</ion-content>Push/Pop Navigation
- Custom & Stack Based
- Mimics Native Routing
- Supports Deep-Linking
- Every @Component Treated As a Page
pushSettings() {
this.nav.push(Settings);
}
goBack() {
this.nav.pop();
}
resetHome() {
this.nav.setRoot(Home);
}
Fully Featured CLI Tool
- SASS Compilation
- Build Bundling
- Happy Marriage With Cordova
- Typescript Transpilation
- Scaffolding
- Kick Ass Error Reporting
Awesome Huge Community
- 26,000+ Stars On Github
- Almost 9000 Slack Members
- Active Forum
- Global Community With Over 100 Groups
Configurable & Customisable
- Customise with SASS to match your brand
-
- Every Feature Is Configurable
- Component Level
- Platform Level
- Global Level
- Every Feature Is Configurable
Right To Left Support
-
One Line Activation
-
Affects Orientation Of Components
תל אביב יא חביבי תל אביב
Now Let's Talk Progressive Web Apps
What Is A Progressive Web App?
- Offline First
- Manifest.JSON & Service Worker
- Full-Screen Mode
- Home Screen Icon
- No App Stores
- Chrome Only For Now
Telavivo APP
- Demo App For Tourists In Israel
- Contains Useful Tourist Questions
- Listen To Israeli' Music
- Hebrew Translation & RIght To Left Support
https://github.com/saniyusuf/telavivo
http://bit.do/telavivo
DEMO IS COMING
I Will Show You The Telavivo App Built With Ionic Running On IOS, Android & Progressive Too
Telavivo Preview
try to turn the wifi off and play the music video on the music tab
http://bit.do/telavivo
That Was Awesome
Great Things To Be Aware Of
Ionic Cloud
Push Notifications
Auth
Analytics
Deploy
Package
DB (Coming Soon)
Ionic View App
- Available On IOS & Android
- Test On Real Device
- Share With Anyone
- No More Long Waits For New Build
- No Need For IOS/Android Certificates
- No Need For Testflight
http://view.ionic.io
Parting Words
-
Now You Can Have One Project But 4 Mobile Solutions
-
100% Code Re-Use
-
Cost Effective & Time Conscious
-
Focus Less On The How To Do & More On Doing The To-DO
-
A Win For The Web Is A Win For Us All
Join Ionic Israel
Get Started Today
Find Me Online
@saniyusuf
Abeg Una Get Question?
Nigerian For Any Questions?
Building Mobile Apps Progressively With Ionic
By Sani Yusuf
Building Mobile Apps Progressively With Ionic
With multiple competing mobile eco systems to worry about, it is always important to choose an efficient solution for creating your mobile Apps With the exciting prospects of Progressive Web Apps taking the web & mobile web world by storm, it can be quite challenging to fit a current mobile setup to work with Progressive Web Apps This talk will showcase how you can create a mobile app for Android, IOS, Windows with 100% the same code & same project and still have it work as a Progressive Web application without any change
