Kiến trúc Flutter Feature-First
Skill giúp thiết kế và triển khai ứng dụng Flutter theo kiến trúc phân lớp với cấu trúc thư mục tổ chức theo tính năng.
Lập trìnhTrung cấp★ 614⑂ 60Điểm AI 8/10Cập nhật lần cuối: 4 thg 8, 2026
Làm được gì
- Áp dụng quy tắc chia ứng dụng Flutter thành UI Layer / Logic Layer (tùy chọn) / Data Layer.
- Đề xuất cấu trúc thư mục feature-first chuẩn:
lib/features/<tinh_nang>/data|domain|ui, cùngcore/vàshared/. - Xác định rõ trách nhiệm của View, ViewModel/Cubit/Controller, Repository (nguồn dữ liệu duy nhất) và Service.
- Hướng dẫn tiêm phụ thuộc qua constructor và đăng ký trong
service_locator.dart, kèm quy trình 7 bước để thêm tính năng mới. - Trung lập với state management: dùng được với Provider, Riverpod, BLoC hay ChangeNotifier.
Phù hợp với ai
- Lập trình viên Flutter bắt đầu một dự án mới và muốn cấu trúc thư mục gọn gàng từ đầu.
- Nhóm cần refactor app cũ đang gọi API trực tiếp trong widget.
- Đội nhiều người muốn thống nhất quy ước kiến trúc trong cùng repo.
Ví dụ sử dụng
- "Thêm tính năng chỉnh sửa hồ sơ" → tạo
features/profile_edit/với service → repository → viewmodel → screen và đăng ký DI. - "Widget này gọi API trực tiếp, hãy dọn lại" → chuyển lời gọi Service vào Repository và bộc lộ trạng thái qua ViewModel.
- "Logic này nên đặt ở đâu?" → Claude đánh giá độ phức tạp/khả năng tái dùng để quyết định có cần UseCase ở tầng domain hay không.
· · · Hướng dẫn cài đặt · · ·
Dùng thử ngay, không cần cài
Dán đoạn dưới vào Claude là dùng được skill này mà không cần cài đặt.
Hãy đọc hướng dẫn trong tệp này và làm theo để giúp mình: https://raw.githubusercontent.com/evanca/flutter-ai-rules/HEAD/skills/architecture-feature-first/SKILL.md Mình muốn: (viết việc bạn cần ở đây)
Nếu Claude không mở được liên kết, hãy mở liên kết và copy nội dung vào rồi dán.
↓ Thấy hữu ích thì tải ZIP bên dưới và cài. Sau đó skill tự chạy, không phải dán lại mỗi lần.
Cài vào ứng dụng Claude (không cần terminal)
- Tải tệp ZIP bằng nút bên dưới.
- Trong Claude, mở Settings → Capabilities và bật 'Code execution and file creation'. (chỉ một lần)
- Vào Customize → Skills → + → 'Upload a skill' rồi tải tệp ZIP lên.
Cài vào Claude Code
Để Claude làm — dán câu dưới đây vào Claude Code
Hãy cài skill mình tìm thấy trên Claude Skill Mart. Copy thư mục skills/architecture-feature-first từ repo GitHub evanca/flutter-ai-rules vào ~/.claude/skills/architecture-feature-first/ của mình. Sau khi cài xong, cho mình biết skill này làm được gì trong một câu.
Cài bằng lệnh thủ công
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/⚠ Đây là skill do người khác tạo. Hãy kiểm tra repo gốc trước khi cài.
- Mở terminal.
- Tải repo skill:
git clone https://github.com/evanca/flutter-ai-rules.git - Tạo thư mục skill:
mkdir -p ~/.claude/skills - Sao chép skill:
cp -r flutter-ai-rules/skills/architecture-feature-first ~/.claude/skills/ - Kiểm tra tệp
~/.claude/skills/architecture-feature-first/SKILL.mdđã tồn tại. - Khởi động lại Claude Code, rồi trong dự án Flutter hãy yêu cầu ví dụ "tạo cấu trúc thư mục cho tính năng mới" để skill tự kích hoạt.
Xem mã nguồn trên GitHub ↗Giấy phép: MIT