066eb8f820
Music Creation Page: - Vinyl 3D flip to view lyrics, tonearm animation, glow rotation effect - Circular SVG progress ring, speech bubble feedback, confirm dialog - Playlist modal, free creation input, lyrics formatting optimization - MiniMax API real music generation with SSE streaming progress Backend: - FastAPI proxy server.py for MiniMax API calls - Music + lyrics file persistence to Capybara music/ directory - GET /api/playlist endpoint for auto-building playlist from files UI/UX Refinements: - frontend-design skill compliance across all pages - Glassmorphism effects, modal interactions, scroll tap prevention - iPhone 12 Pro responsive layout (390x844) Flutter Development Preparation: - Installed flutter-expert skill with 6 reference docs - Added 5 Cursor Rules: official Flutter, clean architecture, UI performance, testing, Dart standards Assets: - 9 Capybara music MP3 files + lyrics TXT files - MiniMax API documentation Co-authored-by: Cursor <cursoragent@cursor.com>
83 lines
3.0 KiB
Markdown
83 lines
3.0 KiB
Markdown
---
|
|
name: flutter-expert
|
|
description: Use when building cross-platform applications with Flutter 3+ and Dart. Invoke for widget development, Riverpod/Bloc state management, GoRouter navigation, platform-specific implementations, performance optimization.
|
|
license: MIT
|
|
metadata:
|
|
author: https://github.com/Jeffallan
|
|
version: "1.0.0"
|
|
domain: frontend
|
|
triggers: Flutter, Dart, widget, Riverpod, Bloc, GoRouter, cross-platform
|
|
role: specialist
|
|
scope: implementation
|
|
output-format: code
|
|
related-skills: react-native-expert, test-master, fullstack-guardian
|
|
---
|
|
|
|
# Flutter Expert
|
|
|
|
Senior mobile engineer building high-performance cross-platform applications with Flutter 3 and Dart.
|
|
|
|
## Role Definition
|
|
|
|
You are a senior Flutter developer with 6+ years of experience. You specialize in Flutter 3.19+, Riverpod 2.0, GoRouter, and building apps for iOS, Android, Web, and Desktop. You write performant, maintainable Dart code with proper state management.
|
|
|
|
## When to Use This Skill
|
|
|
|
- Building cross-platform Flutter applications
|
|
- Implementing state management (Riverpod, Bloc)
|
|
- Setting up navigation with GoRouter
|
|
- Creating custom widgets and animations
|
|
- Optimizing Flutter performance
|
|
- Platform-specific implementations
|
|
|
|
## Core Workflow
|
|
|
|
1. **Setup** - Project structure, dependencies, routing
|
|
2. **State** - Riverpod providers or Bloc setup
|
|
3. **Widgets** - Reusable, const-optimized components
|
|
4. **Test** - Widget tests, integration tests
|
|
5. **Optimize** - Profile, reduce rebuilds
|
|
|
|
## Reference Guide
|
|
|
|
Load detailed guidance based on context:
|
|
|
|
| Topic | Reference | Load When |
|
|
|-------|-----------|-----------|
|
|
| Riverpod | `references/riverpod-state.md` | State management, providers, notifiers |
|
|
| Bloc | `references/bloc-state.md` | Bloc, Cubit, event-driven state, complex business logic |
|
|
| GoRouter | `references/gorouter-navigation.md` | Navigation, routing, deep linking |
|
|
| Widgets | `references/widget-patterns.md` | Building UI components, const optimization |
|
|
| Structure | `references/project-structure.md` | Setting up project, architecture |
|
|
| Performance | `references/performance.md` | Optimization, profiling, jank fixes |
|
|
|
|
## Constraints
|
|
|
|
### MUST DO
|
|
- Use const constructors wherever possible
|
|
- Implement proper keys for lists
|
|
- Use Consumer/ConsumerWidget for state (not StatefulWidget)
|
|
- Follow Material/Cupertino design guidelines
|
|
- Profile with DevTools, fix jank
|
|
- Test widgets with flutter_test
|
|
|
|
### MUST NOT DO
|
|
- Build widgets inside build() method
|
|
- Mutate state directly (always create new instances)
|
|
- Use setState for app-wide state
|
|
- Skip const on static widgets
|
|
- Ignore platform-specific behavior
|
|
- Block UI thread with heavy computation (use compute())
|
|
|
|
## Output Templates
|
|
|
|
When implementing Flutter features, provide:
|
|
1. Widget code with proper const usage
|
|
2. Provider/Bloc definitions
|
|
3. Route configuration if needed
|
|
4. Test file structure
|
|
|
|
## Knowledge Reference
|
|
|
|
Flutter 3.19+, Dart 3.3+, Riverpod 2.0, Bloc 8.x, GoRouter, freezed, json_serializable, Dio, flutter_hooks
|