flutter-expert

Guide Flutter/Dart teams in Riverpod state management and widget design.

1|Updated Aug 25, 2024
One-click install
npx skills add https://github.com/7loro/dotfiles --skill flutter-expert-7loro
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: flutter-expert
Source: https://github.com/7loro/dotfiles/tree/main/dot_config/agents/skills/flutter-expert
Command: npx skills add https://github.com/7loro/dotfiles --skill flutter-expert-7loro

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Flutter/Dart teams often struggle to implement consistent UI patterns, effective state management, and architecture aligned with Riverpod and project rules. This Skill provides expert guidance to design widgets, manage state, apply themes, handle routing, testing, and architecture according to official AI rules and Riverpod best practices.

Core Features & Use Cases

  • Guided widget design with StatelessWidget best practices and private widget separation.
  • Riverpod AsyncNotifierProvider usage, code generation, and Repository pattern integration.
  • Project rule conformance: CLAUDE.md, analysis_options.yaml, architecture docs; performance optimization and testing patterns.

Quick Start

Ask the Flutter Expert to scaffold a Riverpod-based feature (e.g., a Todo list) following repository conventions, including code generation and DI. Provide a minimal project snippet; The Quick Start must not include code fences.

Frequently Asked Questions about flutter-expert

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I structure Flutter app architecture using Riverpod and repository patterns?

Flutter Riverpod architecture uses AsyncNotifierProvider and the repository pattern to separate data layers and manage state. It integrates code generation via riverpod_generator and build_runner, aligning project conventions for maintainable widget design, routing, and theming.

What is the best way to manage state in Flutter with Riverpod code generation?

Managing Flutter state with Riverpod code generation involves using AsyncNotifierProvider with riverpod_generator and build_runner. This automates provider boilerplate, enforces repository pattern integration, and ensures robust state handling aligned with official AI rules and project conventions.

Do I need build_runner and riverpod_generator to scaffold a Flutter feature?

Yes, scaffolding a Flutter feature with this approach requires build_runner and riverpod_generator. These tools handle Dart code generation for Riverpod providers, enabling dependency injection and repository pattern integration without writing manual provider boilerplate.

How do I apply StatelessWidget best practices and private widget separation in Dart?

Applying StatelessWidget best practices in Dart involves separating private widgets from main UI components to enhance reusability and testing. This widget design conforms to project architecture docs and official AI rules, ensuring clean state management boundaries within Flutter apps.

Can I enforce CLAUDE.md and analysis_options.yaml rules in my Flutter testing workflow?

Yes, you can enforce CLAUDE.md and analysis_options.yaml rules in your Flutter testing workflow. Adhering to these project rule files ensures architecture conformance, performance optimization, and consistent testing patterns across the Dart codebase during Riverpod feature development.