Dart Flutter Patterns

Dart/Flutterパターン

使用時期

次の場合にこのスキルを使用：

• 新しいFlutter機能を開始し、状態管理、ナビゲーション、またはデータアクセスのイディオマティックパターンが必要
• Dartコードのレビューまたは作成とnull安全性、シール型、非同期構成のガイダンスが必要
• 新しいFlutterプロジェクトをセットアップしBLoC、Riverpod、またはProviderのうち選択
• 安全なHTTPクライアント、WebView統合、ローカルストレージを実装
• FlutterウィジェットEt、Cubit、またはRiverpodプロバイダーのテストを作成
• GoRouterを認証ガードでワイヤリング

動作方法

このスキルは、懸念事項で整理されたコピーペーストの準備ができたDart/Flutterコードパターンを提供：

1. Null安全性 — !を避ける、?./??/パターンマッチングを好む
2. 不変状態 — シール型、freezed、copyWith
3. 非同期構成 — 並行Future.wait、await後の安全なBuildContext
4. ウィジェットアーキテクチャ — クラスに抽出（メソッドではなく）、const伝播、スコープ付きリビルド
5. 状態管理 — BLoC/Cubityベント、Riverpodノーティファイアおよび派生プロバイダー
6. ナビゲーション — refreshListenable経由の反応型認証ガード付きGoRouter
7. ネットワーキング — インターセプタ付きDio、ワンタイム再試行ガード付きトークンリフレッシュ
8. エラーハンドリング — グローバルキャプチャ、ErrorWidget.builder、crashlyticsワイヤリング
9. テスト — ユニット（BLoC test）、ウィジェット（ProviderScopeオーバーライド）、モック上のフェイク

例

// シール状態 — 不可能な状態を防止
sealed class AsyncState<T> {}
final class Loading<T> extends AsyncState<T> {}
final class Success<T> extends AsyncState<T> { final T data; const Success(this.data); }
final class Failure<T> extends AsyncState<T> { final Object error; const Failure(this.error); }

// 反応型認証リダイレクト付きGoRouter
final router = GoRouter(
  refreshListenable: GoRouterRefreshStream(authCubit.stream),
  redirect: (context, state) {
    final authed = context.read<AuthCubit>().state is AuthAuthenticated;
    if (!authed && !state.matchedLocation.startsWith('/login')) return '/login';
    return null;
  },
  routes: [...],
);

詳細については、ドキュメントを参照してください。

Source: affaan-m/ECC → docs/ja-JP/skills/dart-flutter-patterns/SKILL.md