Claude Skill MartBrowse skillsQuick linesLearn by videoTerminal guideWhat is a Skill?
← Back to list

Flutter Architecture — Feature-First

A skill that guides Claude to structure Flutter apps with layered UI/Domain/Data architecture and feature-first folders.

Dev & CodingIntermediate★ 644⑂ 67AI score 9/10Last updated: Sep 14, 2026

What it does

  • Enforces Flutter's recommended layered architecture: UI layer, optional Logic (domain) layer, and Data layer — with hard rules such as "UI never calls a Service directly" and "only the Repository (SSOT) mutates data".
  • Provides a concrete feature-first folder tree: lib/features/<feature>/data|domain|ui, with shared code split into core/ and shared/.
  • Stays state-management agnostic: ViewModel, Cubit/Bloc, Provider/Riverpod Notifier are all supported, with a file-naming table per approach.
  • Spells out responsibilities for View, business logic holder, Repository and Service, plus Dart samples and a get_it dependency-injection setup example.
  • Ships a 7-step workflow for adding a feature: create directories → Service → Repository → ViewModel → View → register DI → verify unidirectional data flow.

Who it's for

  • Flutter developers starting a new app who want a scalable layout from day one.
  • Teams refactoring a legacy type-first codebase into feature modules.
  • Tech leads who want architecture conventions shared consistently with AI coding tools.

Examples

  1. "Add a login feature" → scaffolds features/auth/ with auth_api_service.dart, auth_repository.dart, auth_viewmodel.dart, login_screen.dart and wires the service locator.
  2. "Where should this caching logic live?" → answers Repository, since it is the single source of truth handling caching, errors and refresh.
  3. "This calculation is reused on three screens" → checks it against the criteria for introducing a use case in the domain/ layer and proposes the file location.

· · · Install guide · · ·

Try it now, no install

Paste this into Claude to use the skill without installing anything.

Read the instructions in this file and follow them to help me:
https://raw.githubusercontent.com/evanca/flutter-ai-rules/HEAD/skills/architecture-feature-first/SKILL.md

What I want: (describe your task here)

If Claude can't open the link, open it yourself and paste the contents instead.

↓ If it works for you, download the ZIP below and install it. Then it runs on its own — no pasting each time.

Install in the Claude app (no terminal)
  1. Download the ZIP with the button below.
  2. In Claude, open Settings → Capabilities and turn on 'Code execution and file creation'. (one time)
  3. Go to Customize → Skills → + → 'Upload a skill' and upload the ZIP.
↓ Download ZIP
Install in Claude Code

Let Claude do it — paste this into Claude Code

Install the skill I found on Claude Skill Mart.
Copy the skills/architecture-feature-first folder from the GitHub repo evanca/flutter-ai-rules into my ~/.claude/skills/architecture-feature-first/.
When it's done, tell me in one line what this skill can do.

Install with a command instead

git clone https://github.com/evanca/flutter-ai-rules.git && mkdir -p ~/.claude/skills && cp -r flutter-ai-rules/skills/architecture-feature-first ~/.claude/skills/

⚠ This is a third-party skill. Check the source repository before installing.

  1. Open a terminal and go to your home directory: cd ~
  2. Clone the repository: git clone https://github.com/evanca/flutter-ai-rules.git
  3. Make sure the Claude skills folder exists: mkdir -p ~/.claude/skills
  4. Copy just this skill: cp -r flutter-ai-rules/skills/architecture-feature-first ~/.claude/skills/
  5. Verify with ls ~/.claude/skills/architecture-feature-first — you should see SKILL.md.
  6. Restart Claude Code, then in a Flutter project ask something like "scaffold the folder structure for a new feature" and the skill will trigger automatically.