Mobile Apps · MBC-23

Flutter 3 advanced (ขั้นสูง)

30 hours 5 days
Last updated

Flutter 3 advanced (ขั้นสูง) is a 30-hour training course by IT Genius Institute. ถ้าจะเริ่มพัฒนาแอพแบบ Cross Platform (รองรับทั้ง Android / iOS) ตัวเลือกที่น่าสนใจ คงเป็นใครไปไม่ได้นอกจาก "Flutter framework" สุดร้อนแรงจาก google…

Training schedule

No public rounds are open right now — register your interest and we will contact you when the next round opens, or request an in-house session for your team.

Corporate training quote

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

สำหรับเนื้อหาใน Flutter Advanced (ขั้นสูง) นี้เป็นการต่อยอดจาก flutter intermediate ขั้นกลาง เพื่อให้ผู้เรียนและผู้เข้าอบรมสามารถประยุกต์ใช้งาน flutter ได้อย่างครบถ้วน เนื้อหาเจาะลึกในหัวข้อที่สามารถนำไปใช้ในงานจริง อาทิ การออกแบบด้วย Material Advanced, การออกแบบแอพส่วนของ iOS ด้วย Cupertino, การทำแอพให้รองรับหลายภาษา ,

การใช้งานฐานข้อมูลภายในแอพด้วย SQLite , การอัพโหลดไฟล์ภาพผ่าน API, การทำงานกับ Google Firebase, ทำระบบ Chat แบบเรียลไทม์, การอัพโหลดรูปภาพด้วย firebase, พัฒนาระบบแจ้งเตือน , เขียนระบบด้วยโครงสร้างแบบ MVC, จัดการ State ด้วย Bloc, การบันทึกเสียงใน flutter, การเขียนระบบเชื่อมต่อกับ Youtube API, การติดต่อกับอุปกรณ์และเซ็นเซอร์ต่างๆ บนมือถือ และเนื้อหาอื่นๆ อีกมากมาย

เมื่อผู้เข้าอบรมจบหลักสูตรนี้ไปจะมั่นใจได้ว่า ได้ความรู้ ความเข้าใจที่ครบถ้วน ในการนำไปต่อยอดพัฒนาผลงานของตนเองได้อย่างมีประสิทธิภาพต่อไป

Objectives

  • การออกแบบด้วย Material Advanced Components
  • การออกแบบแอพส่วนของ iOS ด้วย Cupertino (Building a Cupertino app with Flutter for iOS)
  • การทำแอพให้รองรับหลายภาษา (Localization and Multi Language in flutter)
  • การใช้งานฐานข้อมูลภายในแอพด้วย SQLite (Using SQLite in Flutter)
  • การอัพโหลดไฟล์ภาพผ่าน API (Upload Images To REST API)
  • การทำงานกับ Google Firebase (Firestore CRUD in Flutter)
  • ทำระบบ Chat แบบเรียลไทม์ (Realtime chat with firebase in flutter)
  • การอัพโหลดรูปภาพด้วย firebase (Firebase Image Upload)
  • พัฒนาระบบแจ้งเตือน (Push Notifications in Flutter using Firebase)
  • เขียนระบบด้วยโครงสร้างแบบ MVC (Flutter MVC design pattern)
  • จัดการ State ด้วย Bloc (State management with Bloc)
  • การบันทึกเสียงใน flutter (Flutter Audio Recorder)
  • การเล่นวิดีโอ (Flutter Video Player)
  • การเขียนระบบเชื่อมต่อกับ Youtube API (Flutter YouTube API and Video Player)
  • การติดต่อกับอุปกรณ์และเซ็นเซอร์ต่างๆ บนมือถือ (Flutter with Device API)
  • การเตรียมความพร้อมแอพและอัพโหลดขึ้น Store (Build and published app to store)

Who this course is for

  • นักเรียนนักศึกษา
  • ครู อาจารย์ วิทยากรที่สนใจ
  • นักวิชาการ นักไอที หรือผู้ดูและระบบ
  • ตลอดจนผู้สนใจทั่วไปในการพัฒนาแอพพลิเคชั่นแบบ Cross Platform ด้วย Flutter

Prerequisites

  • พื้นฐานการเขียน flutter มาบ้างเล็กน้อย หรือผ่านหลักสูตร flutter for intermediate ขั้นกลางมาแล้ว
  • มีพื้นฐานภาษา Dart มาบ้าง หากไม่มีจะมีการปรับพื้นฐานให้ก่อนอบรม
  • ไม่จำเป็นต้องเขียนภาษา Swift หรือ Java มาก่อน
  • มีพื้นฐานการใช้งาน Mobile app ทั้ง android และ iOS มาบ้าง

Curriculum

Module 1: การออกแบบด้วย Material Advanced Components

  • ติดตั้ง flutter และกำหนดสภาพแวดล้อม (Set up your Flutter environment)
  • เพิ่มส่วนของ backdrop เมนู (Add the backdrop menu)
  • เพิ่มการทำรูปทรงต่างๆ (Add a shape)
  • เพิ่มการทำ motion (Add motion)
  • เพิ่มเมนูส่วน back layer (Add a menu on the back layer)
  • เพิ่มไอคอนแสดงแบรนด์ของแอพ (Add a branded icon)

Module 2: การออกแบบแอพส่วนของ iOS ด้วย Cupertino (Building a Cupertino app with Flutter for iOS)

  • ติดตั้ง flutter และกำหนดสภาพแวดล้อม (Set up your Flutter environment)
  • สร้างและกำหนดค่าเริ่มต้นสำหรับ Cupertino (Create the initial Cupertino app)
  • กำหนดโครงสร้างของแอพเป็น 3 แท็บ (Create structure for a 3-tab app)
  • เพิ่มส่วนการจัดการ State (Add state management)
  • ใช้ list view แสดงรายการ (List products for sale)
  • ทำส่วนการค้นหาข้อมูลใน List (Add product search)
  • ปรับแต่งส่วนของข้อมูลลูกค้า (Add customer info)
  • เพิ่มส่วนการแสดงวันเวลา (Add date picker)
  • เพิ่มส่วนการเลือกข้อมูลใน List (Add selected items for purchase)

Module 3: การทำแอพให้รองรับหลายภาษา (Localization and Multi Language in flutter)

  • การเตรียมโปรเจ็กต์ flutter สำหรับรองรับหลายภาษา (Prepare Your Project)
  • เพิ่ม package จัดการหลายภาษาลงในไฟล์ pubspec.yaml (Update pubspec.yaml)
  • การสร้าง json ไฟล์แยกภาษาที่ต้องการ (Create the language files)
  • สร้าง Delegate Class สำหรับจัดการเลือกภาษา (Create Delegate Class)
  • จัดการแสดงผลภาษาในส่วนของ UI (Translating text in the UI)
  • บันทึกข้อมูลภาษาที่เลือกไว้ลงในเครื่องด้วยการใช้ provider และ shared_preferences (changing App language manually)
  • ปรับแต่งการแสดงผลให้เหมาะสมในงานจริง (Custom for your app)

Module 4: การใช้งานฐานข้อมูลภายในแอพด้วย SQLite (Using SQLite in Flutter)

  • การใช้ SQLite ใน flutter เบื้องต้น ติดตั้ง plugin SQFLITE (SQLite in Flutter: SQFLITE plugin)
  • สร้างส่วนของ model (Implementing Model Class)
  • สร้างส่วนของ helper สำหรับทำเรียกดู เพิ่ม ลบ แก้ไข(Creating DatabaseHelper Class: CRUD Operation)
  • เชื่อมต่อฐานข้อมูลกับส่วนแสดงผล (Connect database to UI)
  • ปรับแต่งการแสดงข้อมูลจาก SQLite ในส่วนการแสดงผล (Custom to display data to UI)

Module 5: การอัพโหลดไฟล์ภาพผ่าน API (Upload Images To REST API)

  • สร้างโปรเจ็กต์สำหรับใช้ทดสอบการอัพโหลดรูป (Prepare and create project)
  • เพิ่ม package สำหรับการจัดการ network และจัดการไฟล์ใน pubspect.yaml (Install the dependencies in pubspec.yaml)
  • กำหนด layout สำหรับเลือกไฟล์ภาพ (Create layout for add image)
  • เรียกใช้งาน image_picker (Adding the Image Picking Feature)
  • เขียน Rest API ส่วน backend ด้วย Laravel สำหรับอัพโหลดไฟล์ภาพ (Backend Setup To Handle The Image Upload Process)
  • เขียน Logic ส่วนการอัพโหลดไฟล์รูปใน flutter (Implementing The Image Upload Feature)

Module 6: การทำงานกับ Google Firebase (Firestore CRUD in Flutter)

  • สร้างโปรเจ็กต์ flutter (Creating a New Firebase Project)
  • ติดตั้ง firebase ลงใน project android (Android Firebase Project Setup)
  • ติดตั้ง firebase ลงใน project iOS (iOS Firebase Project Setup)
  • Firebase Flutter Packages Setup (iOS & Android)
  • Registering Users with Firebase using FirebaseAuth
  • Authenticating Users with FirebaseAuth
  • Showing a Spinner while the User Waits
  • Saving Data into Cloud Firestore
  • Listening for Data from Firebase using Streams
  • Update Data into Cloud Firestore
  • Delete Data into Cloud Firestore
  • Turning Streams into Widgets Using the StreamBuilder
  • Cloud Firestore Authorisation and Security Rules

Module 7: ทำระบบ Chat แบบเรียลไทม์ (Realtime chat with firebase in flutter)

  • Creating an Authentication Form
  • Connecting Auth Form & Auth Screen
  • Implementing Authentication
  • Storing Extra User Data
  • Finishing Authentication & Logout
  • Adding Firebase Security Rules
  • Listening to Chat Messages
  • Sending & Ordering Chat Messages
  • Creating a Basic Chat Bubble Widget
  • Improving the Chat Bubbles
  • Testing on Multiple Devices
  • Displaying User Names

Module 8: การอัพโหลดรูปภาพด้วย firebase (Firebase Image Upload)

  • Adding an Image Picker
  • Preparing File Upload & Validating Images
  • Uploading Images
  • Improving Image Upload
  • Running on a Real iOS Device
  • Displaying Images

 

Module 9: พัฒนาระบบแจ้งเตือน (Push Notifications in Flutter using Firebase)

  • Creating a Firebase project
  • Integrating the firebase_messaging package
  • Android-specific configurations
  • iOS-specific configuration
  • Initializing the packages in Dart-Code
  • Sending Notifications with the Firebase console

Module 10: เขียนระบบด้วยโครงสร้างแบบ MVC (Flutter  MVC design pattern)

  • What is the MVC Design Pattern?
  • The MVC Approach
  • Install package for MVC
  • Create project with MVC structure
  • The Controller
  • The Model
  • The View

Module 11: จัดการ State ด้วย Bloc (State management with Bloc)

  • What is BLoC pattern?
  • Concepts for Bloc Events, States, Transition
  • Implementing the BLoC pattern
  • Creating Events
  • Creating BLoC
  • Creating the UI
  • Running the app

Module 12: การบันทึกเสียงใน flutter (Flutter Audio Recorder)

  • Install project and add package flutter_sound
  • Config on iOS
  • Subscriptions
  • Default uri path
  • Creating instance.
  • Starting recorder with listener.
  • Stop recorder
  • Start player
  • Stop player
  • Pause player
  • Resume player
  • Seek player
  • Setting volume

Module 13: การเล่นวิดีโอ (Flutter Video Player)

  • Setup flutter project
  • Add package video_player in pubspect.yaml
  • Implement for video player
  • Custom to display video in view
  • Test on real device

Module 14: การเขียนระบบเชื่อมต่อกับ Youtube API (Flutter YouTube API and Video Player)

  • Create flutter project and add "youtube_player_flutter" dependencies
  • Config to iOS in Info.plist
  • Create project and enable api in google developer console
  • Get Youtube Data API Key
  • Create Model in flutter
  • Create Video modal
  • Create api service
  • Display video in listview
  • Play video in screen UI

Module 15: การติดต่อกับอุปกรณ์และเซ็นเซอร์ต่างๆ บนมือถือ (Flutter with Device API)

  • WebView
  • Bluetooth
  • Calendar
  • File Picker
  • Battery
  • NFC Reader

Module 16: การเตรียมความพร้อมแอพและอัพโหลดขึ้น Store (Build and published app to store)

  • Preparing the Code
  • Preparing the App Configuration
  • Preparing Third-Party Services
  • Adding Icons & Splash Screens
  • Publishing Android Apps
  • Publishing iOS Apps

Frequently asked questions

Who is Flutter 3 advanced (ขั้นสูง) for, and what background is needed?

Built for นักเรียนนักศึกษา · ครู อาจารย์ วิทยากรที่สนใจ · นักวิชาการ นักไอที หรือผู้ดูและระบบ Background you should have: พื้นฐานการเขียน flutter มาบ้างเล็กน้อย หรือผ่านหลักสูตร flutter for intermediate ขั้นกลางมาแล้ว · มีพื้นฐานภาษา Dart มาบ้าง หากไม่มีจะมีการปรับพื้นฐานให้ก่อนอบรม Not sure the fit is right? Talk to our team on LINE @itgenius or call 02-570-8449.

How much does Flutter 3 advanced (ขั้นสูง) cost and how long does it run?

THB 13,500 (currently THB 12,150 on promotion). The course runs 30 hours. The fee covers course materials, lunch and refreshments throughout. Pay by bank transfer to the company account, confirm it on our payment page, and we can issue the receipt or tax invoice in your company's name.

Do I get a certificate?

Yes. Everyone who completes the course receives a Certificate of Completion from IT Genius Institute. Each certificate carries its own number, and anyone holding that number can verify it online on our certificate page, so you can add it to your portfolio or pass it to HR as evidence of training.

Where does the training take place, and is there an online option?

You can attend onsite at IT Genius Institute or arrange to join online, and we also run it as a private in-house session for your team. Ask about dates and venues on LINE @itgenius or call 02-570-8449.

What if I fall behind or miss a session — can I retake it?

Yes. You may retake the same course free of charge in a later round, under the institute's conditions. Tell our team which course and round you attended, and we will check it and offer you the rounds that still have seats. Ask us on LINE @itgenius or call 02-570-8449.

How do I enrol, or request a quotation for my company?

Enrol online with the registration form on this page. You can register several attendees at once and enter your tax ID and billing address for the tax invoice. Or request a company quotation straight from the quote button. For anything else call 02-570-8449 or reach us on LINE @itgenius.

Instructors

Run this course for your whole team

We run this course in-house, tailored to your stack.

Corporate training quote