Flutter and Dart

What Flutter and Dart are and when to choose them, your first Dart program in DartPad, variables and types, control flow and collections, and functions with named and optional parameters. After this module you can write small Dart programs and read the Dart code you will meet in every Flutter app.

1. Flutter and Dart: the big pictureFlutter is Google's toolkit for building apps for Android, iOS, the web and desktop from one codebase, and Dart is the language Flutter apps are written in. Flutter draws every pixel itself with its own rendering engine, so apps look the same everywhere. Dart compiles to fast native code for release and supports hot reload during development.20 min
2. Your first Dart program, variables and typesDart programs start in void main(). print shows a line. Declare variables with var (type inferred), an explicit type, final (set once at run time) or const (fixed at compile time). Common types are int, double, num, String and bool. String interpolation puts values into text with $name and ${expression}. Use ~/ for integer division and int.tryParse for safe conversion.30 min
3. Control flow and collectionsDart has if/else, for, for-in, while and do-while loops, and switch, which in Dart 3 can also be an expression that returns a value. The main collections are List (ordered), Set (unique) and Map (key-value). Collection if, collection for and the spread operator ... let you build lists declaratively, a style Flutter uses for lists of widgets.30 min
4. FunctionsFunctions have a return type, a name and parameters. Short ones use arrow syntax: int square(int n) => n * n. Parameters can be positional, optional positional in [ ], or named in { }, where named ones can be required or have defaults. Functions are values: you can pass anonymous functions as arguments, which is exactly how Flutter's onPressed: () { ... } works.30 min

Sound null safety and its operators, classes and every kind of constructor Flutter uses, inheritance, interfaces, mixins and extension methods, and the Dart 3 features records, patterns, enhanced enums and sealed classes. After this module you can model app data cleanly and understand the classes behind every Flutter widget.

1. Sound null safetyIn Dart 3, a variable of type String can never be null; String? can. The compiler forces you to handle possible nulls with ?. (safe access), ?? (default value), ??= (assign if null), flow analysis after a null check, or ! (which throws if the value is null). late promises a non-null value will be set before use, and required marks named parameters that must be passed.30 min
2. Classes and constructorsA class groups data (fields) and behaviour (methods). Dart constructors can use this.field shorthand, named constructors such as Product.fromJson, initializer lists, const constructors for compile-time constant objects, and factory constructors that can return cached or subclass instances. A name starting with _ is private to its library (file). Getters and setters look like fields but run code.35 min
3. Inheritance, interfaces, mixins and extensionsextends creates a subclass that inherits and can override (@override) members; super calls the parent. Abstract classes define members subclasses must implement. Every class is also an implicit interface that other classes can implement. Mixins (mixin ... with) share behaviour across unrelated classes, and extension methods add functions to existing types like String without changing them.30 min
4. Dart 3: enums, records, patterns and sealed classesEnhanced enums can have fields, constructors and methods. Records group a few values without a class, like (String, int) or ({int lat, int lng}). Patterns destructure values in switch, if-case and variable declarations. A sealed class has a fixed set of subclasses in its library, so a switch over it is checked for exhaustiveness: perfect for UI states like Loading, Success and Error.35 min

How Dart handles slow work on a single thread with an event loop, Futures with async/await, streams of many values, isolates for heavy computation, and how to add and choose packages from pub.dev with pubspec.yaml. After this module you can write non-blocking Dart code for network calls and live data, and add libraries to any Dart or Flutter project.

1. Futures and async/awaitA Future is a value that will be ready later, such as the result of a network call. Mark a function async and use await to pause it until a Future completes, without freezing the app: Dart's event loop keeps handling other work meanwhile. Handle errors with try/catch/finally, and run independent Futures together with Future.wait.35 min
2. StreamsA Future gives one value later; a Stream gives many values over time, like live scores or chat messages. Listen with listen() or await for. Create streams with async* functions and yield, or with a StreamController, which can be single-subscription or broadcast. Always cancel subscriptions and close controllers you create. Flutter shows streams with StreamBuilder, and Firestore delivers live data as streams.30 min
3. Isolates for heavy workasync/await keeps the app responsive while waiting, but heavy CPU work (parsing a huge JSON, processing an image) still runs on the main isolate and causes jank. An isolate is a separate worker with its own memory that communicates only by messages. Use Isolate.run (or Flutter's compute) to run a heavy function in the background and get its result back.25 min
4. Packages and pubpub is Dart's package manager and pub.dev is the public package site. pubspec.yaml lists your project's name, SDK constraint, dependencies and dev_dependencies (and, in Flutter, assets and fonts). Add packages with dart pub add or flutter pub add, which update pubspec.yaml and run pub get. A caret version like ^1.2.0 allows compatible updates; pubspec.lock records exact versions. Choose packages by quality signals, not popularity alone.25 min

Install Flutter and fix every flutter doctor warning, understand the project folders and the difference between hot reload and hot restart, learn that everything on screen is a widget in a tree, and build interactive screens with stateless and stateful widgets. After this module you can create, run and change a Flutter app on an emulator or your own phone.

1. Installing FlutterInstall the Flutter SDK (which includes Dart), add its bin folder to your PATH, and run flutter doctor, which checks your setup and tells you what is missing: the Android toolchain, Android licences, Chrome for web, Xcode for iOS (Mac only) and Visual Studio for Windows desktop apps. Use VS Code or Android Studio with the Flutter extension, and an emulator or your own phone.35 min
2. Project structure and hot reloadflutter create makes a project with lib/main.dart (your Dart code), pubspec.yaml (packages and assets), platform folders (android, ios, web and others), test/ and analysis_options.yaml. flutter run starts the app. Hot reload (r) injects code changes in about a second and keeps the app's state; hot restart (R) restarts the Dart code and resets state; some changes need a full restart.30 min
3. Everything is a widgetIn Flutter, everything on screen is a widget: text, buttons, padding, layouts and the whole app. Widgets are nested into a tree. Each widget's build method returns the widgets it is made of, and BuildContext is its location in the tree, used to look things up like Theme.of(context). MaterialApp sets up the app, and Scaffold gives a screen its standard structure with an AppBar and body.35 min
4. Stateless and stateful widgetsA StatelessWidget only depends on its constructor arguments. A StatefulWidget has a separate State object that keeps data which can change; calling setState tells Flutter to rebuild with the new data. The State lifecycle has initState (set up once), build, didUpdateWidget, and dispose (clean up controllers and subscriptions). After an await, check mounted before calling setState.35 min

Arrange widgets with Row and Column, size and space them with Container, Padding, SizedBox, Expanded and Flexible, layer them with Stack and Positioned, understand Flutter's constraint rules and fix overflow errors, and add images, icons, fonts and a theme. After this module you can turn almost any screen design into a working Flutter layout.

1. Row and ColumnColumn places children vertically and Row horizontally. The main axis is the direction they lay out (vertical for Column, horizontal for Row); the cross axis is the other one. mainAxisAlignment spaces children along the main axis, crossAxisAlignment positions them across it, and mainAxisSize decides whether the Row or Column takes all available space or only what it needs.30 min
2. Container, Padding, SizedBox, Expanded and FlexibleContainer combines padding, margin, size, colour and decoration (BoxDecoration with rounded corners, borders and shadows). Padding adds space inside, SizedBox sets a fixed size or gap. Inside a Row or Column, Expanded makes a child fill the remaining space, Flexible lets it take up to its share, flex factors divide space in proportions, and Spacer pushes siblings apart.30 min
3. Stack, Positioned and AlignStack places children on top of each other, the last child on top. Position children with Positioned (distances from the Stack's edges) or Align (a relative position such as Alignment.topRight). Use Stack for badges on icons, text over images and floating labels; set fit and clipBehavior to control sizing and overflow.25 min
4. Understanding constraints and fixing overflowFlutter layout follows one rule: constraints go down, sizes go up, and the parent sets the position. A parent tells each child the minimum and maximum width and height it may have; the child picks a size within them. Tight constraints force an exact size; loose ones set only a maximum. Most layout errors, such as "RenderFlex overflowed by N pixels" and unbounded height, come from breaking this rule, and are fixed with Expanded, Flexible, scrolling or a bounded size.35 min
5. Images, icons, fonts and themesShow images from your app with Image.asset after declaring them in pubspec.yaml, or from the internet with Image.network (with loading and error builders). Icons come from Icons.*. Custom fonts are declared in pubspec.yaml. ThemeData with ColorScheme.fromSeed sets colours for the whole app, Theme.of(context).textTheme gives consistent text styles, and darkTheme with themeMode supports dark mode.30 min

Show long lists efficiently with ListView.builder, build product grids with GridView, move between screens with Navigator and pass data both ways, set up URL-based routing with go_router, and build validated forms with Form and TextFormField. After this module you can build a complete multi-screen app flow: list, details, and a form to submit.

1. Lists with ListViewListView shows a scrollable list. Use the plain ListView(children: [...]) only for short, fixed lists. For long or dynamic lists use ListView.builder, which builds items lazily as they scroll into view. ListView.separated adds dividers. ListTile gives a ready row layout, Dismissible adds swipe-to-delete, and RefreshIndicator adds pull-to-refresh.30 min
2. Grids with GridViewGridView shows items in a scrollable grid. GridView.count sets a fixed number of columns for short grids; GridView.builder builds items lazily with a grid delegate: SliverGridDelegateWithFixedCrossAxisCount (fixed columns) or SliverGridDelegateWithMaxCrossAxisExtent (as many columns as fit a maximum tile width). childAspectRatio controls tile shape, and spacing properties add gaps.25 min
3. Navigator basicsNavigator manages a stack of screens (routes). Navigator.push(context, MaterialPageRoute(builder: ...)) opens a new screen on top; Navigator.pop(context) goes back. Pass data forward through the new screen's constructor, and return a result by awaiting push and passing a value to pop. pushReplacement swaps the current screen, for example after login, and PopScope controls the back button.30 min
4. Routing with go_routerFor apps with many screens, deep links and the web, use a router package. go_router, published by the Flutter team, defines routes with URL paths like /product/:id, reads path parameters from state.pathParameters, and plugs into MaterialApp.router. context.go replaces the current location; context.push adds a screen on top. Redirects handle login checks, and ShellRoute keeps a shared layout such as a bottom bar.30 min
5. Forms and validationWrap fields in a Form with a GlobalKey<FormState>. Each TextFormField has a validator that returns an error message or null. Calling _formKey.currentState!.validate() checks every field and shows errors. Use TextEditingController to read or set text (and dispose it), keyboardType for the right keyboard, obscureText for passwords, inputFormatters to restrict input, and autovalidateMode to re-check as the user types.35 min

Understand local and app-wide state, lift state up and see why passing it everywhere breaks down, share state with Provider and ChangeNotifier, get an overview of Riverpod and of Bloc/Cubit, and choose the right approach for a project. After this module you can share data like a cart or a logged-in user across many screens cleanly and explain your choice in an interview.

1. What state is, and setStateState is data that changes and affects what the screen shows. Ephemeral (local) state belongs to one widget, like whether a password is visible; use setState for it. App state is shared by many screens, like the cart or the logged-in user. Lifting state up to a common parent and passing callbacks down works for a few levels, but deep "prop drilling" becomes painful, which is why InheritedWidget and the packages built on it exist.30 min
2. Provider and ChangeNotifierProvider is a widely used, simple package for sharing state. Put your state in a class that extends ChangeNotifier and calls notifyListeners() after changes. Place a ChangeNotifierProvider above the widgets that need it (MultiProvider for several). Read it with context.watch<T>() in build (rebuilds on change) or context.read<T>() in callbacks (no rebuild); Consumer and Selector limit rebuilds to small parts.35 min
3. Riverpod overviewRiverpod is a state management library by the author of Provider, designed to be compile-safe, testable and independent of the widget tree. You wrap the app in ProviderScope, declare providers as global, immutable definitions, and read them with ref.watch and ref.read in ConsumerWidgets. Notifier classes hold changeable state, and FutureProvider handles async data with loading, error and data states. Riverpod 3 changed some APIs, so check riverpod.dev for current syntax.30 min
4. Bloc, Cubit and choosing an approachThe bloc library separates business logic from UI using streams. A Cubit exposes methods that emit new states; a Bloc receives events and maps them to states. BlocProvider provides them, BlocBuilder rebuilds on state changes and BlocListener reacts once (for navigation or SnackBars). Bloc suits large teams that want strict structure. For most apps, pick one approach (Provider, Riverpod or Bloc), learn it well and use it consistently.30 min

Call REST APIs with the http package and show loading and error states with FutureBuilder, turn JSON into typed model classes by hand or with json_serializable, store data on the device with shared_preferences, secure storage and SQLite, and use Firebase for login, a real-time cloud database and more. After this module you can build Flutter apps that work with real data online and offline.

1. HTTP requests and FutureBuilderMost apps load data from a web API over HTTP. With the http package, await http.get(Uri.parse(url)) returns a Response with a statusCode and body; check the status, then jsonDecode the body. Show the result with FutureBuilder, creating the Future once in initState (never in build), and handle loading, error and data. Android release builds need the INTERNET permission in the main AndroidManifest.xml.35 min
2. JSON modelsDo not pass raw Map<String, dynamic> around your app. Convert JSON into model classes with a factory fromJson constructor and a toJson method, with null-safe parsing and sensible defaults. For many models, json_serializable with build_runner generates this code from annotations. Validate data at the edge, so bad server data shows an error instead of crashing deep inside a widget.30 min
3. Local storageChoose storage by the kind of data. shared_preferences stores small key-value settings (theme, language, onboarding seen), never secrets. flutter_secure_storage keeps tokens in the platform's secure storage (Keychain on iOS, encrypted storage on Android). For structured data like orders or notes, use SQLite through sqflite or the drift package. path_provider gives the right folders for files.30 min
4. Firebase in FlutterFirebase gives Flutter apps ready backend services. Set it up with the FlutterFire CLI (flutterfire configure), add firebase_core and call Firebase.initializeApp in main after WidgetsFlutterBinding.ensureInitialized(). Use Firebase Auth for email, phone OTP or Google sign-in, Cloud Firestore for a real-time NoSQL database read with snapshots() and StreamBuilder, and always write security rules. Crashlytics and Cloud Messaging add crash reports and push notifications.35 min

Add motion with implicit animations, take full control with AnimationController and Tween, create shared-element Hero transitions and use designer-made Lottie or Rive animations, then keep apps smooth with const widgets, smaller rebuilds, keys, lazy lists, sensible image sizes, profile mode and DevTools. After this module your apps feel polished and stay fast even on budget phones.

1. Implicit animationsImplicit animations animate automatically when a property changes. Use AnimatedContainer, AnimatedOpacity, AnimatedAlign, AnimatedPadding and others: give them a duration and an optional curve, change the value with setState, and Flutter animates from the old value to the new one. AnimatedSwitcher cross-fades between different child widgets, and TweenAnimationBuilder animates any value you choose.30 min
2. Explicit animationsExplicit animations give full control: an AnimationController (created in initState with vsync from SingleTickerProviderStateMixin) runs from 0 to 1 over a duration, and you can forward, reverse, repeat or stop it. Tweens map that range to sizes, colours or offsets, CurvedAnimation adds easing, and AnimatedBuilder (or transition widgets like FadeTransition) rebuilds only the animated part. Always dispose the controller.35 min
3. Hero, page transitions and Lottie or RiveA Hero animation flies a shared element, such as a product image, from one screen to the next when both use the same tag. PageRouteBuilder lets you design custom page transitions. For complex, designer-made animations, use the lottie or rive packages instead of coding them. Respect the user's reduce-motion setting with MediaQuery, and do not over-animate.25 min
4. PerformanceSmooth apps draw each frame within about 16 ms (60 fps) or less on high-refresh screens. Use const constructors, split big widgets so less rebuilds, keep build methods light, use lazy lists, size images sensibly (cacheWidth), and use keys when list items move. Measure in profile mode (flutter run --profile) on a real device with DevTools before optimising.35 min

Make layouts that adapt to phones, tablets, foldables, the web and desktop with MediaQuery, LayoutBuilder and breakpoints; then prove the app works with unit tests, widget tests and integration tests, and run them automatically with flutter analyze, dart format and CI. After this module your apps look right on every screen and you can change code with confidence.

1. Responsive and adaptive designResponsive design changes the layout to fit the available space; adaptive design also fits the platform and input (touch, mouse, keyboard). Read the screen size with MediaQuery.sizeOf(context) or, better for a single widget, the space it is given with LayoutBuilder. Pick layouts with breakpoints (for example under 600 wide for phones, 600 to 840 for tablets, larger for desktop), use SafeArea for notches, Wrap for flowing content, and test with large text sizes.35 min
2. Unit testsUnit tests check plain Dart logic: models, validators, calculations and state classes. Write them in the test/ folder with test(), check results with expect() and matchers like equals, isTrue, isNull and throwsA, group related tests with group(), and prepare data in setUp(). Run them with flutter test. Use fakes or mocks (for example with mocktail) for dependencies like APIs.30 min
3. Widget testsWidget tests build a widget in a test environment and interact with it like a user, without a real device. Use testWidgets with a WidgetTester: pumpWidget(MaterialApp(home: ...)) to show it, find.text, find.byType, find.byKey and find.byIcon to locate widgets, tap and enterText to interact, pump or pumpAndSettle to let the UI rebuild and animations finish, and matchers like findsOneWidget and findsNothing.35 min
4. Integration tests and CIIntegration tests run the whole app on a real device or emulator and follow complete user journeys, using the integration_test package with the same finders and actions as widget tests. Run them with flutter test integration_test. Keep quality high automatically: flutter analyze for static analysis, dart format for consistent style, and a CI workflow (for example GitHub Actions) that runs analysis and tests on every push.30 min

Prepare a Flutter app for release (name, icon, version, obfuscation, privacy), publish an Android App Bundle on Google Play with a safely stored upload key, ship an iOS build through Xcode, TestFlight and App Store review, and deploy Flutter web builds. After this module you can take a Flutter app from your laptop to real users on Android, iPhone and the web.

1. Preparing a releaseBefore publishing, set a unique application ID (Android) and bundle identifier (iOS), the display name, launcher icons (flutter_launcher_icons helps) and a splash screen. The version line in pubspec.yaml, such as 1.0.0+1, sets the version name and build number; the build number must increase for every upload. Release builds can be obfuscated with --obfuscate --split-debug-info. Remove debug code and prepare a privacy policy.30 min
2. Publishing on Google PlayCreate an upload keystore with keytool, keep it and its passwords safe, reference it from a key.properties file that is never committed, configure release signing in android/app/build.gradle(.kts), and run flutter build appbundle. Upload the .aab to Google Play Console (one-time US$25 registration), fill in the store listing, Data safety and content rating, and release through testing tracks. New personal accounts must complete a closed test first; check the current rules.35 min
3. Publishing on the Apple App StoreiOS apps must be built on a Mac with Xcode. Join the Apple Developer Program (US$99 per year), register a bundle ID, let Xcode manage signing, set version and build numbers, and run flutter build ipa. Upload with Xcode's Organizer or the Transporter app, test with TestFlight, complete the App Store Connect listing and privacy details, and submit for App Review. Common rejections are crashes, incomplete information and missing demo accounts.35 min
4. Flutter on the web and desktopflutter build web produces static files in build/web that any static host can serve, such as Firebase Hosting or GitHub Pages; set --base-href when the app is not at the root path. Flutter can also compile to WebAssembly with flutter build web --wasm for better performance in supporting browsers. Flutter web suits app-like experiences (dashboards, tools, internal apps) rather than SEO-heavy content sites. Desktop builds target Windows, macOS and Linux.25 min

An honest look at Flutter jobs and freelancing in India, the Dart and Flutter interview questions you will be asked with model answers, how to handle take-home assignments, and how to build a portfolio and keep growing. After this module you can plan your Flutter career, answer common interview questions clearly and show work that gets you shortlisted.

1. Flutter jobs and freelancing in IndiaFlutter developers work at startups, product companies, IT service companies and app agencies, or as freelancers building apps for local businesses. Job posts commonly ask for Dart, widgets and layouts, one state management approach (Provider, Riverpod or Bloc), REST APIs, Firebase, Git and publishing experience. Pay varies widely by city, company and skill; treat any salary range as approximate.25 min
2. Interview questions: DartDart interview questions check language understanding: final versus const, null safety operators, Future versus Stream, async/await and the event loop, isolates, mixins versus inheritance, extension methods, factory constructors, records, patterns and sealed classes. Answer with a definition, the reason it exists, a tiny example and one pitfall.35 min
3. Interview questions: FlutterFlutter interviews cover the widget, element and render object trees, stateless versus stateful widgets and the State lifecycle, BuildContext, keys, setState versus Provider/Riverpod/Bloc, hot reload versus hot restart, the constraints rule, performance, testing and publishing. Many companies also give a take-home assignment, judged on clean structure, states handled, responsiveness and tests.35 min
4. Portfolio and next stepsBuild 3 or 4 portfolio apps that show different skills: a local-storage app, an API app with state management, a Firebase app, and one published on the Play Store (and ideally a web demo). Each needs a clear GitHub README with screenshots. Join the Flutter community (meetups, GDG events, Flutter India groups), follow release notes, and keep a 90-day plan.25 min