Dart Foundations
ภาษา Dart ที่ Flutter dev ต้องรู้ — null safety, class & mixin และ async ด้วย Future/Stream เริ่ม →
Dart Foundations
ภาษา Dart ที่ Flutter dev ต้องรู้ — null safety, class & mixin และ async ด้วย Future/Stream เริ่ม →
Everything Is a Widget
แนวคิด widget, stateless vs stateful, build & BuildContext และ three tree ประกอบ →
Layout & Rendering
constraints ลงล่าง size ขึ้นบน — layout algorithm, core widget, sliver และ render pipeline จัด layout →
State Management
setState & lifecycle, InheritedWidget, Provider/Riverpod, BLoC และ state ควรอยู่ที่ไหน จัดการ →
Navigation & App Structure
Navigator, declarative routing & deep link, app scaffolding และ platform channel navigate →
Async, Performance & Rendering
FutureBuilder/StreamBuilder, ลด rebuild, animation และ isolate สำหรับงานหนัก optimize →
Tooling, Testing & Production
toolchain, unit/widget/golden test, build mode & flavor และเรื่อง production ship →
Flutter ทำงานอย่างไรข้างใน
three trees จาก source ของ framework, การ schedule build กับ frame, layout กับ paint ข้างในด้วย RenderBox ที่เขียนเอง, Impeller กับ GPU และ Dart VM กับ isolate — ทุก claim พิสูจน์ด้วย widget test, build จริง และ permalink ของ source ที่ Flutter 3.47.5 ดูข้างใน →
อ่านโค้ด Flutter ที่ AI เขียน
catalog 28 bug ที่ Flutter จาก AI เขียนผิด (state, key, layout, async, navigation, release config), review checklist, บันได verification tool (analyze strict mode, riverpod_lint, test, wasm build) พร้อม DartPad และ worked review 3 ชุด — ทุก bug พิสูจน์จริง ไป review →
เข้าใจ model ก่อน แล้วค่อยดู code
ทุกหัวข้อเริ่มจาก model — three tree, constraints algorithm, rebuild propagate อย่างไร — พอเข้าใจแล้ว behavior ของ Flutter จะเลิกดูเหมือนเวทมนตร์และกลายเป็นเรื่องที่สมเหตุสมผล
Dart ก่อน แล้วค่อย Flutter
Flutter คือ Dart คอร์สเริ่มจากความลึกของ Dart ที่ Flutter dev ต้องใช้จริง — null safety, async, mixin — ก่อนจะแตะ widget ตัวแรก
เน้นการออกแบบ ไม่ใช่แค่ syntax
ไม่ใช่แค่ “นี่คือ ListView” แต่เป็น “constraints และ sliver ทำให้ scroll ทำงานอย่างไร และทำไม list ถึง jank” คุณจะ reason เรื่อง layout และ performance ได้อย่างมั่นใจ
ไดอะแกรมที่อธิบายได้
widget/element/render tree, constraint flow, render pipeline และ state propagation เป็นไดอะแกรม Mermaid ที่รองรับธีม สองภาษา (English / ไทย) พร้อมบันทึกความคืบหน้า quiz