របៀបតម្លើង ionic ក្នុង windows

មាតិកា

1. សេចក្តីផ្តើម
2. គោលបំណង
3. តម្រូវការ
4. ជំហានទី១៖ តម្លើង NodeJs
5. ជំហានទី២៖ បង្កើត Apps

1. សេចក្តីផ្តើម

Ionic គឺជា open source framework ដែលត្រូវបានប្រើសម្រាប់ធ្វើការ develop នូវ mobile applications។ វាផ្តល់នូវ tools ហើយនិង services មួយចំនួនសម្រាប់ធ្វើការ build នូវ mobile UI អោយមានភាពងាយស្រួលសម្រាប់ users (native look and feel)​។

2. គោលបំណង

ក្រោយពីសិក្សាតាម Tutorial នេះ លោកអ្នកនឹងយល់អំពី

• របៀប install ionic
• យល់ដឹងអំពី របៀប run app
• យល់ដឹងអំពីការបង្កើត App

3. តម្រូវការ

ដើម្បីអាចធ្វើការជាមួយ ionic framework Project បានយើងត្រូវមាន

• Browsers (Firefox, Chrome, …)
• Internet Connection
• NodeJs installation
• Command Prompt (cmd) ឬក៏ GitBash

4. ជំហានទី១៖ តម្លើង NodeJs

ចូលទៅ Download និង install the latest LTS NodeJS តាម link ខាងក្រោម

https://nodejs.org/en/

• ក្រោយពី download និង install nodejs ចប់សព្វគ្រប់
• សូមចូលទៅកាន់ gitbash ឬក៏ Command Prompt (cmd)
• វាយ command “npm install –g ionic cordova” ដើម្បីធ្វើការ install នូវ global dependencies
  • ចំណាំ៖ command ខាងលើនឹងធ្វើការ installនូវ latest version របស់ ionic ហើយនិង cordova

 

5. ជំហានទី២៖ បង្កើត Apps

ដើម្បីបង្កើត Project ជាមួយ ionic យើងមាន options ចំនួនបីយ៉ាងគឺ៖

• Tabs App
• Blank App
• Side menu app

1. ការបង្កើត project ជាមួយ Tabs App

• សូមវាយ command​ ខាងក្រោម៖
  • ionic start myApp tabs
  • សូមចូលទៅកាន់ project app directory
  • វាយ cd myApp
  • សូមធ្វើការ add Cordova project សម្រាប់ Android Platform ព្រមទាំង install basic Cordova plugins ផងដែរ។ កូដខាងក្រោមអនុញ្ញាតអោយយើងធ្វើការ​ run app នៅលើ​ Android emulator ឬមួយក៏ deviceផ្ទាល់តែម្តង។
  • វាយ ionic platform add android
  • បន្ទាប់មកទៀតសូមធ្វើការ build app ដើម្បី check មើលថាតើមាន error ក្រោយពី run នូវ​ command ខាងក្រោម
  • វាយ ionic build android
    • ជាចុងក្រោយសូមធ្វើការ run app របស់អ្នក ដោយត្រូវ connect ជាមួយ mobile device ឬក៏​ default emulator ។
    • វាយ ionic run android
  • ម្យ៉ាងវិញទៀត យើងក៏អាចធ្វើការ Run app នៅលើ browsers ក៏បានដែរ ហើយវាមានភាពងាយស្រួលសម្រាប់ developer ផងដែរ។
  • វាយ ionic serve
  • លទ្ធផល

2. ការបង្កើត project ជាមួយ Side Menu App

• • C:\Users\Username\Desktop> ionic start myApp sidemenu
  • C:\Users\Username\Desktop> cd myApp
  • ដើម្បីធ្វើការ run ជាមួយ browsers chrome
  • C:\Users\Username\Desktop\myApp> ionic serveរបៀបបង្កើត app project មានលក្ខណៈដូចខាងលើ
  • នៅលើ Google Chrome វា​បានផ្តល់នូវ device mode functionality for mobile development testing ដោយគ្រាន់តែចុច F12 ដើម្បី access the developer console

3. ការបង្កើត project ជាមួយ Blank App

• របៀបបង្កើត app project មានលក្ខណៈដូចខាងលើ
• C:\Users\Username\Desktop> ionic start myApp blank
• C:\Users\Username\Desktop> cd myApp
• C:\Users\Username\Desktop\myApp> ionic serve
• លទ្ធផល