Folder Structure

Sizzle Starter uses a feature-based structure, which is a popular approach for structuring large-scale applications. It’s a modular architecture that encapsulates related functionalities within self-contained modules.

General Folder Structure

Code in Sizzle Starter is organized into the following directories:

root - Project directory
├── src - Root of all source code
│   ├── core - Core application code
│   │   ├── assets - Static and generated asset files
│   │   ├── localization - Language files and auto-generated translations
│   │   ├── components - Reusable components
│   │   │   ├── rest_client - REST client
│   │   │   └── database - Drift Database
│   │   └── utils - General purpose utility functions
│   └── feature - Modular feature containers
│       ├── auth - Authentication feature
│       ├── cart - Shopping cart feature
│       └── catalog - Product catalog feature
├── test - Directory for test code
├── pubspec.yaml - Project dependencies and metadata
└── main.dart - Application entry point

Core Directory

The core directory is the heart of your application. It houses utilities and configurations that provide functionality across multiple features. Here are some examples:

• Mixins and Extensions: Commonly used functions or properties that can be mixed into classes.
• Rest Client: Standardized configurations and methods for API requests.
• Database: Database configurations and methods for data access.
• Localization: Language files and auto-generated translations.
• BLoC Observer: Debugging and monitoring tool for the BLoC pattern.
• Theme: Customizable theme data for the application.
• Assets: Static and generated asset files.

Danger

Avoid impulsively moving files to the core directory, it can quickly become bloated. It should be done with careful consideration and only when the code is truly reusable across multiple features.

Feature Directory

The feature directory houses all of the features in your application. Each feature is a self-contained module that encapsulates its own logic and widgets. It’s a modular architecture that allows you to easily add and remove features.

Let’s take a look at the catalog feature:

catalog - Product catalog feature
├── bloc - Business logic components
│   ├── catalog_bloc.dart - Catalog BLoC
│   └── catalog_event.dart - Catalog BLoC events
├── model - Dtos and entities
├── data - Data layer
│   ├── repository - Repository
│   └── data_source - Data source
└── widget - Widgets layer
    ├── catalog_screen.dart - Catalog Screen
    ├── product_card.dart - Product Card
    └── product_details_screen.dart - Product Details Screen

Tip

Dependencies between features should be minimized to avoid coupling.