Learnr

Learn Flutter

Build iOS and Android apps from one Dart codebase.

or browse all courses.

Free to start. Built from a single prompt. No credit card.

Flutter is Google's open-source UI toolkit for building apps for iOS, Android, web and desktop from a single Dart codebase. Instead of wrapping native controls, it draws every pixel with its own rendering engine, so your design looks the same on each platform. Everything on screen is a widget, from padding and rows to whole pages, and you compose small widgets into bigger ones. Hot reload shows code changes in a running app within seconds. Beginners learn layout with Row, Column and Expanded, then state and navigation. Learnr builds you a personalized Flutter course and teaches it in short hands-on lessons.

How to learn Flutter, step by step

  1. Learn enough Dart first. Get comfortable with classes, named parameters, null safety and async and await. Flutter code is dense Dart, and most beginner confusion is actually a Dart question in disguise.
  2. Install Flutter and run flutter doctor. Install the SDK, run flutter doctor until it reports no issues, and start an emulator or connect a phone. Create the counter app with flutter create and try hot reload by changing a color.
  3. Think in widgets and constraints. Build a profile card using Container, Padding, Row, Column and Expanded. Learn the rule that constraints go down, sizes go up and the parent sets position, which explains most overflow errors.
  4. Add state, then a state library. Use a StatefulWidget and setState for a to-do list. When state needs sharing across screens, add Provider or Riverpod rather than passing callbacks through five layers.
  5. Connect to an API and navigate. Fetch data with the http package, parse JSON into model classes and show it in a ListView.builder with a loading spinner and an error message. Add a detail screen with Navigator or go_router.
  6. Finish and test one complete app. Polish a small app like a habit tracker, write a widget test, and build a release for a real device. Pair building time with Learnr's daily lessons to keep layout and state concepts fresh.

What you'll learn

  • Compose screens from stateless and stateful widgets
  • Lay out UIs with Row, Column, Stack, Expanded and ListView
  • Manage state with setState and a library like Provider or Riverpod
  • Navigate between screens and pass data
  • Fetch data from an API and show loading and error states

What's inside your Flutter course

A sample path Learnr builds for Flutter. Your real course adapts to your goal and level.

  • 1. Setup, flutter doctor and the widget tree
  • 2. Layout widgets and Material design
  • 3. Stateful widgets, input and forms
  • 4. Navigation and routing
  • 5. Networking, JSON and app state
  • 6. Packages, testing and releasing an app

How long does it take to learn Flutter?

With Dart basics, you can build simple multi-screen apps in about 4 to 8 weeks at 5 to 8 hours a week. Shipping a polished app with state management, testing and store release usually takes 3 to 6 months.

What you need before you start

Basic Dart or another object-oriented language, plus a computer that can run an emulator. Building for iOS requires a Mac with Xcode.

Common mistakes to avoid

  • Nesting everything in one huge build method. Extract small widgets so code stays readable and rebuilds stay cheap.
  • Calling setState or fetching data inside build, which triggers endless rebuilds. Load data in initState or through a state library.
  • Fighting RenderFlex overflow errors by guessing sizes. Learn Expanded, Flexible and scrolling widgets so layouts adapt to screen size.

How Learnr builds your course

Type your topic

Tell Learnr you want to learn Flutter, or get as specific as you like.

Get a personalized course

Learnr instantly builds a full Flutter course tailored to your goal and skill level.

Learn and level up

Move through bite-sized lessons and interactive practice, earning XP and keeping your streak.

Flutter questions, answered

Flutter or React Native: which should I learn?

Flutter uses Dart and draws its own UI for consistent visuals. React Native uses JavaScript and React and renders native components. If you already know React, React Native is the shorter path; otherwise both are solid choices.

Can Flutter apps go on the App Store and Google Play?

Yes. Flutter compiles to native ARM code for iOS and Android, and apps are published through the normal store processes, which require developer accounts.

Explore more courses

More programming and tech courses

See all programming and tech courses

Ready to learn Flutter?

Start your free, personalized Flutter course in seconds. .