Flutter Tutorial
/

Flutter Intermediate Chapter 19 of 20

Flutter App Projects

Flutter projects with source code you can run in the browser: calculator, BMI, to-do, quiz, weather app, notes (Riverpod), cart (Provider), expenses (Bloc).

The best way to learn Flutter is to build complete apps. Each project here is one file you can Run in the browser, with an explanation of how it works and ideas to make it your own. They start easy and get harder, and the later ones use the state management packages from the earlier chapters.

Put the finished projects on GitHub: together they make a good beginner portfolio.

Lessons in this chapter

  1. Calculator App in Flutter (Beginner Project with Source Code)Build a calculator app in Flutter: a button grid with Row, Column and Expanded, + − × ÷, percent and error handling. Beginner project, full runnable code.
  2. BMI Calculator App in Flutter (Beginner Project with Source Code)Make a BMI calculator in Flutter with sliders, metric and imperial units, and a coloured result card. Beginner project with full runnable code.
  3. To-Do App in Flutter with Local Storage (Project with Source Code)Build a to-do app in Flutter: add, complete, swipe to delete with undo, filters, and saving tasks with shared_preferences. Full runnable source code.
  4. Quiz App in Flutter (Project with Source Code)Build a quiz app in Flutter: answer buttons that turn green or red, a progress bar, a score screen and restart. Beginner project with runnable source code.
  5. Weather App in Flutter with a Free API (Project with Source Code)Build a weather app in Flutter that searches any city and shows live weather from the free Open-Meteo API, with http, JSON and loading states.
  6. Notes App in Flutter with Riverpod (Project with Source Code)Build a notes app in Flutter with Riverpod: a Notifier, search, derived providers and an edit screen with immutable state. Full runnable source code.
  7. Shopping Cart App in Flutter with Provider (Project with Source Code)Build a shopping cart in Flutter with Provider: product grid, quantities, cart badge, total price and checkout using ChangeNotifier. Full runnable code.
  8. Expense Tracker App in Flutter with Bloc/Cubit (Project with Source Code)Build an expense tracker in Flutter with Cubit (flutter_bloc): immutable state, a form in a bottom sheet, categories and totals. Full runnable code.