เรียนสร้าง Mobile App ด้วย HTML, Angular และ Ionic Framework

ปูพื้นฐานสร้างแอพ iOS และ Android ด้วยภาษาเว็บ เขียนครั้งเดียวได้ถึง 2 ระบบ
4.5 (136 ratings) Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
344 students enrolled
$150
Take This Course
  • Lectures 165
  • Length 6 hours
  • Skill Level All Levels
  • Languages Thai
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works

Discover

Find online courses made by experts from around the world.

Learn

Take your courses with you and learn anywhere, anytime.

Master

Learn and practice real-world skills and achieve your goals.

About This Course

Published 1/2016 Thai

Course Description

ในหลักสูตรนี้ คุณจะค้นพบวิธีทำ Mobile App เขียนครั้งเดียว ได้ทั้ง iOS App และ Android App 

* เนื้อหา Angular 2 และ Ionic 2 จะอ้พเดตเมื่อทั้ง 2 ระบบ ประกาศพร้อมใช้งานจริง ใน 1-2 เดือน  (ไม่ติดเวอร์ชั่น Beta หรือ RC) เพราะโค้ชพลมีนโยบาย สอนของที่เอาไปใช้ได้อย่างสบายใจ ไม่สอนของที่ยังไม่สมบูรณ์ครับ 

** ตอนนี้กำลังรีรันเนื้อหาทั้งหมดเป็น Angular 2 และ Ionic 2 ถ้าลงทะเบียนแล้วจะได้รับแจ้งอัพเดตเป็นระยะนะครับ

*** หากต้องการชำระโดยการโอนเงิน จะบวกเพิ่มจากราคาปกติ 400 บาท ติดต่อสอบถามได้ที่ training@nextflow.in.th

โค้ชพลขอใช้ประสบการณ์กว่า 5 ปี แชร์วิธีการ และแนวคิด เพื่อให้คุณค้นพบการพัฒนา Mobile App โดยใช้เทคโนโลยี Ionic Framework ซึ่งสามารถใช้ภาษาเว็บทั่วไปอย่าง HTML, CSS, JavaScript สร้างแอพได้ถึง 2 ระบบพร้อมกัน

เหมาะสำหรับผู้เริ่มต้น ต้องการเรียนรู้การพัฒนา Mobile App และทำทีเดียวได้ทั้ง iOS App และ Android App

ภาพรวมเนื้อหาในหลักสูตร

  1. Mobile Developer Beginner - เรียนรู้โลกของการพัฒนา Mobile App, เทคโนโลยีที่เกี่ยวข้อง, และการหารายได้จาก Mobile App
  2. Hybrid App - เรียนรู้เทคโนโลยีการพัฒนา Mobile App แบบ Hybrid
  3. Basic to Pro - ปูพื้นฐาน และเรียนรู้การใช้ HTML, PhoneGap/Cordova, AngularJS, และ Ionic Framework ในการสร้าง iOS และ Android App
  4. Mobile User Interface - เรียนรู้การใช้งาน UI Component เพื่อสร้าง Mobile App แบบโปร
  5. Connect Web Service - เรียนรู้วิธีรับส่งข้อมูลระหว่าง Mobile App กับ Web Service และ Web API (PHP)
  6. MySQL Database - แนะนำวิธีการให้ Mobile App จัดการรับส่งข้อมูลกับ MySQL Database ได้
  7. Mobile Database - เรียนรู้การจัดการฐานข้อมูล SQLite 3
  8. Plugin Workshop - เรียนรู้วิธีทำให้ Mobile App เรียกใช้เซ็นเซอร์ต่างๆ บน iPhone, iPad และ Android เช่น TouchID, Camera, Barcode Scanner, Push Notification
  9. Mobile UX Jumpstart - เรียนรู้พื้นฐาน UX ในการออกแบบ Mobile App
  10. To App Store - วิธีการสมัคร และอัพโหลดแอพขึ้น App Store และ Play Store
  11. Bonus! - พิเศษ! เรียนรู้ Angular JS 2 และ Ionic 2 ในปี 2016

สื่อประกอบการเรียน

  • วิดีโอ ดูได้ไม่มีวันหมดอายุ
  • ไฟล์ Workshop สำหรับดาวน์โหลดไปฝึกทำตาม
  • Link สำหรับดูข้อมูล และศึกษาเพิ่มเติม

ลักษณะการเรียน

  1. ทำความเข้าใจ - เรียนรู้การใช้งานเทคโนโลยีแต่ละตัว เพื่อให้รู้จริง เอาไปใช้งานได้อย่างสบายใจ
  2. ดูและทำตาม - ดาวน์โหลดไฟล์ Workshop เพื่อทำตาม และทดสอบแอพจริง
  3. ทบทวนด้วยคำถาม - ทำแบบฝึกหัดเพื่อให้มั่นใจว่าเข้าใจส่วนสำคัญของเนื้อหา
  4. ท้าทายด้วยโจทย์เปิด - ฝึกวิธีคิด โดยท้าทายคุณด้วยโจทย์ที่ทำให้เสร็จได้ด้วยหลากหลายวิธี

ทำไมควรลงเรียนหลักสูตรนี้?

  1. เรียนจบสามารถสร้าง Mobile App ได้แน่นอน ทำแอพได้มั่นใจ ไร้กังวล
  2. รองรับความต้องการลูกค้าได้ถึง 2 ระบบ คือ iOS และ Android
  3. โค้ชพลเน้นเนื้อหาเข้าใจง่าย มีไฟล์ Workshop ทำตามได้ เหมาะกับผู้เริ่มต้นมากครับ
  4. ถามตอบปัญหาได้ในวิดีโอ เหมือนเรียนสดกับโค้ชพล
  5. อัพเดตเนื้อหาต่อเนื่อง คุ้มยิ่งกว่าคุ้ม

เวลาที่ใช้ในการเรียน

  • เนื้อหาวิดีโอหลักรวมแล้วไม่เกิน 24 ชั่วโมงครับ


What are the requirements?

  • ไม่จำเป็นต้องเคยทำ Mobile App มาก่อน
  • สามารถอ่านเขียนภาษา HTML, CSS ได้
  • สามารถอ่านเขียนภาษา JavaScript ได้
  • ไม่จำเป็นต้องเคยใช้ JQuery หรือ AngularJS

What am I going to get from this course?

  • สามารถสร้าง Mobile App ได้อย่างมั่นใจ และทำมาหากินได้
  • สามารถสร้าง Mobile App ได้ทั้งระบบ iOS และระบบ Android
  • สามารถเขียน Mobile App ด้วยภาษา HTML, CSS, และ JavaScript รวมถึงใช้งาน PhoneGap/Cordova, Angular JS และ Ionic Framework ในการพัฒนา Mobile App
  • สามารถออกแบบ และสร้าง UI ของ Mobile App ที่ใช้งานได้ง่ายและสวยงาม
  • สามารถสร้าง Mobile App ที่จัดการข้อมูลใน MySQL Database
  • สามารถสร้าง Mobile App ที่รับส่งข้อมูลกับ Web Service ได้
  • เรียนรู้การใช้งาน Plugin เพื่อควบคุมเซ็นเซอร์บนอุปกรณ์ iOS และ Android ได้
  • สามารถอัพโหลด Mobile App ของตัวเองขึ้น App Store และ Play Store ได้

What is the target audience?

  • บุคคลทั่วไป
  • Programmer
  • Web Developer
  • Web Master
  • IT Manager

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.

Curriculum

Section 1: ทักทายกันก่อนเรียน
02:42

รู้จักกับรายและเอียดและหัวข้อคร่าวๆ ในหลักสูตร และสามารถใช้สิทธิ์ลดพิเศษเมื่อคลิกสั่งซื้อล่วงหน้า (จำนวนจำกัด)

03:11

ก่อนเรียนมาทำความเข้าใจส่วนต่างๆ ของ Udemy เพื่อให้เรียนได้เต็มที่ และสามารถพูดคุยสอบถามกับโค้ชพล และเพื่อนๆ ในหลักสูตรได้

Section 2: เป้าหมายของการสร้าง Mobile Application และเทคโนโลยีที่เกี่ยวข้อง
05:21

กำหนดเป้าหมายของการที่เราจะสร้าง Mobile Application ขึ้นมา เพื่อให้เห็นความสำคัญของบทเรียนทั้งหมด และสามารถพัฒนาเป็นธุรกิจสตาร์ทอัพได้

06:17

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

เข้าใจเป้าหมาย และขั้นตอนการพัฒนาโมบายล์แอพพลิเคชั่น
7 questions
Section 3: รู้จักกับการพัฒนา Mobile Application แบบ Hybrid
06:23

ทำความเข้าใจแนวคิดของ Hybrid Mobile Application ได้ง่ายๆ เพื่อเป็นพื้นฐานสำหรับการคิดพัฒนา Mobile Application แบบ Cross Platform

02:37
  1. เข้าใจจุดประสงค์ที่มีการคิดค้น PhoneGap ขึ้นมา
  2. ประโยชน์ของ PhoneGap
  3. รูปแบบการทำงานของ PhoneGap
03:38
  • ทำความเข้าใจความแตกต่างระหว่าง PhoneGap และ Cordova
  • เพื่อเลือกใช้เทคโนโลยีได้อย่างถูกต้อง
  • มีประโยชน์เวลาไปค้นใน Google หรือ StackOverflow
03:55

ทำความเข้าใจส่วนประกอบของ Cordova เพื่อการประยุกต์นำไปใช้งานใน Ionic Framework

7 questions

ทบทวนความเข้าใจในจุดประสงค์ของแนวคิดการพัฒนา Mobile App แบบ Hybrid และการทำงานของเทคโนโลยีที่เกี่ยวข้อง

Section 4: รู้จักกับ Ionic Framework
06:10

เข้าใจจุดประสงค์ของ Ionic Framework และเรียนรู้ส่วนประกอบต่างๆ ที่เราจะใช้ Ionic Framework ในการพัฒนา Mobile Application

01:47
  • รู้จักแพลตฟอร์มที่ Ionic Framework รองรับ
  • เวอร์ชั่นต่ำสุดของแต่ละแพลตฟอร์ม ที่สามารถรองรับการทำงานของ Ionic ได้
02:23

คำความเข้าใจความแตกต่างระหว่างการเลือกใช้เครื่องลง Windows หรือเครื่อง Mac ในการพัฒนาแอพพลิเคชั่น

  • เครื่อง Windows สามารถใช้พัฒนาแอพ iOS ได้หรือไม่?
  • เครื่อง Windows สามารถทำแอพ ระบบอะไรได้บ้าง?
  • เครื่อง Mac สามารถทำแอพ ระบบอะไรได้บ้าง?
  • ใช้ Windows ทำแอพ Android ก่อน แล้วค่อยซื้อ Mac มาทำแอพ iOS ได้หรือไม่?
01:48

ทราบถึงกลุ่มโปรแกรม และระบบที่ Ionic Framework ใช้งาน เพื่อรู้ถึงขอบเขตการทำงาน และโปรแกรมที่จะติดตั้งในขั้นตอนต่อไป

Section 5: Editor สำหรับพัฒนา Mobile Application
Editor สำหรับการพัฒนาแอพ Ionic Framework
01:56
วิธีติดตั้ง Sublime Text สำหรับคนใช้ Windows
01:23
วิธีติดตั้ง Sublime Text สำหรับคนใช้ Mac OS X
01:35
วิธีติดตั้ง Package Manager ใน Sublime Text
01:57
00:27

รู้จักรายชื่อของส่วนเสริม ของ Sublime ที่จะช่วยให้เราเรียนรู้ และพัฒนาแอพได้อย่างรวดเร็ว

ติดตั้ง Package สำหรับทำแอพด้วย Ionic Framework
01:21
Section 6: เตรียมเครื่อง Windows เพื่อพัฒนาแอพ Android
00:42

ทำความเข้าใจสภาพแวดล้อมในการพัฒนาแอพ Android บนระบบ Windows

วิธีติดตั้ง Chocolatey
02:17
วิธีติดตั้ง Node JS
00:57
วิธีติดตั้ง Cordova และ Ionic
Preview
01:35
01:06

เรียนรู้วิธีติดตั้ง Git บน Windows สำหรับติดตั้ง Plugin ของ Cordova เพิ่มเติม

02:16

เรียนรู้วิธีสั่งติดตั้ง Java Development Kit (JDK) ผ่าน Chocolatey 

วิธีติดตั้ง Apache Ant
00:45
วิธีติดตั้ง JDK, Android Studio, และตั้งค่า Path ของ JDK และ Android SDK
10:14
Section 7: เตรียมเครื่อง Mac OS X เพื่อพัฒนาแอพ Android
01:16

เข้าใจสภาพแวดล้อมการพัฒนาแอพ iOS บนระบบ OS X 

วิธีติดตั้ง Node JS
01:27
วิธีติดตั้ง Cordova CLI และ Ionic Framework
01:57
วิธีติดตั้ง Android Studio
04:36
วิธีตั้งค่า PATH ของ Android SDK บน Mac OS X
04:24
Section 8: การเตรียมเครื่อง Mac OS X เพื่อพัฒนาแอพ iOS
01:05

รู้จักกับระบบช่วยรันแอพบน iOS Simulator และ iOS Device ผ่านโปรแกรม Terminal

00:28

เรียนรู้การติดตั้งระบบ ios-sim สำหรับสั่งทดสอบแอพบน iOS Simulator ผ่านโปรแกรม Terminal

01:00

เรียนรู้การติดตั้งระบบ ios-deploy สำหรับสั่งทดสอบแอพบน iOS Device ผ่านโปรแกรม Terminal

Section 9: สร้างแอพแรกของพวกเรา
02:02

รู้จักกับ Ionic CLI เครื่องมือที่ให้จัดการโปรเจค Ionic ผ่านโปรแกรม Command Prompt บน Windows และโปรแกรม Terminal บน Mac

01:51

รู้จักกับคำสั่งสร้างโปรเจค ionic start ในการกำหนดชื่อโฟลเดอร์โปรเจค, ประเภทเทมเพลต, และชื่อของแอพพลิเคชั่น

01:37

วิธีการสั่งสร้างโปรเจค Ionic บนระบบ Windows ด้วยคำสั่ง ionic start

01:51

วิธีการสั่งสร้างโปรเจค Ionic บนระบบ OS X ด้วยคำสั่ง ionic start

02:25

เรียนรู้โครงสร้างของโปรเจค Ionic และส่วนที่เราใช้งาน

01:47

เรียนรู้การใช้งานคำสั่งรัน Web server ของ Ionic ในการทดสอบและพัฒนาตัวแอพพลิเคชั่น

01:45

ทดสอบรัน Web Server ของ Ionic บน Windows เพื่อใช้ในการพัฒนาแอพพลิเคชั่น

02:26

เรียนรู้และใช้งานความสามารถของ Live Reload บน Ionic Web server เพื่อให้พัฒนาแอพพลิเคชั่นได้อย่างสะดวกและรวดเร็ว

Section 10: เพิ่ม และลบ Mobile Platform ให้โปรเจค
เพิ่ม/ลบ Android Platform จากโปรเจค (Windows & OS X)
00:41
01:03

เรียนรู้วิธีการเพิ่มและลบ iOS Platform ให้โปรเจค ionic

Section 11: รู้จักและใช้งาน Simulator สำหรับ iOS และ Android
00:53

ทำความเข้าใจการทำงานของระบบ Emulator

01:04

ทำความเข้าใจระบบ Genymotion และลักษณะที่เราจะนำมาใช้งาน

ติดตั้ง Genymotion (Windows)
00:42
ติดตั้ง Genymotion (Mac OS X)
00:35
01:11

วิธีเลือกและติดตั้ง Virtual Device ของ Genymotion สำหรับใช้ทดสอบแอพ Android บนคอมพิวเตอร์

ทดสอบรันแอพบน Genymotion Emulator
01:25
Section 12: ทดสอบแอพบน iOS Simulator (Mac OS X)
00:23

ติดตั้ง iOS Simulator เพิ่มเติมสำหรับใช้ในการทดสอบแอพพลิเคชั่น iOS

ทดสอบรันแอพ iOS บน Simulator ผ่านโปรแกรม Terminal
00:31
ทดสอบรันแอพ iOS บน Simulator ผ่านโปรแกรม Xcode
00:42
Section 13: การปรับแต่งแอพพลิเคชั่นเบื้องต้น
01:22

วิธีสร้าง Application Icon แบบม้วนเดียวจบได้ทุกขนาดกับคำสั่ง ionic resources

01:28

เข้าใจวิธีสร้าง Splash Screen และใช้งานเทมเพลต

00:42

วิธีกำหนด App ID ให้แอพพลิเคชั่นทั้ง iOS และ Android

00:48

วิธีกำหนดชื่อของแอพพลิเคชั่นทั้ง iOS และ Android

00:34

วิธีกำหนดเลขเวอร์ชั่นให้แอพพลิเคชั่นทั้ง iOS และ Android

Section 14: ทดสอบแอพบนอุปกรณ์ Android (ใช้ได้ทั้ง Windows และ Mac OS X)
01:47

ทำความเข้าใจระบบ และสิ่งที่ต้องใช้ในการทดสอบแอพ บนอุปกรณ์ Android

01:47

เรียนรู้การเปิด Developer Option บนอุปกรณ์ Android เวอร์ชั่น 4.2 ขึ้นไป

00:37

ดูแหล่งดาวน์โหลด USB Driver สำหรับอุปกรณ์ Anroid ต่างๆ 

01:25

ทดลองต่ออุปกรณ์ Android เข้ากับเครื่องคอมพิวเตอร์เพื่อใช้ในการทดสอบแอพพลิเคชั่น

01:00

ทดสอบคำสั่ง ionic run android --device เพื่อสั่งทดสอบแอพพลิเคชั่น Ionic บนอุปกรณ์ที่เชื่อมต่ออยู่

Section 15: ทดสอบแอพบนอุปกรณ์ iOS (Mac OS X)
02:23

รู้จักและเตรียมระบบ OS X และ iOS ให้พร้อมสำหรับการเชื่อมต่อ

00:54

เพิ่ม Apple Developer Account ใน Xcode เพื่อใช้ในการทดสอบแอพบนเครื่องจริง

01:30

เรียนรู้การเชื่อมต่ออุปกรณ์ iOS เข้ากับเครื่อง Mac ของเรา

00:59

ทดลองรันโปรเจคบนอุปกรณ์ iOS ด้วย Xcode

00:54

ทดลองรันโปรเจคบนอุปกรณ์ iOS ด้วย Terminal และ ios-sim

Section 16: พื้นฐาน Ionic UI: แอพคิด Vat 7%
01:57

ทำความเข้าใจระบบพื้นฐานของ Ionic UI

00:43

ดูตัวอย่างหน้า  UI ของแอพก่อนลงมือสร้างจริง

01:37

สร้างโปรเจคแอพ Vat 7% ด้วยคำสั่งของ Ionic และ Template ของโค้ชพล

01:43

สร้าง Mobile Page แรกด้วย ion-pane

01:48

เรียนรู้การสร้างส่วนหัวเพจด้วย <ion-header-bar>

00:59

เรียนรู้วิธีกำหนดส่วน Content ของ Page ด้วย <ion-content>

02:11

สร้างส่วนรับข้อมูล ให้ผู้ใช้กรอกด้วย <input>

01:52

สร้างปุ่มกดสำหรับให้ผู้ใช้สั่งงานด้วย <button>

00:47

สร้างและจัดการข้อความบน Page ด้วย HTML tag

00:46

ทดสอบ User Interface ของแอพคิด Vat 7%

Section 17: พื้นฐาน Angular JS: แอพคิด Vat 7%
03:44

ทบทวนจุดประสงค์ของการใช้ JavaScript บน Website และ ทำความเข้าใจเป้าหมายของ Angular

04:36

ทำความเข้าใจภาพรวมของ Angular และการนำมาใช้งานในการสร้างเว็บแอพ ด้วยหนัง Sci-Fi

01:26

รู้จักกับส่วนแรกของ Angular นั่นคือ Module สมองกลของเว็บแอพ และ Mobile App ของเรา

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

Mr. Teerasej Jiraphatchandej, Cross Platform Developer & Web Technology Consultant

Teerasej is a 6 years-experienced in Cross Platform Mobile & Web Application Technology Developer & Consultant.

He believes that everyone can learn and use technology easier if they understand the nature of technology they want to use, and this theory have been proven along 6 years.

Teerasej is the first who's brought PhoneGap/Cordova into Thailand. Currently, he host training and provide consultant service about cutting-edge web technology, such as PhoneGap/Cordova, Ionic Framework, Angular JS, Sencha, React Native, Electron, Meteor JS, and MEAN Stack.

Some of his clients: SANSIRI, BEC Tero, GMM Grammy, TARAD dot com, Bangkok Cable, G-ABLE, Fuji Xerox, Kasersart University, Rajamangala University, Chaing Mai University, Software Park Phuket,. etc.

Ready to start learning?
Take This Course