ສອບຖາມຫຼັກສູດເລືອກຊ່ອງທາງທີ່ສະດວກ ທີມງານຕອບເອງທຸກຊ່ອງທາງ
LINE @itgeniusຕອບໄວທີ່ສຸດ · ຈ–ສ 9:00–17:00 ໂມງ
ໂທລະສັບ
02-570-8449ຫ້ອງການ088-807-9770ມືຖື
ອີເມວ ແລະ ໂຊຊຽວ
contact@itgenius.co.thສຳລັບໃບສະເໜີລາຄາ ແລະ ເອກະສານFacebookitgeniusonlineYouTubeitgeniusengຂໍຄຳປຶກສາຈັດຝຶກອົບຮົມໃຫ້ທີມ
ພັດທະນາແອັບມືຖື · MBC-32

Core Flutter Programming

หลักสูตร Core Flutter Programming เป็นการอบรมการสร้าง Mobile App ด้วย Flutter และ Dart ตั้งแต่ UI แบบ Material 3 การจัดการ State ด้วย Riverpod ไปจนถึงเชื่อม REST API และ Build แอป เหมาะกับนักพัฒนาที่เขียนภาษาอื่นได้แล้วและ Web Developer จบแล้วได้แอปสั่งเมนูออนไลน์ต้นแบบที่ใช้งานได้ครบ

ອັບເດດລ່າສຸດ
ລາຄາເລີ່ມຕົ້ນ 9,450 ບາດ / ທ່ານ 10,500 −10% ຍັງບໍ່ລວມ VAT 7% · ມີລາຄາໝູ່ຄະນະ
PDFດາວໂຫຼດ Course Outline
  • ໄລຍະເວລາ30 ຊົ່ວໂມງ · 5 ມື້
  • ຮູບແບບຢູ່ສະຖາບັນ / ອອນລາຍສົດ
  • ຮອບຕໍ່ໄປເປີດຕາມຄຳຂໍ
  • ໃບຢັ້ງຢືນມີໃບຢັ້ງຢືນ

ພາບລວມຫຼັກສູດ

องค์กรจำนวนมากต้องการ Mobile App ที่ใช้ได้ทั้ง Android และ iOS โดยใช้ทีมเดียวและ Codebase เดียว Flutter จึงเป็นตัวเลือกหลักเพราะทำงานได้ลื่นไหลใกล้เคียง Native และพัฒนาได้เร็ว แต่นักพัฒนาที่เพิ่งเริ่มมักติดปัญหาเดิม ๆ คือวางโครงสร้างโปรเจกต์ไม่เป็นระบบ State กระจายไปทั่วแอปจนแก้ไขยาก และเรียก API แบบไม่มีมาตรฐาน ทำให้แอปดูแลรักษายากเมื่อมีฟีเจอร์มากขึ้น

หลักสูตรนี้พาผู้เรียนเดินครบเส้นทางหลักของ Flutter ในหลักสูตรเดียว เริ่มจากภาษา Dart 3.13 แบบสมัยใหม่ ต่อด้วย Widget, Layout และ Theme แบบ Material 3 บน Flutter 3.47 การนำทางด้วย go_router การจัดการ State ด้วย Riverpod 3 เทียบกับ Cubit/BLoC การเชื่อมต่อ REST API การเก็บข้อมูลในเครื่อง การเขียน Test และการ Build แอป ทั้งหมดผ่านโปรเจกต์เดียวคือแอปสั่งเมนูออนไลน์ NovaBite ที่ต่อยอดทุกวันจนใช้งานได้ครบ (อบรม 5 วัน วันละ 6 ชั่วโมง รวม 30 ชั่วโมง ระดับ Beginner to Intermediate)

ສິ່ງທີ່ທ່ານຈະໄດ້ຮັບ

  • เขียนภาษา Dart สมัยใหม่ได้ถูกต้อง ทั้ง Null Safety, Records, Patterns, Sealed Class และ Asynchronous Programming
  • เข้าใจกลไก Widget, Element และ Rendering ของ Flutter และเขียน UI ที่มีประสิทธิภาพ
  • ออกแบบหน้าจอแบบ Responsive และจัดการ Theme ตามแนวทาง Material 3 รองรับ Light/Dark Mode
  • จัดการการนำทางของแอปหลายหน้าจอด้วย go_router รวมถึง Redirect ตามสถานะการเข้าสู่ระบบ
  • สร้างฟอร์มที่ตรวจสอบข้อมูลผู้ใช้ได้ถูกต้องและใช้งานง่าย
  • จัดการ State ด้วย Riverpod 3 และเลือกใช้ Cubit/BLoC ได้เหมาะกับขนาดทีมและโครงการ
  • เชื่อมต่อ REST API แปลง JSON เป็น Model และจัดเก็บข้อมูลในเครื่องได้อย่างเป็นระบบ
  • เขียน Unit Test และ Widget Test เบื้องต้น และ Build แอปสำหรับ Android พร้อมเข้าใจขั้นตอนฝั่ง iOS

ຫຼັກສູດນີ້ເໝາະສຳລັບ

  • นักพัฒนาซอฟต์แวร์ที่ต้องการเริ่มพัฒนา Mobile App ด้วย Flutter อย่างเป็นระบบ
  • Web Developer ที่ต้องการขยายทักษะไปสู่ Cross-platform Mobile Development
  • นักพัฒนา Android หรือ iOS แบบ Native ที่ต้องการลดต้นทุนการพัฒนาหลายแพลตฟอร์ม
  • ทีมพัฒนาที่องค์กรเลือก Flutter เป็นมาตรฐานของโครงการใหม่และต้องการพื้นฐานเดียวกันทั้งทีม
  • ผู้ที่ต้องการเรียน Flutter ตั้งแต่พื้นฐานถึงระดับใช้งานจริงในหลักสูตรเดียวต่อเนื่อง

ພື້ນຖານຂອງຜູ້ເຂົ້າຝຶກອົບຮົມ

  • เขียนโปรแกรมได้อย่างน้อย 1 ภาษา เช่น JavaScript/TypeScript, Java, Kotlin, C# หรือ Python
  • เข้าใจแนวคิด Object-Oriented Programming เบื้องต้น เช่น Class, Object และ Inheritance
  • เข้าใจการทำงานของ REST API และรูปแบบข้อมูล JSON เบื้องต้น ใช้ Git และ VS Code หรือ Android Studio ได้
  • ไม่จำเป็นต้องรู้ Dart หรือ Flutter มาก่อน วันแรกจะปูพื้นฐาน Dart ให้ครบก่อนเข้าสู่ Flutter

ຫົວຂໍ້ການຝຶກອົບຮົມ

รายละเอียดหลักสูตร

หลักสูตรนี้รวมเส้นทางหลักของ Flutter ที่สถาบันเปิดสอนแยกเป็น Flutter for Beginners, Flutter Intermediate และ Flutter Advanced ไว้ในหลักสูตรเดียว 5 วัน เหมาะกับผู้ที่ต้องการเรียนต่อเนื่องตั้งแต่ภาษา Dart จนถึงการ Build แอป อบรม 5 วัน วันละ 6 ชั่วโมง รวม 30 ชั่วโมง (09:00-16:00 น.) รูปแบบ Workshop ต่อเนื่องบนแอปสั่งเมนูออนไลน์ NovaBite ชุดเดียว ใช้ข้อมูลจำลองและ Mock

REST API ที่รันด้วย Docker บนเครื่องของผู้เรียน เนื้อหาอ้างอิง Flutter 3.47 และ Dart 3.13 ซึ่งเป็นเวอร์ชัน Stable ปัจจุบัน และปรับตามเวอร์ชันล่าสุด ณ วันอบรม การ Build สำหรับ iOS ต้องใช้เครื่อง Mac ที่ติดตั้ง Xcode ในห้องเรียนจะสาธิตขั้นตอนฝั่ง iOS ผู้เรียนจะได้ Lab Guide รายวันและ Source Code ของแอปครบทุก Workshop กลับไปใช้เป็นโครงสร้างตั้งต้นของโครงการ

Day 1 Modern Dart Essentials

Section 1: เตรียมเครื่องมือและภาพรวม Flutter

  • ติดตั้ง Flutter SDK ตรวจสอบด้วย flutter doctor และตั้งค่า Android Emulator หรืออุปกรณ์จริง
  • สถาปัตยกรรมของ Flutter: Framework, Engine และ Impeller Renderer
  • โครงสร้างโปรเจกต์ ไฟล์ pubspec.yaml และการเพิ่ม Package จาก pub.dev
  • Lab: สร้างโปรเจกต์แรกและรันบน Emulator พร้อมทดลอง Hot Reload

Section 2: Dart Fundamentals และ Null Safety

  • ตัวแปร, Type Inference, final และ const
  • Sound Null Safety และตัวดำเนินการ ?, !, ?? และ ?.
  • Function, Named Parameter, Optional Parameter และ Collection (List, Set, Map) พร้อม Collection if/for
  • Lab: เขียนโปรแกรม Dart จัดการรายการเมนูและราคาโดยไม่มีจุดเสี่ยง Null

Section 3: Object-Oriented Programming ใน Dart

  • Class, Constructor, Factory Constructor และ Primary Constructors ที่มาใน Dart 3.13
  • Inheritance, Mixin, Abstract Class และ Interface
  • Class Modifiers (sealed, final, base, interface) และ Extension Methods
  • Lab: ออกแบบ Class ของเมนูและหมวดเมนูด้วย Primary Constructors

Section 4: Records, Patterns และ Sealed Class

  • Records สำหรับคืนค่าหลายค่าจาก Function
  • Pattern Matching ด้วย switch Expression และ Destructuring
  • Exhaustiveness Checking กับ Sealed Class และ Dot Shorthands
  • Lab: จำลองสถานะคำสั่งซื้อด้วย Sealed Class และ switch Expression

Section 5: Workshop Day 1: Async และ Domain Model ของ NovaBite

  • Future, async และ await สำหรับงานที่ต้องรอผล
  • Stream และ StreamController สำหรับข้อมูลที่เปลี่ยนต่อเนื่อง
  • การจัดการ Error ด้วย try/catch ในงาน Asynchronous
  • Workshop: สร้าง MenuItem, CartItem และ Order คำนวณราคารวม ส่วนลดและภาษี พร้อมจำลองการโหลดเมนูแบบ Asynchronous
Day 2 Flutter Widgets, Layout และ Material 3 Theming

Section 6: แนวคิด Widget และ Rendering

  • ความสัมพันธ์ของ Widget, Element และ RenderObject
  • StatelessWidget กับ StatefulWidget และ Lifecycle
  • BuildContext และการใช้ const Widget เพื่อลดการ Rebuild
  • Lab: แยกหน้าจอเป็น Widget ย่อยที่นำกลับมาใช้ซ้ำได้

Section 7: Layout Widget ที่ใช้บ่อย

  • Container, Padding, Row, Column, Stack และ Expanded/Flexible
  • ListView, GridView และ CustomScrollView กับ Sliver
  • อ่าน Constraint ให้เป็นและแก้ปัญหา Overflow
  • Lab: จัด Layout การ์ดเมนูและแก้ Overflow ที่พบบ่อย

Section 8: Responsive และ Adaptive Design

  • MediaQuery และ LayoutBuilder
  • ออกแบบให้รองรับทั้งโทรศัพท์และแท็บเล็ต
  • Adaptive Widget ที่แสดงผลเหมาะกับ Android และ iOS
  • Lab: ปรับหน้ารายการเมนูให้สลับ List และ Grid ตามขนาดจอ

Section 9: Material 3 และการจัดการ Theme

  • ColorScheme, Typography และ Component ของ Material 3
  • Light/Dark Mode และ Custom Theme ของแบรนด์
  • แพ็กเกจ material_ui และ cupertino_ui ที่แยกออกจาก SDK และวิธีย้ายมาใช้
  • Lab: สร้าง Theme ของแบรนด์ NovaBite รองรับ Light/Dark Mode

Section 10: Workshop Day 2: หน้ารายการเมนูและรายละเอียดเมนู

  • Hot Reload, Hot Restart และ Widget Previews สำหรับพัฒนา Widget แยกส่วน
  • Flutter DevTools และ Widget Inspector สำหรับตรวจโครงสร้างหน้าจอ
  • Workshop: สร้างหน้ารายการเมนูแยกตามหมวดเมนูและหน้ารายละเอียดเมนู
  • Workshop: ตรวจหน้าจอหลายขนาดและทั้งสองโหมดสีด้วย Widget Previews
Day 3 Navigation, Forms และ User Input

Section 11: Navigation พื้นฐาน

  • Navigator, Route และการส่งข้อมูลระหว่างหน้าจอ
  • การรับค่ากลับจากหน้าจอปลายทาง
  • ข้อจำกัดของการนำทางแบบ Imperative เมื่อแอปซับซ้อนขึ้น
  • Lab: เปิดหน้ารายละเอียดเมนูจากรายการเมนูพร้อมส่งข้อมูล

Section 12: go_router สำหรับงานจริง

  • กำหนด Route, Path Parameter และ Query Parameter
  • Nested Route และ ShellRoute สำหรับ Bottom Navigation
  • Redirect ตามสถานะการเข้าสู่ระบบ และ Deep Link เบื้องต้น
  • Lab: วางโครงสร้าง Route ทั้งหมดของแอปด้วย go_router

Section 13: Forms และ Validation

  • Form, TextFormField และ GlobalKey
  • กฎตรวจสอบข้อมูลและข้อความแจ้งเตือนที่ผู้ใช้เข้าใจง่าย
  • การจัดการ Focus และ Keyboard บนมือถือ
  • Lab: สร้างฟอร์มสมัครสมาชิกพร้อม Validation ครบทุกช่อง

Section 14: การโต้ตอบกับผู้ใช้

  • Dialog, Bottom Sheet และ SnackBar
  • Gesture พื้นฐาน เช่น แตะ กดค้าง และปัดเพื่อลบ
  • Implicit Animation และ Hero Animation
  • Lab: เพิ่ม Bottom Sheet เลือกตัวเลือกของเมนูและ Hero Animation ของรูปเมนู

Section 15: Workshop Day 3: Route และระบบเข้าสู่ระบบของ NovaBite

  • วาง Bottom Navigation 4 แท็บ: เมนู, ตะกร้า, คำสั่งซื้อ และโปรไฟล์ ด้วย ShellRoute
  • สร้างหน้าสมัครสมาชิกและเข้าสู่ระบบพร้อม Validation
  • Redirect ไปหน้าเข้าสู่ระบบเมื่อผู้ใช้ยังไม่ Login
  • Workshop: ทดสอบ Flow ทั้งหมดบน Emulator และแก้จุดที่ใช้งานไม่สะดวก
Day 4 State Management ด้วย Riverpod และ REST API

Section 16: แนวคิด State Management

  • Ephemeral State กับ App State
  • ข้อจำกัดของ setState และ InheritedWidget เมื่อแอปใหญ่ขึ้น
  • ภาพรวมแนวทาง State Management ที่นิยมใน Flutter
  • Lab: วิเคราะห์ว่า State ใดของ NovaBite ควรอยู่ระดับหน้าจอหรือระดับแอป

Section 17: Riverpod 3

  • ProviderScope, Provider และ ref (watch, read, listen)
  • Notifier และ AsyncNotifier สำหรับ State ที่มี Logic
  • Code Generation ด้วย riverpod_annotation, Lifecycle ของ Provider และ Family
  • Lab: ย้าย State ของตะกร้าสินค้าไปไว้ใน Notifier

Section 18: เปรียบเทียบ Riverpod กับ Cubit/BLoC

  • แนวคิดของ Cubit และ BLoC (State และ Event)
  • ข้อดีข้อจำกัดของแต่ละแนวทาง
  • แนวทางเลือกใช้ให้เหมาะกับขนาดทีมและโครงการ
  • Lab: เขียนตะกร้าสินค้าแบบ Cubit เพื่อเทียบโค้ดกับ Riverpod

Section 19: การเชื่อมต่อ REST API

  • เรียก HTTP ด้วย dio (GET, POST, PUT, DELETE)
  • แปลง JSON เป็น Model ด้วย json_serializable
  • Interceptor สำหรับแนบ Token และจัดการ Error
  • Repository Pattern เพื่อแยก Data Layer ออกจาก UI
  • Lab: ดึงรายการเมนูจาก Mock REST API ผ่าน Repository

Section 20: Workshop Day 4: ตะกร้าสินค้าและข้อมูลเมนูจาก API

  • แสดงเมนูจาก API ผ่าน AsyncNotifier พร้อมสถานะ Loading และ Error
  • จัดการตะกร้าสินค้าและสถานะผู้ใช้ด้วย Riverpod
  • ส่งคำสั่งซื้อกลับไปยัง API และแจ้งผลให้ผู้ใช้
  • Workshop: ทดลองตัดการเชื่อมต่อ API แล้วปรับข้อความและปุ่มลองใหม่ให้ใช้งานได้จริง
Day 5 Local Storage, Testing, Release และ Master Workshop

Section 21: Local Storage

  • shared_preferences สำหรับค่าการตั้งค่าและ Token
  • SQLite ด้วย sqflite หรือ drift สำหรับข้อมูลที่มีโครงสร้าง
  • แนวคิด Offline-first และการ Cache ข้อมูลจาก API
  • Lab: บันทึกประวัติคำสั่งซื้อลง SQLite ให้เปิดดูได้แม้ไม่มีอินเทอร์เน็ต

Section 22: Testing เบื้องต้น

  • Unit Test สำหรับ Business Logic และ Notifier
  • Widget Test และการ Override Provider ในการทดสอบ
  • Mock Repository ด้วย mocktail
  • Lab: เขียน Test ให้ Logic คำนวณราคาและหน้าตะกร้าสินค้า

Section 23: คุณภาพและประสิทธิภาพของแอป

  • Lint และ dart fix สำหรับปรับโค้ดตามมาตรฐาน
  • ตรวจประสิทธิภาพและหาจุดที่ Rebuild เกินจำเป็นด้วย DevTools
  • จัดการ Asset, Font และ Icon ของแอป
  • Lab: ใช้ DevTools หาและแก้หน้าจอที่เลื่อนแล้วกระตุก

Section 24: Build และเตรียมเผยแพร่

  • ตั้งค่า App Name, Package Name และ Version
  • Build APK และ App Bundle สำหรับ Android
  • ภาพรวมการ Build สำหรับ iOS ข้อกำหนดของ Xcode และ Apple Developer Program (สาธิต)
  • แนวคิด Flavor สำหรับแยกสภาพแวดล้อม Dev และ Production
  • Lab: Build APK และติดตั้งบนโทรศัพท์ Android จริงหรือ Emulator

Section 25: Master Workshop: แอป NovaBite ที่พร้อมใช้งาน

  • เก็บ Token และค่าการตั้งค่าในเครื่อง และเพิ่มหน้าประวัติคำสั่งซื้อแบบ Offline
  • เขียน Unit Test และ Widget Test ให้ส่วนสำคัญของแอป
  • ทดสอบสถานการณ์ API ล่มหรือเครือข่ายช้าและปรับการแสดงผลให้เหมาะสม
  • Build แอป ติดตั้งบนอุปกรณ์ และนำเสนอผลงานพร้อมรีวิวโครงสร้างโค้ดร่วมกัน

ຮອບຝຶກອົບຮົມ ແລະ ຮູບແບບການຝຶກອົບຮົມ

ສຳລັບບຸກຄົນ — ຮອບຝຶກອົບຮົມທົ່ວໄປ

ຂະນະນີ້ຍັງບໍ່ມີຮອບຝຶກອົບຮົມເປີດຮັບສະໝັກ ລົງຊື່ຈອງໄວ້ໄດ້ເລີຍ ທີມງານຈະຕິດຕໍ່ກັບເປັນກຸ່ມທຳອິດເມື່ອເປີດຮອບຕໍ່ໄປ ຫຼື ສອບຖາມທາງ LINE ຫຼື ໂທ 02-570-8449 ຫຼື 088-807-9770

ສຳລັບອົງກອນ — In-house / Private Training

  • ປັບເນື້ອໃນໃຫ້ກົງກັບເຄື່ອງມື ແລະ ວຽກຈິງຂອງທີມ
  • ເລືອກວັນເອງ ຝຶກອົບຮົມທີ່ບໍລິສັດ ຫຼື ອອນລາຍສົດ
  • ອອກໃບສະເໜີລາຄາໃນນາມນິຕິບຸກຄົນໃຫ້ຝ່າຍຈັດຊື້
ຂໍໃບສະເໜີລາຄາຝຶກອົບຮົມອົງກອນ

ວິທະຍາກອນຜູ້ສອນ

ຄຳຖາມທີ່ພົບເລື້ອຍ

หลักสูตรนี้ต่างจาก Flutter for Beginners, Flutter Intermediate และ Flutter Advanced อย่างไร

หลักสูตรทั้งสามเป็นชุดที่เรียนแยกทีละระดับ เหมาะกับผู้ที่ต้องการเลือกเรียนเฉพาะช่วงที่ต้องการ ส่วน Core Flutter Programming รวมเส้นทางหลักไว้ในหลักสูตรเดียว 5 วัน ตั้งแต่ภาษา Dart, Widget และ Material 3, go_router, Riverpod 3 เทียบกับ Cubit/BLoC, REST API, Local Storage, Testing จนถึงการ Build แอป ผ่านโปรเจกต์ NovaBite ชุดเดียวที่ต่อยอดทุกวัน หัวข้อขั้นสูงอย่าง Platform Channel, Push Notification และ CI/CD สำหรับ Mobile จะกล่าวถึงเชิงแนวคิดเท่านั้น

ต้องรู้ภาษา Dart หรือเคยใช้ Flutter มาก่อนหรือไม่

ไม่จำเป็น วันแรกจะปูพื้นฐานภาษา Dart ให้ครบก่อนเข้าสู่ Flutter แต่ผู้เรียนควรเขียนโปรแกรมภาษาใดภาษาหนึ่งได้แล้ว เข้าใจ OOP เบื้องต้น และเข้าใจ REST API กับ JSON เบื้องต้น

ต้องเตรียมเครื่องอย่างไร และใช้ Windows ได้หรือไม่

ใช้ Windows, macOS หรือ Linux ได้ แนะนำ Notebook ที่มี RAM อย่างน้อย 16 GB และพื้นที่ว่างอย่างน้อย 30 GB เพราะ Android Emulator ใช้ทรัพยากรมาก ติดตั้ง Flutter SDK, Android Studio, VS Code และ Docker Desktop สำหรับรัน Mock API ไว้ล่วงหน้า หากมีโทรศัพท์ Android และสาย USB จะทดสอบบนเครื่องจริงได้

จะได้ Build แอปสำหรับ iOS ในห้องเรียนหรือไม่

การ Build สำหรับ iOS ต้องใช้เครื่อง Mac ที่ติดตั้ง Xcode ในห้องเรียนจะสาธิตขั้นตอนและข้อกำหนดของ Apple Developer Program ผู้เรียนที่ใช้ Mac สามารถรันแอปบน iOS Simulator ได้เอง ส่วนการเผยแพร่ขึ้น App Store หรือ Google Play ต้องใช้บัญชีนักพัฒนาของผู้เรียนหรือขององค์กรเอง

ทำไมเน้น Riverpod และยังได้เรียน BLoC หรือไม่

หลักสูตรใช้ Riverpod 3 เป็นแนวทางหลักเพราะใช้ได้ตั้งแต่แอปเล็กถึงแอปใหญ่และทดสอบง่าย และมีหัวข้อเปรียบเทียบกับ Cubit/BLoC พร้อม Lab เขียนตะกร้าสินค้าแบบ Cubit เพื่อให้ทีมเห็นความต่างและเลือกมาตรฐานของตนเองได้

เนื้อหาใช้ Flutter และ Dart เวอร์ชันใด

เนื้อหาอ้างอิง Flutter 3.47 และ Dart 3.13 ซึ่งเป็นเวอร์ชัน Stable ปัจจุบัน รวมถึง Primary Constructors, Widget Previews และแพ็กเกจ material_ui กับ cupertino_ui ที่แยกออกจาก SDK เนื่องจาก Flutter ออกเวอร์ชันใหม่สม่ำเสมอ เนื้อหาจะปรับตามเวอร์ชัน Stable ล่าสุด ณ วันอบรม