Flutter Tutorial

Flutter Advanced Lesson 133 of 135 6 min read

Flutter Project Ideas for Beginners to Advanced

Fifteen Flutter app ideas from beginner to advanced, each with the skills it practises, to build your portfolio step by step.

On this page

You learn Flutter by building apps. This page lists projects in rising order of difficulty, each chosen to practise particular chapters of this course.

How to work through them

  1. Build the smallest version that works, then improve it.
  2. Type the code yourself. Do not paste whole screens.
  3. Stay stuck for a while before searching. That effort is where the learning is.
  4. Finish. A complete simple app teaches more than half of an ambitious one.
  5. Polish one project properly: icon, splash screen, empty and error states, dark mode.
  6. Put it on GitHub with screenshots and a README. Three finished apps make a portfolio.

Beginner

Widgets, layout, setState and basic navigation.

1. Tip calculator

Enter a bill amount, choose a tip percentage with a slider, split between a number of people, and see the amount each pays update live.

  • Practises: TextField, Slider, setState, number formatting, layout with Column and Row.

2. Business card or profile screen

A static screen with a photo, name, role, contact rows and social links that open with url_launcher.

  • Practises: CircleAvatar, Card, ListTile, images, themes, spacing.
  • Extend it: a dark mode switch, and an adaptive layout for tablets.

3. Quiz app

Show one question at a time with four answers, keep score, and show a result screen with a restart button.

  • Practises: model classes, lists, state, navigation with a result, buttons.
  • Extend it: load questions from a JSON asset, add a countdown timer and an animated progress bar.

4. Unit converter

Tabs for length, weight and temperature. Choose units from dropdowns and convert as the user types.

  • Practises: TabBar, DropdownMenu, text controllers, enums.

5. To-do list

Add, tick off and delete tasks, with swipe to delete and an empty state.

  • Practises: ListView.builder, Dismissible, keys, dialogs, snackbars with undo.
  • Extend it: save tasks with shared_preferences, add due dates and filters.

Intermediate

State management, networking, storage and forms.

6. Weather app

Search for a city, call a free weather API, and show current conditions and a forecast.

  • Practises: http, JSON models, FutureBuilder or a state holder, loading and error states, pull to refresh.
  • Extend it: use the device’s location, remember recent cities, change the background with the weather.

7. Notes app

Create, edit, search and delete notes stored in SQLite. Pin important notes.

  • Practises: sqflite, CRUD, forms, passing data between screens, PopScope for unsaved changes.
  • Extend it: colours and tags, a grid and list toggle, export to a file.

8. Expense tracker

Record expenses with an amount, category and date. Show a monthly total, a breakdown by category and a chart.

  • Practises: a database, date pickers, Provider or Riverpod, fl_chart, custom themes.
  • Extend it: budgets with warnings, recurring expenses, CSV export.

9. Recipe or movie browser

A grid of items from a public API, a details page with a hero animation, search, and a favourites tab.

  • Practises: GridView, pagination, Hero, go_router, cached images, favourites saved locally.

10. News reader

Headlines by category in tabs, an article page, bookmarks, and offline reading of saved articles.

  • Practises: tabs, a repository with a cache, slivers with a collapsing app bar, share, url_launcher.

11. Habit tracker

Define habits, tick them off each day, and see streaks and a calendar view.

  • Practises: date arithmetic, local notifications, custom painting or a calendar package, animations.

Advanced

Authentication, real-time data, architecture, testing and release.

12. Chat app

Sign up and sign in, see a list of conversations, and exchange messages that appear instantly.

  • Practises: Firebase Auth, Cloud Firestore streams, StreamBuilder, security rules, keyboard handling, push notifications.
  • Extend it: image messages, read receipts, typing indicators, group chats.

13. E-commerce app

Product catalogue with categories and search, product details, a cart, checkout with a form, and order history.

  • Practises: feature-first architecture, MVVM with repositories, state management across many screens, forms and validation, responsive layouts.
  • Extend it: payments in test mode, wish lists, reviews, an admin screen.

14. Fitness or run tracker

Record a walk or run with live location on a map, show distance, pace and time, and keep a history with statistics.

  • Practises: geolocator streams, maps, permissions, background work, a database, charts.

15. Your own product, published

Pick a problem you have yourself, or one a friend or local business has. Design it, build it with tests, and publish it on Google Play.

  • Practises: everything, plus the things tutorials cannot teach: deciding what to leave out, handling real users’ feedback, and maintaining an app after launch.

A quality checklist for portfolio projects

Recruiters and clients open your app for two minutes. These are what they notice.

  • A proper icon, name and splash screen.
  • No overflow stripes on small phones or large tablets.
  • Loading, empty and error states on every data screen.
  • Dark mode works.
  • Forms validate with clear messages.
  • The back button always does something sensible.
  • No crashes when offline.
  • A README with screenshots, what the app does and how to run it.
  • Clean code: sensible folders, no giant files, no unused code.
  • At least a few tests.

Short exercises

Fifteen to thirty minutes each. Good warm-ups.

  1. Rebuild the login screen of an app you use, layout only.
  2. A card that flips over when tapped.
  3. A star rating widget that reports the chosen value through a callback.
  4. A bottom sheet with a form that returns a value.
  5. A list with pull to refresh and infinite scroll.
  6. An animated bar chart built with AnimatedContainer.
  7. A custom progress ring with CustomPaint.
  8. A screen that switches between a bottom bar and a side rail by width.
  9. A search field that waits 400 ms after typing stops before searching.
  10. A theme switcher that remembers the choice after a restart.
  11. An image carousel with page indicator dots (PageView).
  12. An onboarding flow of three pages with a Skip button.
  13. A countdown timer with start, pause and reset.
  14. A form with a date field, a dropdown and validation.
  15. A collapsing header using SliverAppBar.

Where to go next

  • Read good code. The Flutter samples repository and popular open-source apps show how experienced developers structure things.
  • Follow the official documentation at docs.flutter.dev, especially the cookbook and the architecture guide.
  • Go deeper in one area: animations, a state management library, Firebase, or testing.
  • Learn a little native development. Knowing some Kotlin and Swift makes plugin problems far less mysterious.
  • Contribute. Fix a bug or improve the docs of a package you use.
  • Keep your Dart sharp. Flutter skill is built on it. The Dart course is always here.

Try it yourself

Choose one beginner project and finish it this week, to the quality checklist above. Then choose one intermediate project and give it a month.

Practise in the playground Updated