building-flutter-apps

abhishekbrt's avatarfrom abhishekbrt

Build production-ready Flutter apps for Android/iOS using feature-first architecture. Covers project setup, UI patterns, state management (Riverpod/BLoC), navigation (go_router), testing (TDD with mocktail), and deployment. Use when creating Flutter projects, implementing features, debugging Flutter issues, or making architectural decisions.

⭐0stars🔀0forks📁View on GitHub🕐Updated Jan 4, 2026
[Code Generation]

When & Why to Use This Skill

This Claude skill empowers developers to build production-ready Flutter applications for Android and iOS using a robust feature-first architecture. It provides end-to-end guidance on project initialization, Material 3 UI patterns, advanced state management (Riverpod/BLoC), and TDD-driven testing, ensuring the delivery of scalable, high-performance mobile software.

Use Cases

  • Bootstrap a new Flutter project with a professional feature-first directory structure and standardized configurations.
  • Implement complex business logic and state management using Riverpod or BLoC based on specific feature requirements.
  • Develop high-quality UI components and responsive layouts following Material 3 design principles.
  • Apply Test-Driven Development (TDD) workflows with mocktail to ensure code reliability and simplify debugging.
  • Prepare and optimize applications for production, including build configuration and deployment to the App Store and Google Play.
namebuilding-flutter-apps
descriptionBuild production-ready Flutter apps for Android/iOS using feature-first architecture. Covers project setup, UI patterns, state management (Riverpod/BLoC), navigation (go_router), testing (TDD with mocktail), and deployment. Use when creating Flutter projects, implementing features, debugging Flutter issues, or making architectural decisions.

Building Flutter Apps

Quick Start

flutter create --org com.yourcompany --project-name my_app ./my_app
cd my_app && flutter run

Skill Guides

Area Guide Use When
Architecture architecture/SKILL.md Project structure, DI, repository pattern
UI Building ui/SKILL.md Layouts, Material 3, responsive design
State Management state-management/SKILL.md Riverpod, BLoC, state patterns
Testing testing/SKILL.md TDD, unit/widget tests, mocking
Project Setup project-setup.md New projects, pubspec, flavors
Navigation navigation.md go_router, deep links, transitions
Animations animations.md Implicit, explicit, Hero animations
Performance performance.md Optimization, profiling, app size
Deployment deployment.md App store builds, CI/CD, signing
Platform Integration platform-integration.md Platform channels, permissions
Packages packages.md Essential packages, creating plugins

Feature-First Project Structure

lib/
├── main.dart
├── app.dart                    # MaterialApp configuration
├── core/                       # Shared across all features
│   ├── providers/              # Core Riverpod providers
│   │   ├── api_client_provider.dart
│   │   └── shared_preferences_provider.dart
│   ├── network/api_client.dart
│   ├── error/failures.dart
│   ├── theme/app_theme.dart
│   └── widgets/                # Truly reusable widgets only
├── features/
│   ├── auth/
│   │   ├── data/
│   │   │   ├── datasources/
│   │   │   ├── models/
│   │   │   ├── repositories/auth_repository_impl.dart
│   │   │   └── providers/auth_repository_provider.dart
│   │   ├── domain/
│   │   │   ├── entities/
│   │   │   └── repositories/auth_repository.dart  # Interface
│   │   └── presentation/
│   │       ├── providers/auth_provider.dart
│   │       ├── screens/
│   │       └── widgets/
│   ├── home/
│   │   ├── data/
│   │   ├── domain/
│   │   └── presentation/
│   └── [other_features]/
└── config/
    ├── routes.dart
    └── environment.dart

Decision Guides

What to Build?

Task Start Here
New project project-setup.md → architecture/
New feature architecture/ → Write interface → TDD
UI screen ui/ → state-management/
Fix performance performance.md
Release app deployment.md

State Management Choice

Scenario Use
Form input, toggle, local UI state setState
Single value shared across widgets ValueNotifier or StateProvider
Feature with loading/error states AsyncNotifierProvider (Riverpod)
Mutable state with business logic NotifierProvider (Riverpod)
Complex event flows, event tracking BLoC (alternative)

Essential Commands

flutter pub get                 # Install dependencies
flutter run                     # Debug mode
flutter test                    # Run tests
flutter build apk --release     # Android release
flutter build ipa --release     # iOS release
flutter clean && flutter pub get  # Reset project

# Riverpod code generation
dart run build_runner build --delete-conflicting-outputs
dart run build_runner watch --delete-conflicting-outputs

TDD Workflow (from AGENTS.md)

1. Interface First   → Define contract in domain/repositories/
2. RED Phase         → Write failing test, implementation throws UnimplementedError
3. GREEN Phase       → Write minimum code to pass
4. REFACTOR          → Clean up, add edge cases