DEV Community

Cover image for πŸ”§ Flutter Clean Architecture - Fast Feature-First Setup Guide
Shan
Shan

Posted on

1

πŸ”§ Flutter Clean Architecture - Fast Feature-First Setup Guide

πŸ“˜ Note: This is a fast and simple setup guide for structuring Flutter projects using Clean Architecture with a feature-first approach. It is consolidated from multiple references and shaped by practical experience in real projects. Intended for quick implementation. This is how i structure and work on projects.


πŸ§ͺ Step-by-Step Plan


1. Analyze the Figma Design

  • Review the Figma design thoroughly.
  • Identify all distinct features based on the UI/UX.
  • Each feature should be represented as a folder inside the features/ directory.

2. Define API Properties per Feature

  • For each feature, identify the API endpoints it depends on.
  • Extract only the necessary properties from each API response (avoid using the entire response).

3. Create the features/ Folder

  • Add a subfolder for each feature inside features/.
  • Each feature will contain its own:
    • data/
    • domain/
    • presentation/

4. Create Data Models (DTOs)

  • Define models inside features/<feature>/data/models/.
  • Deserialize only the fields needed from the API.
  • Add a toEntity() method to convert the model to its corresponding entity.

5. Define the Entity Object

  • Place entity classes inside features/<feature>/domain/entities/.
  • These classes:

    • Contain business logic
    • Do not contain fromJson / toJson
  • Add validation and domain-level calculations here.

6. Create the Data Source Layer

  • Inside features/<feature>/data/datasources/:
    • Define an abstract class (e.g., UserRemoteDataSource)
    • Implement a concrete class (e.g., UserRemoteDataSourceImpl) using http
  • This layer returns models, not entities.
  • Optionally, support local data sources (Hive, SharedPreferences, etc.).

7. Create the Repository Layer

  • Define an abstract repository in features/<feature>/domain/repositories/.
    • Return entities, not models.
  • Implement the repository in data/repositories/:
    • Use the data source abstract class, not concrete one [0].
    • Optionally use multiple data sources.
    • Use try/catch for error handling.
    • Return results using the Result pattern [2].

8. Create the Use Cases Layer

  • Inside features/<feature>/domain/usecases/, define use case classes.
  • Each use case:
    • Performs one responsibility
    • Depends on the repository abstract class
    • Returns either entities or Result

9. Create the Presentation Layer

  • Inside features/<feature>/presentation/:
    • Add ui/ (screens, widgets)
    • Add controllers/ (ViewModels, BLoC, etc.)
  • Separate screens and controllers for each UI if needed.
  • Use internationalization for all labels and strings.

10. Create Shared and Core Folders

  • Outside features/, create:
    • shared/: Shared features.
    • core/: constants, error handling, API clients, utilities
  • These folders hold reusable components for the entire app.

πŸ” Example Folder Structure

lib/
β”œβ”€β”€ core/
β”‚   └── (helpers, utils, constants, etc.)
β”œβ”€β”€ shared/
β”‚   └── (shared features)
β”œβ”€β”€ features/
β”‚   β”œβ”€β”€ <feature_name>/
β”‚   β”‚   β”œβ”€β”€ data/
β”‚   β”‚   β”‚   β”œβ”€β”€ models/
β”‚   β”‚   β”‚   β”œβ”€β”€ datasources/
β”‚   β”‚   β”‚   └── repositories/
β”‚   β”‚   β”œβ”€β”€ domain/
β”‚   β”‚   β”‚   β”œβ”€β”€ entities/
β”‚   β”‚   β”‚   β”œβ”€β”€ repositories/
β”‚   β”‚   β”‚   └── usecases/
β”‚   β”‚   └── presentation/
β”‚   β”‚       β”œβ”€β”€ ui/
β”‚   β”‚       └── controllers/
Enter fullscreen mode Exit fullscreen mode

πŸ“š References

Feature flag article image

Create a feature flag in your IDE in 5 minutes with LaunchDarkly’s MCP server 🏁

How to create, evaluate, and modify flags from within your IDE or AI client using natural language with LaunchDarkly's new MCP server. Follow along with this tutorial for step by step instructions.

Read full post

Top comments (0)

Developer-first embedded dashboards

Developer-first embedded dashboards

Embed in minutes, load in milliseconds, extend infinitely. Import any chart, connect to any database, embed anywhere. Scale elegantly, monitor effortlessly, CI/CD & version control.

Get early access

πŸ‘‹ Kindness is contagious

Explore this practical breakdown on DEV’s open platform, where developers from every background come together to push boundaries. No matter your experience, your viewpoint enriches the conversation.

Dropping a simple β€œthank you” or question in the comments goes a long way in supporting authorsβ€”your feedback helps ideas evolve.

At DEV, shared discovery drives progress and builds lasting bonds. If this post resonated, a quick nod of appreciation can make all the difference.

Okay