How to make it PWA?
See “Progressive Web App Checklist”.
URL: https://developers.google.com/web/progressive-web-apps/checklist
See “Your First Progressive Web App”.
URL: https://codelabs.developers.google.com/codelabs/your-first-pwapp/
index.html?index=..%2F..%2Findex#0
Slide 20
Slide 20 text
Web with PWA
≒
Mobile Application
Slide 21
Slide 21 text
In recently years,
Develop applications with HTML5
Slide 22
Slide 22 text
So, how about
“Ionic Framework” ?
Slide 23
Slide 23 text
What is “Ionic Framework”?
Slide 24
Slide 24 text
What is “Ionic Framework” ?
image by: https://ionicframework.com/
Slide 25
Slide 25 text
What is “Ionic Framework” ?
image by: https://ionicframework.com/
Slide 26
Slide 26 text
What is “Ionic Framework” ?
+
Slide 27
Slide 27 text
What is “Ionic Framework” ?
Android iOS Web
Slide 28
Slide 28 text
What is “Ionic Framework” ?
UI
Base
WebView
Slide 29
Slide 29 text
What is “Ionic Framework” ?
UI
Base
WebView
Ionic Native
Native API
Cordova API
Slide 30
Slide 30 text
Ionic v4
+
other frameworks
Slide 31
Slide 31 text
Ionic + other frameworks
+
Slide 32
Slide 32 text
Ionic + other frameworks
+
Slide 33
Slide 33 text
Q. How do we get started?
Slide 34
Slide 34 text
Step1: install nodejs
Please install
Slide 35
Slide 35 text
Step2: execute the following commands
Slide 36
Slide 36 text
For example
Slide 37
Slide 37 text
Step3: place component in html file
image by: https://ionicframework.com/docs/components/
Slide 38
Slide 38 text
Step4: write the logic to the ts file
Slide 39
Slide 39 text
See also: for details
URL: https://qiita.com/clown0082/items/5405c53eb955f985edda
Slide 40
Slide 40 text
Q. What are the features
of Ionic framework?
Slide 41
Slide 41 text
Summary of Ionic features
1. PWA(by default)
2. It's fun to develop
3. Support of slack is profound
4. Clean, simple, and functional
5. Abundant API to native function
Slide 42
Slide 42 text
Q. But, it's really difficult, isn’t it?
Slide 43
Slide 43 text
A. It is roughly No.
(The difficult point is Angular)
Slide 44
Slide 44 text
Application Example: ʮϗϏϯΰʯ
Web URL: https://app.houbingo.com
App URL : https://play.google.com/store/apps/details?id=com.houbingo
Slide 45
Slide 45 text
This app was developed by
a designer about 3 days.
Slide 46
Slide 46 text
with this book ↓
Slide 47
Slide 47 text
Let’s Create Mobile Application
by Ionic Framework!!