Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Introduction to Ionic Framework
Search
landish
September 18, 2015
Programming
0
90
Introduction to Ionic Framework
landish
September 18, 2015
Tweet
Share
More Decks by landish
See All by landish
Anatomy Of The Web
landish
1
180
Markdown
landish
0
150
PHPUnit
landish
0
98
Some Modern Tools for Developers
landish
0
130
Introduction to GIT
landish
0
54
Other Decks in Programming
See All in Programming
フロントエンドのmonorepo化と責務分離のリアーキテクト
kajitack
2
140
Understanding Ruby Grammar Through Conflicts
yui_knk
1
140
【第4回】関東Kaggler会「Kaggleは執筆に役立つ」
mipypf
0
900
AIでLINEスタンプを作ってみた
eycjur
1
210
Namespace and Its Future
tagomoris
6
580
Kiroの仕様駆動開発から見えてきたAIコーディングとの正しい付き合い方
clshinji
1
160
TanStack DB ~状態管理の新しい考え方~
bmthd
2
340
Flutter로 Gemini와 MCP를 활용한 Agentic App 만들기 - 박제창 2025 I/O Extended Seoul
itsmedreamwalker
0
150
MCPで実現するAIエージェント駆動のNext.jsアプリデバッグ手法
nyatinte
7
940
GitHub Copilotの全体像と活用のヒント AI駆動開発の最初の一歩
74th
8
3.2k
Google I/O recap web編 大分Web祭り2025
kponda
0
2.9k
LLMOpsのパフォーマンスを支える技術と現場で実践した改善
po3rin
8
990
Featured
See All Featured
Speed Design
sergeychernyshev
32
1.1k
Mobile First: as difficult as doing things right
swwweet
223
9.9k
What's in a price? How to price your products and services
michaelherold
246
12k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.9k
Designing for humans not robots
tammielis
253
25k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
8
480
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
Build The Right Thing And Hit Your Dates
maggiecrowley
37
2.8k
Raft: Consensus for Rubyists
vanstee
140
7.1k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Building Applications with DynamoDB
mza
96
6.6k
Music & Morning Musume
bryan
46
6.8k
Transcript
None
IONIC Advanced HTML5 Hybrid Mobile App Framework On top of
AngularJS and ngCordova
WTF IS NGCORDOVA? CORDOVA WITH THE POWER OF ANGULARJS (
63+ extensions )
OK, BUT WTF IS CORDOVA? Apache Cordova is a platform
for building native mobile applications using HTML, CSS and JavaScript.
NGCORDOVA FEATURES OAUTH CAMERA TOUCH ID PUSH NOTIFICATIONS GEOLOCATION PROGRESS
INDICATOR
IONIC FEATURES • Performance - no jQuery • Native Focused
• Beautiful Design • Powerful CLI - I mean, really powerful ;)
IONIC CLI COMMANDS • ionic start [appName] tabs (—no-cordova) •
ionic serve (—livereload & —lab) • ionic platform [ios android] • ionic run/emulate • ionic resources (splash screen generator) • ionic setup sass • ionic upload • ionic help - the most important
BUT, FIRST… npm install -g cordova ionic INSTALL IONIC
IONIC RESOURCES • CSS Components • Javascript API • Custom
Icons • HTML5 Input Types
CSS COMPONENTS • Header, Footer, Content • Forms • Lists,
Cards • Tabs, Buttons • Grid • More …
JAVASCRIPT API • Action Sheet • Gestures and Events •
Sidebar Menu, Slider • Pull to Refresh, Infinite Scroll • Modal, Popup, Loading • More …
HTML5 INPUT TYPES • Email • Tel • Search •
Number • Date / Month • Password • Url ?
CUSTOM ICONS (700+) Just visit http://ionicons.com/
IONIC SERVICES - IONIC.IO • Creator - http://creator.ionic.io • View
- http://view.ionic.io • Playground - http://play.ionic.io • Market - http://market.ionic.io/ (coming soon)
IONIC DIRECTORY STRUCTURE • /hooks - (ng)Cordova custom commands •
/platforms - IOS, Android • /plugins - ngCordova plugins • /resources - Icon & Splash images • /scss - SASS stylesheet files • /www - ROOT directory • /www/lib - Bower packages
THAT’S IT!