Introduction & Setup
Why Flutter, Dart for JS/TS devs, the toolchain, your first app. Start →
Flutter for React Developers
You already think in components, props, state, and hooks. This course maps all of it to Flutter — what's the same, what's different — so you're productive fast.
What you’ll learn
Section titled “What you’ll learn”React → Flutter: Same vs Different
Everything-is-a-widget, declarative UI, no JSX — what transfers and what changes. Compare →
Widgets & UI
StatelessWidget vs components, props, layout (Row/Column vs flexbox), styling. Build UI →
State & Lifecycle
setState vs useState; initState/dispose vs useEffect — the full lifecycle mapping. Manage state →
Handling Data
Futures vs Promises, fetching, FutureBuilder, Provider vs Context/Redux, forms. Fetch data →
Navigation & Routing
Navigator, named routes, go_router (vs react-router), passing data, tabs & drawer. Navigate →
Tooling, Testing & Deployment
pub/pubspec, the flutter CLI, widget tests (vs jest/RTL), DevTools, builds & CI. Ship it →
How this course works
Section titled “How this course works”Comparison-first
Every concept starts from the React you know, then shows the Flutter way — and flags the differences.
Runnable Flutter
Each example is a complete Flutter app with an “Open in DartPad” button (copies the code) to run on the official online Flutter editor.
Quizzes & progress
Check your understanding after each lesson; your progress is saved locally.
Bilingual
Available in English and ไทย — switch anytime from the top bar.