← ClaudeAtlas

flutter-dartlisted

Activated when building Flutter apps, creating widgets, implementing state management, setting up navigation, configuring themes, writing tests, or asking "how do I set up X" in a Flutter/Dart context. Covers UI, Riverpod, GoRouter, Dio, Freezed, Drift, Material 3 theming, testing, and Clean Architecture patterns.
IuliaIvanaPatras/claude-code-templates · ★ 0 · AI & Automation · score 62
Install: claude install-skill IuliaIvanaPatras/claude-code-templates
# Flutter & Dart Development Skill ## Core Workflow Follow these 6 steps when implementing any Flutter feature: ### Step 1 — Understand the Feature Boundary - Identify which **feature module** this belongs to (e.g., `auth`, `home`, `profile`). - Determine layers needed: **data** (models, data sources, repositories), **domain** (entities, use cases), **presentation** (pages, widgets, view models). - Check if shared infrastructure already exists under `lib/core/`. ### Step 2 — Define the Data Model - Create Freezed model classes in `lib/features/<feature>/data/models/`. - Add `fromJson`/`toJson` via `json_serializable`. - Define Drift table schemas if local persistence is needed. - Write unit tests for serialization round-trips. ### Step 3 — Implement the Data Layer - Create the remote data source using Dio in `lib/features/<feature>/data/data_sources/`. - Create the repository implementation in `lib/features/<feature>/data/repositories/`. - Handle errors with typed failure classes, never throw raw exceptions. - Write unit tests with mocked Dio responses. ### Step 4 — Build the State Management - Create Riverpod providers using `@riverpod` annotation in `lib/features/<feature>/presentation/providers/`. - Use `AsyncNotifier` for stateful logic, plain `@riverpod` for computed values. - Keep providers focused: one provider per concern. - Write provider unit tests using `ProviderContainer`. ### Step 5 — Compose the UI - Build pages in `lib/features/<feature>/presentation/pag