Flutter for beginner (สำหรับผู้เริ่มต้น)

Flutter for beginner (สำหรับผู้เริ่มต้น)

ปี 2020 นี้ถ้าจะเริ่มพัฒนาแอพแบบ Cross Platform (รองรับทั้ง Android / iOS) ตัวเลือกที่น่าสนใจ คงเป็นใครไปไม่ได้นอกจาก "Flutter framework" สุดร้อนแรงจาก google ที่เป็นกระแสความนิยมในหมู่พัฒนาอย่างรวดเร็ว ด้วยความเรียบง่าย ความเร็ว ประสิทธิภาพของแอพพลิเคชั่นที่ได้ใกล้เคียงกับ Native (การพัฒนาด้วยภาษาเครื่อง) โดยใช้การพัฒนาด้วยภาษาเพียงภาษาเดียวนั่นก็คือ "ภาษา Dart" ที่มีรูปแบบภาษาคล้ายคลึงกับภาษา C และ Java ผสมผสานกับ JavaScript อีกนิดหน่อย ตัวภาษานับว่ามีความคลาสสิก และความทันสมัยอยู่ในตัว

สำหรับหลักสูตร Flutter นั้นมีรายละเอียด และสิ่งที่ต้องเรียนรู้ค่อนข้างเยอะ หลากหลายมากทีเดียว ดังนั้นเพื่อให้เนื้อหาไม่เยอะเกินไปซึ่งจะทำให้ผู้เริ่มต้นเรียนรู้ตามไม่ทัน และไม่เข้าใจอย่างถ่องแท้ ทางสถาบันไอทีจีเนียสจึงมีการแบ่งเนื้อหาออกเป็น 3 ระดับด้วยกัน (3 หลักสูตรต่อเนื่องกัน) ประกอบด้วย

  1. Flutter beginner (สำหรับผู้เริ่มต้น)
  2. Flutter intermediate (ขั้นกลาง)
  3. Flutter advanced (ขั้นสูง)

สำหรับเนื้อหาใน Flutter beginner (สำหรับผู้เริ่มต้น) นี้เป็นจุดเริ่มต้นที่สำคัญมากๆ สำหรับทุกคน เพราะเป็นการปูพื้นฐานที่ดีในการพัฒนา Mobile app ว่ากันตั้งแต่การเตรียมความพร้อมเครื่องไม้เครื่องมือ แนวคิดในการพัฒนาแอพพลิเคชั่นทั้งฝั่งแอนดรอยด์ (android) และไอโอเอส (ios) ทบทวนพื้นฐานภาษา dart ให้เล็กน้อย พาเริ่มต้นสร้างแอพแรก และทำความเข้าใจโครงสร้างของโปรเจ็กต์อย่างละเอียดชนิดที่ต้องเล่าทุกไฟล์ ทุกบรรทัดสำหรับมือใหม่ เพื่อให้เข้าใจทะลุปรุโปร่งทุกจุด ก่อนจะไปลุยกันต่อในการเขียนแอพที่ซับซ้อนขึ้นต่อไป

การอบรมเป็นลักษณะการบรรยาย สลับกับการทำ workshop ตลอดทั้งหลักสูตร มี workshop การสร้างแอพจริงๆ เช่นแอพนับจำนวน แอพคำนวณค่า bmi ร่างกาย แอพเก็บข้อมูล Contact list รวมถึงตัวอย่างแอพที่เชื่อมต่อ web api ภายนอก เป็นต้น

สาขากรุงเทพฯ (ลาดพร้าว)
  • ยังไม่มีรอบเปิดอบรม (ลงชื่อจองไว้ได้)
  • แนะนำภาพรวมการพัฒนา Mobile Application
  • การเตรียมเครื่องมือและความพร้อม
  • เริ่มต้นกับ Flutter และการสร้าง Mobile Application
  • การปรับแต่งข้อมูลแอพที่สร้างขึ้น
  • เขียนแอพนับจำนวนตัวเลข (Counter)
  • Flutter Layout ที่สำคัญสำหรับผู้เริ่มต้น
  • เข้าใจการทำงานกับ State พื้นฐานใน Flutter
  • แนวทางการขึ้นโครงสร้างโปรเจ็กต์รองรับงานขนาดใหญ่ขึ้น
  • workshop การออกแบบแอพวัดค่า BMI ของร่างกาย
  • workshop แอพบันทึกข้อมูลเบอร์โทรศัพท์ (Contact list)
  • การตรวจสอบการทำงาน (Debugging) ของแอพ
  • การเขียนแอพเชื่อมต่อ Web API ภายนอก
  • นักเรียนนักศึกษา
  • ครู อาจารย์ วิทยากรที่สนใจ
  • นักวิชาการ นักไอที หรือผู้ดูและระบบ
  • ตลอดจนผู้สนใจทั่วไปในการพัฒนาแอพพลิเคชั่นแบบ Cross Platform ด้วย Flutter
  • พื้นฐานการเขียนโปรแกรมมาบ้าง หากไม่มีจะมีการปรับพื้นให้เล็กน้อย
  • มีพื้นฐานภาษา Dart มาบ้าง หากไม่มีจะมีการปรับพื้นฐานให้ก่อนอบรม
  • ไม่จำเป็นต้องเขียนภาษา Swift หรือ Java มาก่อน
  • มีพื้นฐานการใช้งาน Mobile app ทั้ง android และ iOS มาบ้าง
  • 18 ชั่วโมง
  • ราคาปกติ 4,500 บาท / คน
  • โปรโมชั่นลด 10% เหลือ 4,050 บาท / คน
  • ราคาเหมาจ่าย (ผู้อบรมตั้งแต่ 10 คน) ตามแต่ตกลงกัน
  • ขอใบเสนอราคา

ตัวอย่าง workshop บางส่วนในหลักสูตรนี้

รายละเอียดเนื้อหาการอบรม

Module 1: แนะนำภาพรวมการพัฒนา Mobile Application

  • เข้าใจรูปแบบการพัฒนาแอพพลิเคชั่นบน mobile แบบต่างๆ
  • แนะนำแนวทางพัฒนาแอพแบบ Cross Platform
  • รู้จัก Google Flutter framework กับการพัฒนาแอพแบบ Cross Platform
  • สิ่งที่ต้องรู้และข้อควรระวังต่างๆ ในการพัฒนาแอพในรูปแบบต่างๆ

Module 2: การเตรียมเครื่องมือและความพร้อม

  • วิธีการติดตั้งเครื่องมือและ flutter sdk บนระบบ Windows
  • วิธีการติดตั้งเครื่องมือและ flutter sdk บนระบบปฎิบัติการ MacOS
  • การทดสอบการทำงานทั้งบน Mac และ Windows
  • การติดตั้ง Visual Studio Code พร้อมส่วนเสริมที่จำเป็น
  • การสร้าง Emulator และ Simulator บน Android และ iOS
  • การใช้ flutter ตรวจเช็คความพร้อมของระบบ

Module 3: เริ่มต้นกับ Flutter และการสร้าง Mobile Application

  • เริ่มต้นสร้างโปรเจ็กต์ใหม่ใน flutter
  • รู้จักโครงสร้างของโปรเจ็กต์พื้นฐาน
  • ทดสอบรันโปรเจ็กต์ผ่าน Emulator ของ Android และ Simulator บน iOS
  • ทดสอบรันโปรเจ็กต์บนอุปกรณ์จริง

Module 4: การปรับแต่งข้อมูลแอพที่สร้างขึ้น

  • การเปลี่ยนชื่อแอพและ id ของแอพ
  • การเปลี่ยน icon ของแอพทั้ง android และ ios
  • การเปลี่ยนภาพหน้าจอเริ่มต้น (Splash screen) บน android และ ios
  • วิธีติดตั้ง package ต่างๆ เข้ามาใน google flutter
  • ทดสอบเรียกใช้ package และการนำไปใช้งานที่อื่น

Module 5: เขียนแอพนับจำนวนตัวเลข (Counter)

  • การเตรียมโปรเจ็กต์ให้พร้อม
  • แนะนำฟังก์ชันการทำงานเริ่มต้นใน Flutter
  • รู้จัก Widget ใน flutter และการประกาศใช้งาน
  • ทำความรู้จักโครงสร้างแอพด้วย MaterialApp Widget อย่างละเอียด
  • รู้จัก Scaffold Widget สำหรับสร้างหน้าแอพอย่างละเอียด พร้อมการปรับแต่งค่าและคุณสมบัติต่างๆ ที่จำเป็นต้องรู้
  • การกำหนด Theme ให้แอพที่สร้างขึ้น
    • Module 6: Flutter Layout ที่สำคัญสำหรับผู้เริ่มต้น

      • แนวทางการออกแบบแอพ layout ที่จำเป็น
      • รู้จัก Center Widget และการนำมาใช้งาน
      • รู้จัก Container Widget และการใช้งาน
      • การใช้งาน BoxDecoration ร่วมกับ Container widget
      • การใช้ Row และ Column Widget
      • การใช้ IntrinsicWidth และ IntrinsicHeight ปรับความกว้างและความสูงของ widget อัตโนมัติ
      • การจัดวาง layout ด้วย Stack Widget
      • การใช้งาน Expanded ขยายขนาดพื้นที่ให้อัตโนมัติ
      • เรีนนรู้การใช้ FractionallySizedBox Widget น้องใหม่ที่ช่วยเรื่องการปรับขนาดรองรับแบบ Responsive
      • การใช้าน SizedBox Widget
      • การประยุกต์ใช้ Align Widget ที่น่าสนใจ
      • แก้ปัญหาการแสดงผลในอุปกรณ์ด้วย SafeArea Widget
      • การจัดการกับรูปภาพและ assets ต่างๆ ใน flutter
      • การใช้งาน Icon ใน flutter
      • การเพิ่มฟอนต์และเรียกใช้งานในแอพ flutter
        • Module 7: เข้าใจการทำงานกับ State พื้นฐานใน Flutter

          • State คืออะไรใน flutter
          • รู้จักและทำงานกับ Widget แบบ StatelessWidget
          • รู้จักและทำงานกับ Widget แบบ StatefulWidget
          • การเขียนฟังก์ชันใน StatelessWidget / StatefulWidget และเรียกใช้งาน
          • ปัญหาของ state ใน flutter และแนวทางการจัดการในอนาคต

          Module 8: แนวทางการขึ้นโครงสร้างโปรเจ็กต์รองรับงานขนาดใหญ่ขึ้น

          • การจัดวางโครงสร้างไฟล์ต่างๆ เพื่อรองรับโปรเจ็กต์ที่มีขนาดใหญ่ขึ้นในอนาคต
          • การแบ่งส่วนการแสดงผล แยกไฟล์ screen , theme, style, model, services และ widget ต่างๆ เป็นส่วนย่อยๆ
          • การเรียกใช้งานซ้ำจากส่วนต่างๆ ที่สร้างไว้
          • การสร้างไฟล์เก็บข้อมูลค่าคงที่ (constant) และ global variable ต่างๆ ในโปรเจ็กต์ พร้อมการเรียกใช้งาน
          • นำโครงสร้างที่ได้ไปใช้ซ้ำกับโปรเจ็กต์อื่นๆ ได้

          Module 9: workshop การออกแบบแอพวัดค่า BMI ของร่างกาย

          • ออกแบบแอพด้วย layout ที่ได้เรียนมา
          • การปรับแต่ง Witget ต่าง ๆ (Custom flutter widget)
          • เรียนรู้การใช้งาน GestureDetector Widget
          • การใช้งาน Slider Widget
          • การสร้างแอพมากว่า 1 หน้าจอ และการทำ Routing เปลี่ยนหน้าจอไปมา
          • การเขียนเงื่อนไขตรวจสอบการแสดงผลของ UI

          Module 10: workshop แอพบันทึกข้อมูลเบอร์โทรศัพท์ (Contact list)

          • การออกแบบหน้าจอ Login ด้วย Textfile, Password field และปุ่มกดต่างๆ
          • การสร้างหน้า List View , List tile พร้อมการใส่ Event ให้สามารถกดดูรายละเอียดภายในได้
          • การดึงภาพมาแสดงใน List view
          • การแสดง Icon ต่าง ๆ ใน Listview
          • การปรับแต่ง ListView ให้เหมาะสมกับการทำงาน

          Module 11: การตรวจสอบการทำงาน (Debugging) ของแอพ

          • แนะนำวิธีการ Debug Application flutter
          • การเซ็ต breakpoint และการรันตาม step
          • การจัดการ breakpoint และการไล่ดูปัญหาต่างๆ ที่เกิดขึ้น

          Module 12: การเขียนแอพเชื่อมต่อ Web API ภายนอก

          • เรียนรู้การทำงานของ Web API
          • เรียกดูข้อมูล Web API จากภายนอก
          • สร้างโปรเจ็กต์ดึงข้อมุล API จากกรมควบคุมโรค เพื่อดึงสถิติ Covid 19
          • ใช้ ListView และ ListTile สร้าง Layout
          • ติดตั้ง package ที่จำเป็นสำหรับการทำงานกับ http
          • เรียนรู้การทำงานแบบ Asynchonous ในภาษา Dart
          • การเรียกข้อมูลจาก Web API ด้วย HTTP
          • สร้างไฟล์ Class สำหรับเก็บข้อมูล JSON (model)
          • การแปลง JSON เป็น Object ตัวแปรใน State
          • แก้ปัญหากรณีมีค่าเป็น null
          • ปรับแต่งแอพพลิเคชั่นให้มีความสวยงาม เช่นใส่ loading ใส่พื้นหลัง เป็นต้น
22/07/2020 20:37:22