มาเริ่มต้นสร้างแอพฯ แบบ Cross platform ด้วย Ionic Framework กันเถอะ
Cross platform คืออะไร ?
Cross platform คือระบบปฏิบัติการที่สามารถทำงานได้หลายแพลตฟอร์ม Cross platform เรียกกันอีกอย่างว่า Hybrid Mobile App เช่น ซอฟต์แวร์สามารถรันในระบบ windows บนสถาปัตยกรรม x86
Ionic Framework คืออะไร ?
Ionic Framework คือเครื่องมือในการสร้าง HTML , CSS และ JavaScript เพื่อใช้ในการสร้าง Mobile Application ซึ่งสามารถใช้งานได้ค่อนข้างง่าย Ionic Framework เป็นเครื่องมือสร้างแอพมือถือที่สามารถสร้างทีเดียว สามารถใช้งานได้บนระบบปฏิบัติการ iOS, Android และ Windows ซึ่งก็จะใช้งานร่วมกับ Framework ตัวอื่น ๆ ได้ คือ Angular และ Apache Cordova ในตอนสุดท้ายเพื่อให้ทั้งแอพที่เขียนมาใช้ได้กับทุกระบบปฏิบัติการนั้นเอง
ต้องเริ่มยังไงจะสร้างแอพได้
- ติดตั้ง Node JS
สามารถดาวน์โหลดตัวติดตั้งได้ที่ www.nodejs.org แนะนำให้เป็นตัว LTS Recommended For Most Users
2. ติดตั้ง Cordova CLI และ Ionic Framework โดยการเปิด Command Prompt
คำสั่งในการติดตั้งให้พิมพ์
สำหรับ Cordova : npm install -g cordova
สำหรับ Ionic : npm install -g ionic
การติดตั้งชุดคำสั่ง Cordova และ Ionic นี้จะใช้เวลาพอสมควร
**หากต้องการ Test ดูก็ใช้คำสั่ง ionic ใน command prompt จะแสดงดังรูปตัวอย่าง
3. เมื่อต้องการสร้างโปรเจค ใช้คำสั่ง “ionic start myApp blank” บน command prompt ในการสร้างโปรเจคเริ่มต้นสามารถสร้างได้ 3 รูปแบบ
**myApp คือชื่อ โฟลเดอร์ สามารถใช้ชื่ออะไรก็ได้ตามใจชอบเลยครับ
**ชุดคำสั่งแต่ละรูปแบบจะอยู่ใต้รูป
สำหรับคนที่เพิ่งเริ่มต้นเลย ผมแนะนำให้สร้างแบบ blank ครับ จะเป็นหน้าเปล่า ๆ มาให้แล้วค่อยมาสร้าง layout ตามที่เราต้องการ
4. สร้างโปรเจคเสร็จแล้ว สามารถใช้คำสั่งในการรันโปรเจค
“cd myApp” เข้าไปในโฟลเดอร์ที่เราสร้าง
“ionic serve” คำสั่งนี้จะแสดงบน browser
“ionic serve -lab” คำสั่งนี้จะแสดงบน browser สามารถเลือกแสดงได้ทั้ง iOS Android และ Windows และเป็นหน้าตาที่ใกล้เคียงที่สุดเมื่อ build เป็น apk
เมื่อติดตั้งเสร็จจะได้ไฟล์ดังนี้ ส่วนโค้ดที่ต้องใช้ก็อยู่ใน src ครับ
เท่านี้เราก็จะได้แอพของเราแล้ว สำหรับการทำงานของ code ก็สามารถใช้ editor ที่เราถนัด สำหรับผมใช้ Visual Studio Code เพราะสามารถเลือกเพิ่ม Extensible ตัวช่วยเสริมได้เยอะเลยครับ
ที่ผมเลือกใช้ Ionic ก็เพราะว่าคอมผมสเปกต่ำ ลองใช้ Android Studio แล้วคอมผมช้ามาก ๆ (กินแรมเยอะ) ผมได้ทำโปรเจคขึ้นมา ก่อนเริ่ม Ionic ผมได้ใช้ Framework ตัวอื่นพัฒนาซึ่งเป็น Framework ตัวเก่าฟังก์ชันในการทำงานที่ไม่ค่อยโอเคเท่าไหร่ เลยปรึกษากับคนอื่น ๆ ดูก็ได้คำแนะนำมาใช้ Ionic นี่แหละครับก็ถือว่าการทำงานของมันก็โอเคเลยแหละครับ สำหรับ Ionic ก็เป็นอีกทางเลือกหนึ่งของคนที่อยากสร้างแอพตามกำลังคอมที่ใช้อยู่
ลิงก์ศึกษาเพิ่มเติม :
-ionic framework
-Visual Studio Code
