ข้ามไปยังเนื้อหา

Flutter สำหรับนักพัฒนา React

คุณคิดเป็น component, props, state และ hooks อยู่แล้ว คอร์สนี้จับคู่ทุกอย่างเข้ากับ Flutter — อะไรเหมือน อะไรต่าง — เพื่อให้คุณลงมือทำได้เร็ว

บทแนะนำ & การติดตั้ง

ทำไมต้อง Flutter, Dart สำหรับนัก JS/TS, toolchain, แอปแรกของคุณ เริ่ม →

React → Flutter: เหมือนและต่าง

ทุกอย่างคือ widget, declarative UI, ไม่มี JSX — อะไรย้ายมาได้ อะไรเปลี่ยน เทียบ →

Widgets & UI

StatelessWidget เทียบ component, props, layout (Row/Column เทียบ flexbox), การจัดสไตล์ สร้าง UI →

State & Lifecycle

setState เทียบ useState; initState/dispose เทียบ useEffect — แมป lifecycle ครบ จัดการ state →

การจัดการข้อมูล

Future เทียบ Promise, การ fetch, FutureBuilder, Provider เทียบ Context/Redux, ฟอร์ม ดึงข้อมูล →

Navigation & Routing

Navigator, named route, go_router (เทียบ react-router), ส่งข้อมูล, tab & drawer นำทาง →

เครื่องมือ ทดสอบ & Deploy

pub/pubspec, flutter CLI, widget test (เทียบ jest/RTL), DevTools, build & CI ส่งงานจริง →

เทียบกับ React ก่อนเสมอ

ทุกแนวคิดเริ่มจาก React ที่คุณรู้ แล้วค่อยแสดงวิธีของ Flutter — พร้อมชี้จุดที่ต่างกัน

รัน Flutter ได้จริง

ทุกตัวอย่างเป็นแอป Flutter ที่สมบูรณ์ พร้อมปุ่ม “Open in DartPad” (คัดลอกโค้ดให้) เพื่อรันบน editor ออนไลน์อย่างเป็นทางการ

แบบทดสอบ & ความคืบหน้า

ทบทวนความเข้าใจหลังแต่ละบท ความคืบหน้าถูกบันทึกไว้ในเครื่อง

สองภาษา

มีทั้งภาษาอังกฤษและไทย — สลับได้ตลอดจากแถบด้านบน