PhoneGap/Cordova

วิธีติดตั้ง PhoneGap/Cordova 6 สำหรับ Windows 7, 8 สำหรับการพัฒนา Android Application ด้วย HTML5

เรื่องที่เกี่ยวข้อง - Android, PhoneGap 3, Video, Windows, ติดตั้ง, วิธี

ปรับปรุงล่าสุดปี 2016 รองรับ PhoneGap/Cordova 6, สนใจเรียนออนไลน์กับโค้ชพลคลิกเรียนได้เลย

หน้านี้เป็นวิธีการติดตั้งโปรแกรม เพื่อเตรียมเครื่องสำหรับผู้ใช้ Windows 7 หรือ 8 ในการพัฒนาแอพ Android ด้วย PhoneGap/Cordova 3 และจะทดสอบกับอุปกรณ์ Android ต่างๆ  (*** หลีกเลี่ยงการใช้ Tablet จีน และ Android รุ่นที่ต่ำกว่า 2.3 นะครับ)

สำหรับใครที่เจอปัญหาระหว่างการติดตั้ง ให้ลงไปดูหัวข้อ “ปัญหาที่อาจพบ” ท้ายบทความนะครับ

สำหรับการใช้ PhoneGap หรือ Cordova 4 พัฒนา Android application บนเครื่อง Mac OS X หรือ iOS Application ดูได้จากหน้ารวมบทความนะครับ

เรียนรู้แบบ Workshop เนื้อหาครอบคลุมที่สุดตั้งแต่ Workshop จนถึงโปร!

หลักสูตรออนไลน์ทบทวนกี่รอบก็ได้ สอบถามได้เหมือนเรียนสด เนื้อหาครอบคลุมตั้งแต่สร้าง, ออกแบบ, จนถึงอัพขึ้นแอพสโตร์ กับ PhoneGap/Cordova และ Ionic Framework ล่าสุดปี 2016 ไม่เคยทำแอพก็เรียนได้

1. ติดตั้ง Git สำหรับใช้งาน PhoneGap/Cordova plugin

เราต้องติดตั้งระบบ Git client เสียก่อน สามารถ download ได้จากที่นี่

ดูรายละเอียดการติดตั้งที่ถูกต้องได้จาก video ด้านล่างครับ

2. ติดตั้งชุดคำสั่ง PhoneGap SDK และ Cordova SDK

ขั้นแรกเราต้อง download ชุดคำสั่งเอาไว้ใช้งาน (เรียกว่า SDK) มาติดตั้งในเครื่องก่อน โดยต้องมีการเชื่อมต่อเครื่องที่ติดตั้งเข้ากับ Internet  ขั้นตอนนี้ใช้เวลาในการติดตั้งพอสมควร ขึ้นอยู่กับความเร็ว Internet ครับ

สรุปย่อขั้นตอนในวิดีโอ

  1. ในขั้นตอนแรกสุด เราต้องทำการติดตั้ง NPM (Node Package Manager) (ดาวน์โหลดที่นี่) เพื่อใช้มันดาวน์โหลดชุดคำสั่ง PhoneGap SDK หรือ Cordova SDK มาติดตั้งอีกที
  2. หลักจากติดตั้งแล้ว ให้เปิดโปรแกรม Terminal ขึ้นมาแล้วพิมพ์คำสั่งด้านล่างลงไป แล้วกด enter
    sudo npm install -g phonegap
  3. จะเป็นการสั่งดาวน์โหลดชุดคำสั่ง PhoneGap SDK มาติดตั้งเพิ่มเติม ใช้เวลาพอสมควร
  4. เสร็จแล้ว ให้พิมพ์คำสั่งด้านล่างลงไป และกด enter
    sudo npm install -g cordova

     

  5. จะเป็นการดาวน์โหลดชุดคำสั่ง Cordova SDK มาติดตั้งเพิ่มเติม
  6. ถ้าเสร็จแล้วให้ลองพิมพ์คำสั่งด้านล่าง เพื่อเช็คว่าการติดตั้งสมบูรณ์หรือไม่ โดยคำสั่งจะเป็นการแสดงเลขเวอร์ชั่นของ PhoneGap SDK และ Cordova SDK ขึ้นมาครับ
    phonegap -version // แล้ว enter
    cordova -version // แล้ว enter

     

3. ติดตั้งโปรแกรมที่จำเป็นสำหรับการพัฒนา Android application

สรุปย่อข้อมูลในวิดีโอ

ต้องทำการดาวน์โหลดโปรแกรมต่อไปนี้มา และติดตั้ง

  • Java Development Kit (JDK) ถ้าเครืองตัวเองเป็น 32-bit ก็โหลดแบบ Windows X86 มาติดตั้ง ถ้าเครื่องเป็น 64-bit ก็โหลดแบบ Windows X64 มาติดตั้งนะครับ
  • Win Ant ดาวน์โหลดและติดตั้งให้เรียบร้อยตามวิธีการในวิดีโอนะครับ
  • Android Studio ชุดแพคเกจแบบทีเดียวอยู่ของ Google ก็ให้ดาวน์โหลด แบบทีตรงกับระบบของตัวเองมาติดตั้งตามวิดีโอนะครับ

4. ลง USB Driver ที่ตรงกับรุ่น/ยี่ห้อของอุปกรณ์ Android

สำหรับการทดสอบ Android Application ที่เราสร้างขึ้นบน Windows กับอุปกรณ์จริงนั้นจะมีขั้นตอนพิเศษกว่าบนเครื่อง Mac OS X หน่อยครับ

คือเราต้องลง USB Driver ที่ตรงกับรุ่น/ยี่ห้อ ของอุปกรณ์นั้นๆ เพื่อให้ Windows รู้จักกับอุปกรณ์เรา และสามารถใช้คำสั่งของ PhoneGap/Cordova ในการทดสอบแอพ Android ในเครื่องจริงของเราได้

คลิกดูรายชื่อ website ของผู้ผลิตอุปกรณ์ เพื่อ download usb driver มาติดตั้งได้ที่นี่

** แอนดรอยด์เครื่องจีน ส่วนใหญ่หา USB Driver ไม่ได้ ทำให้ workshop กันลำบาก แนะนำให้หลีกเลี่ยงการทำ Android จีนมา workshop นะครับ

แต่พอได้แอพแล้ว เอาไปลงเครื่องจีนไม่มีปัญหาครับ

ปัญหาที่อาจพบ และวิธีแก้

ดูเนื้อหารวมเรื่อง PhoneGap/Cordova ได้ที่ nextflow.in.th/phonegap

เปิดอบรมสร้าง Cross Platform Mobile Application ด้วย Ionic Framework

เหมาะสำหรับคนทำเว็บ, เริ่มต้น JavaScript ES6 และ Angular เข้าใจง่าย, ใช้ได้จริง

สอบถาม หรือติดต่อจัดอบรมโทร 083-071-3373

โปรหน้าฝน! เรียนรอบสด รับคอร์สออนไลน์มูลค่ากว่า 5800 บาทฟรี!

Photo by JD Hancock

เริ่มต้นยุค AI ด้วยคอร์สฟรี และพรีเมี่ยม กับพล

หากชอบสิ่งที่พลเล่า เรื่องที่พลสอน สามารถสนับสนุนพลโดยการเข้าเรียนคอร์สออนไลน์ของพลนะคร้าบ

  • เข้าใจง่าย ใช้ได้จริง ออกแบบการสอนอย่างเข้าใจโดยโค้ชพล
  • มีคอร์สสำหรับคนใช้งานทั่วไป จนถึงเรียนรู้เพื่อใช้งานในสายอาชีพขั้นสูง
  • ทุกคอร์สมีใบประกาศณียบัตรรับรองหลังเรียนจบ

เราใช้คุกกี้เพื่อพัฒนาประสิทธิภาพ และประสบการณ์ที่ดีในการใช้เว็บไซต์ของคุณ คุณสามารถศึกษารายละเอียดได้ที่ นโยบายความเป็นส่วนตัว และสามารถจัดการความเป็นส่วนตัวเองได้ของคุณได้เองโดยคลิกที่ ตั้งค่า

Privacy Preferences

คุณสามารถเลือกการตั้งค่าคุกกี้โดยเปิด/ปิด คุกกี้ในแต่ละประเภทได้ตามความต้องการ ยกเว้น คุกกี้ที่จำเป็น

Allow All
Manage Consent Preferences
  • Always Active

Save