What is Ionic Framework? Why use Ionic Framework?

I introduce the Ionic Framework and talk about what the Ionic Framework can do, the merits and how much it is used.

Transcript

1. What is Ionic Framework? Why use Ionic Framework? k-kuwahara @kuwahara_jsri clown0082
2. Who I am
3. Basic Information const my_info = { Name: ‘܂ݪ੟ਔ’, Home: ‘૔ෑ, ޿ౡ’, Interest: ‘όεέ, কع, ೔ຊञ’, Workplace: ‘Yumemi, Inc.’, Skillset: ‘JS, Node.js, PHP, Ruby’ }
4. Communities collaborator translator staff staff
5. Communities github.com/k-kuwahara
6. Let’s start the today’s Ionic talks !!
7. In the past: Web First ↓ Currently: Mobile First
8. Mobile First …?
9. Mobile First …? It’s Responsive!!
10. Mobile First = Responsive
11. Mobile First = Responsive ×
12. Mobile First ⊃ Responsive
13. Mobile First is … Optimizing UI/UX design for mobile
14. Mobile first example ‣ Design tailored to each terminal
15. Mobile first example 'JSTU
    1BJOU 'JSTU
    $POUFOUGVM
    1BJOU 'JSTU
    .FBOJOHGVM
    1BJOU 'VMMZ
    -PBEFE ‣ First view optimized for mobile
16. For more mobile first ⚡AMP (Accelerated Mobile Pages) PWA (Progressive Web Apps)
17. ‣ Served over HTTPS PWA examples ‣ Add to home screen APP
18. PWA examples ‣ Offline Experience ‣ Push Notifications
19. 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
20. Web with PWA ≒ Mobile Application
21. In recently years, Develop applications with HTML5
22. So, how about “Ionic Framework” ?
23. What is “Ionic Framework”?
24. What is “Ionic Framework” ? image by: https://ionicframework.com/
25. What is “Ionic Framework” ? image by: https://ionicframework.com/
26. What is “Ionic Framework” ? +
27. What is “Ionic Framework” ? Android iOS Web
28. What is “Ionic Framework” ? Android iOS Web
29. What is “Ionic Framework” ? UI Base WebView
30. What is “Ionic Framework” ? UI Base WebView Ionic Native Native API Cordova API
31. Q. How much is Ionic framework used?
32. Google Trends
33. Google Trends (In Japan)
34. Qiita
35. Q. How do we get started?
36. Step1: install nodejs Please install
37. Step2: execute the following commands
38. For example
39. Step3: place component in html file image by: https://ionicframework.com/docs/components/
40. Step4: write the logic to the ts file
41. Q. What are the features of Ionic framework?
42. 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
43. Q. But, it's really difficult, isn’t it?
44. A. It is roughly No. (The difficult point is Angular)
45. Application Example: ʮϗ΢Ϗϯΰʯ Web URL: https://app.houbingo.com App URL : https://play.google.com/store/apps/details?id=com.houbingo
46. This app was developed by a designer about 3 days.
47. with this book ↓
48. Let’s Create Mobile Application by Ionic Framework!!