Ionic Framework

เริ่มต้นเขียน Mobile App ด้วย ionic ตอนที่ 1

Posted On กุมภาพันธ์ 10, 2019 at 9:23 am by / ปิดความเห็น บน เริ่มต้นเขียน Mobile App ด้วย ionic ตอนที่ 1

เริ่มต้นเขียน Mobile App ด้วย ionic ตอนที่ 1

ก่อนอื่น มาทำความรู้จักก่อนว่า ionic คืออะไร

ionic เป็น framework สำหรับพัฒนา mobile app ซึ่งมันสามารถ build ให้ทำงานได้ทั้งบนระบบปฏิบัติการ android และ บน ios  เสียเวลาพัฒนาเพียงแค่ครั้งเดียว เอาไปใช้งานได้อย่างครอบคลุม

 

ionic framework ปัจจุบันคือ version 4 — > https://ionicframework.com/

สโลแกนของเค้าคือ “One codebase. Any platform.”   code อันเดียว ลง platform ไหนก็ได้

ความพิเศษอีกอย่างของ ionic ก็คือ มันสามารถพัฒนา app ได้อย่างรวดเร็ว และ มีความสวยงาม

เริ่มน่าสนใจแล้วใช่มั้ย

ก่อนที่เราจะพัฒนางานด้วย ionic เราจะต้องเตรียมตัว เครื่องมือ และต้องมีความรู้ขั้นพื้นฐานอะไรยบ้าง

  1. ความรู้ด้วยการเขียนเวป html ตอนนี้ก็น่าจะ html 5
  2. การตบแต่งหน้าตาด้วย css  ซึ่งใน ionic จะใช้ชื่อว่า Sass
  3. typescript
  4. angular
  5. javascript

เครืองมือในการพัฒนา

  1. Editor อันนี้แล้วแต่ความถนัด ไม่ว่าจะเป็น Netbean, Visual studio code (Download และติดตั้งได้ที่ https://code.visualstudio.com/ ) , Atom
  2. andriod studio   –> วิธีการติดตั้งน่าจะหาได้ไม่ยาก

ติดตั้ง ionic และ package software อื่น ๆ

มาลุยกันเลย

ก่อนอื่นจะต้องติดตั้ง node.js  เสียก่อน สามารถ download ได้ที่นี่ https://nodejs.org/en/download 
หลังจากติดตั้งเสร็จเรียบร้อย ทำการตรวจสอบ version ของ node.js และ npm ได้ดังนี้
ไปที่ command prompt พิมพ์

ตรวจสอบ version ของ npm (npm จะเป็นตัวที่จัดการเกี่ยวกับ library ต่าง ๆ เราไม่ต้องเข้าไป download ในเวปมาติดตั้งทีละตัว เราสามารถใช้ npm ในการติดตั้ง ลบ package library ต่าง ๆ ได้อย่างสะดวกผ่านทางอินเตอร์เน็ต
เว็บหลักของ npm –> https://www.npmjs.com/

  1. ติดตั้ง ionic

    หมายเหตุ  : สามารถ install แบบระบุ version ได้โดยใช้คำสั่ง “npm install -g ionic@3.2.20” หมายถึง ต้องการติดตั้ง ionic version 3.2.20 เป็นต้น
  2. ติดตั้ง cordova

หากต้องการตรวจสอบ  Environments ต่าง ทำได้โดยใช้คำสั่ง  “ionic info”

พอมาถึงขั้นตอนนี้ เราก็พร้อมที่จะพัฒนาแอพแล้วละครับ …..