Project architecture and layers
In 2024 the Flutter team published an official app architecture guide, and the model it recommends splits into two main layers:
- The UI layer — widgets and the objects that hold state (a ViewModel, Notifier or Bloc). Its job is to display and to forward user actions
- The data layer — repositories and services. A repository hides where data comes from (network, cache, local database); a service talks to one concrete source
The rule between them is simple: the UI never calls HTTP directly. It asks a repository for a domain object and does not know the source.
| Layer | Responsibility | What it must NOT know |
|---|---|---|
| Widget | Displaying, forwarding events | The API's JSON shape or HTTP status codes |
| ViewModel / Bloc | Managing screen state | The networking library (dio/http) |
| Repository | Choosing the source, cache policy | Widgets or `BuildContext` |
| Service | Talking to one source (API, DB) | Business rules |
Interview tip. Listing package names is a weak answer to "how do you structure a project?". A strong one shows the direction of dependencies: UI → repository → service, never the reverse. Give the practical payoff: because the repository is an interface, tests substitute a fake and the screen can be tested without a network. Add one nuance: with complex business rules I introduce a use case layer in between, but on simple CRUD that would be pure boilerplate.
📚 Sources and documentation
- App architectureofficialdocs.flutter.dev
- Architecture guideofficialdocs.flutter.dev
The responsibilities of the UI and data layers, and the boundary between them, are defined here.
- Architecture case studyofficialdocs.flutter.dev