スキル flutter-expert
📦

flutter-expert

安全

Plattformübergreifende Flutter-Apps erstellen

こちらからも入手できます: sickn33

Die Erstellung von mobilen Anwendungen für iOS, Android und das Web erfordert tiefgreifende Expertise in Flutter, State Management und plattformspezifischen Implementierungen. Diese Fähigkeit bietet umfassende Anleitung für die Flutter 3+ Entwicklung mit Riverpod, Bloc und GoRouter Mustern.

対応: Claude Codex Code(CC)
🥉 72 ブロンズ
1

スキルZIPをダウンロード

2

Claudeでアップロード

設定 → 機能 → スキル → スキルをアップロードへ移動

3

オンにして利用開始

テストする

「flutter-expert」を使用しています。 Create a Riverpod Notifier for a todo list with add, toggle, and remove functionality

期待される結果:

  • A complete Dart file with @riverpod TodoList class extending StateNotifier<List<Todo>>
  • Methods for add, toggle, and remove with proper state updates
  • Example usage in a ConsumerWidget with ref.watch and ref.read
  • Type-safe state management following Riverpod 2.0 patterns

「flutter-expert」を使用しています。 Set up GoRouter with auth guard and deep linking

期待される結果:

  • GoRouter configuration with initialLocation and redirect handler
  • AuthBloc integration in redirect to check authentication state
  • Route parameters for deep linking (e.g., /details/:id)
  • ShellRoute for persistent bottom navigation

セキュリティ監査

安全
v1 • 2/7/2026

This skill is a documentation/reference skill for Flutter development. Static scanner flagged 88 external_command patterns and 1 network pattern, but all findings are FALSE POSITIVES. The scanner misidentified Dart code blocks and CLI command documentation examples as shell execution. No actual security risks exist. All content is legitimate Flutter/Dart documentation with no prompt injection attempts.

7
スキャンされたファイル
937
解析された行数
0
検出結果
1
総監査数
セキュリティ問題は見つかりませんでした
監査者: claude

品質スコア

45
アーキテクチャ
100
保守性
87
コンテンツ
27
コミュニティ
100
セキュリティ
91
仕様準拠

作れるもの

Mobiler Entwickler baut neue Flutter-App

Erhalten Sie Anleitung zur Einrichtung der Projektstruktur, Auswahl des State Management Ansatzes und Implementierung von Kern-Widgets nach Flutter Best Practices.

Erfahrener Flutter-Entwickler optimiert Performance

Lernen Sie Performance-Optimierungstechniken einschließlich const Widgets, selektivem Rebuilding, RepaintBoundary Nutzung und DevTools Profiling.

Full-Stack-Entwickler fügt Flutter zum Stack hinzu

Verstehen Sie Flutter Muster und Architektur zur Integration mit bestehenden Backend-Services und Implementierung plattformübergreifender Features.

これらのプロンプトを試す

Neuen Flutter-Bildschirm erstellen
Create a Flutter screen with Riverpod state management that displays a list of items from an API. Include error handling, loading states, and pull-to-refresh functionality.
Authentifizierungs-Flow implementieren
Design a Bloc-based authentication flow with login, logout, and protected routes using GoRouter with auth redirect. Include session management and error states.
Widget-Rebuilds optimieren
Review this Flutter widget and optimize unnecessary rebuilds. Show how to use const constructors, RepaintBoundary, and selective provider watching with select().
Projektstruktur einrichten
Create a clean Flutter project structure for a medium-sized app. Include feature-based directory organization, dependency injection setup, and routing configuration.

ベストプラクティス

  • Const Constructors auf allen statischen Widgets verwenden, um Rebuild-Overhead zu minimieren
  • Riverpod für einfachen State und Bloc für komplexe Event-Driven Workflows wählen
  • Mit DevTools profilen vor der Optimierung - messen, nicht raten
  • UI und Business Logic mit proper State Management Mustern trennen

回避

  • Widgets innerhalb von build() Methoden erstellen - in const Constructors extrahieren
  • setState für App-weiten State verwenden - stattdessen Riverpod Providers nutzen
  • Keys bei Listen-Elementen weglassen - verursacht Performance- und Animationsprobleme
  • UI-Thread mit schweren Berechnungen blockieren - compute() und Isolates verwenden

よくある質問

Wann sollte ich Riverpod vs Bloc verwenden?
Verwenden Sie Riverpod für einfache bis mittlere State Management Anforderungen, insbesondere mit reaktiven Mustern. Verwenden Sie Bloc, wenn Sie explizite Event-Driven State Transitions, komplexe Business Logic oder hochgradig testbare Flows benötigen. Riverpod ist generell einfacher einzurichten.
Wie optimiere ich die Flutter App Performance?
Verwenden Sie Const Constructors überall wo möglich, implementieren Sie Keys auf Listen-Elementen, nutzen Sie ref.watch mit select() für selektives Rebuilding, wickeln Sie teure Widgets in RepaintBoundary ein und verwenden Sie ListView.builder für lange Listen. Profilen Sie immer zuerst mit DevTools.
Was ist die empfohlene Projektstruktur?
Verwenden Sie Feature-basierte Organisation mit Ordnern für Features, Core Services, Shared Widgets und DI. Trennen Sie Models, Providers und Widgets innerhalb jedes Features. God Files vermeiden und Widgets klein und fokussiert halten.
Wie implementiere ich Deep Linking in Flutter?
Verwenden Sie GoRouter mit Path-Parametern (z.B. /details/:id). Konfigurieren Sie plattformspezifische Intent Filters in AndroidManifest.xml und Info.plist. Testen Sie mit flutter run und verwenden Sie das uni_links Package für eingehende Links.
Wie teste ich Flutter Widgets und State?
Verwenden Sie flutter_test für Widget-Tests mit pumpWidget und find.byType. Testen Sie Providers durch direktes Auslesen von Werten. Testen Sie Blocs mit dem bloc_test Package mit expect() Assertions auf States.
Was sind Const Constructors und warum verwenden?
Const Constructors erstellen Compile-Time-Constant Widgets, die Flutter über Rebuilds hinweg wiederverwenden kann. Sie verhindern unnötige Widget-Neuerstellung, reduzieren Rebuild-Overhead und verbessern die Performance. Immer const auf statischen Widgets verwenden.

開発者の詳細

作成者

Jeffallan

ライセンス

MIT

参照

main