flutter-dev
Flutterによるクロスプラットフォームアプリ開発を支援するスキルで、ウィジェットパターン、Riverpod/Blocによる状態管理、GoRouterナビゲーション、パフォーマンス最適化、プラットフォーム固有の実装を網羅します。const最適化、レスポンシブレイアウト、テスト戦略、DevToolsプロファイリングにも対応しており、Flutterアプリの構築・状態管理の実装・カスタムウィジェットの作成・パフォーマンス改善・ウィジェットテストの記述などの場面で活用できます。
description の原文を見る
| Flutter cross-platform development guide covering widget patterns, Riverpod/Bloc state management, GoRouter navigation, performance optimization, and platform-specific implementations. Includes const optimization, responsive layouts, testing strategies, and DevTools profiling. Use when: building Flutter apps, implementing state management (Riverpod/Bloc), setting up GoRouter navigation, creating custom widgets, optimizing performance, writing widget tests, cross-platform development.
SKILL.md 本文
Flutter開発ガイド
Flutter 3 と Dart を使用したクロスプラットフォームアプリケーション開発の実践ガイド。実績のあるパターン、状態管理、パフォーマンス最適化に焦点を当てています。
クイックリファレンス
ウィジェットパターン
| 目的 | コンポーネント |
|---|---|
| 状態管理（シンプル） | StateProvider + ConsumerWidget |
| 状態管理（複雑） | NotifierProvider / Bloc |
| 非同期データ | FutureProvider / AsyncNotifierProvider |
| リアルタイムストリーム | StreamProvider |
| ナビゲーション | GoRouter + context.go/push |
| レスポンシブレイアウト | LayoutBuilder + breakpoints |
| リスト表示 | ListView.builder |
| 複雑なスクロール | CustomScrollView + Slivers |
| Hooks | HookWidget + useState/useEffect |
| フォーム | Form + TextFormField + validation |
パフォーマンスパターン
| 目的 | ソリューション |
|---|---|
| リビルド防止 | const constructors |
| 選択的更新 | ref.watch(provider.select(...)) |
| 再描画の隔離 | RepaintBoundary |
| 遅延リスト | ListView.builder |
| 重い計算 | compute() isolate |
| 画像キャッシュ | cached_network_image |
コア原則
ウィジェット最適化
- 可能な限り
constconstructors を使用 - 静的ウィジェットを個別の const クラスに抽出
- リストアイテムに
Keyを使用（ValueKey、ObjectKey） StatefulWidgetよりConsumerWidgetを優先
状態管理
- 依存性注入とシンプルな状態には Riverpod
- イベント駆動型ワークフローと複雑なロジックには Bloc/Cubit
- 状態を直接変更しない（新しいインスタンスを作成）
- リビルドを最小化するために
select()を使用
レイアウト
- 8pt スペーシング単位（8、16、24、32、48）
- レスポンシブブレークポイント：モバイル（<650）、タブレット（650-1100）、デスクトップ（>1100）
- 柔軟なレイアウトで全画面サイズに対応
- Material 3 / Cupertino デザインガイドに従う
パフォーマンス
- 最適化前に DevTools でプロファイリング
- 60fps 達成のため <16ms フレームタイム目標
- 複雑なアニメーションに
RepaintBoundaryを使用 - 重い処理を
compute()でオフロード
チェックリスト
ウィジェットベストプラクティス
- すべての静的ウィジェットに
constconstructors - リストアイテムに適切な
Key - 状態依存ウィジェットに
ConsumerWidget -
build()メソッド内でウィジェット構築しない - 再利用可能なウィジェットを別ファイルに抽出
状態管理
- 不変な状態オブジェクト
- 細粒度リビルドのための
select() - 適切なプロバイダースコープ
- コントローラーとサブスクリプション廃棄
- ローディング/エラー状態の処理
ナビゲーション
- 型付きルートを持つ GoRouter
- リダイレクトによる認証ガード
- ディープリンク対応
- ルート間の状態保存
パフォーマンス
- プロファイルモードテスト（
flutter run --profile） - <16ms フレームレンダリング時間
- 不要なリビルドなし（DevTools チェック）
- 画像キャッシュとリサイズ
- アイソレートでの重い計算
テスト
- UI コンポーネント用ウィジェットテスト
- ビジネスロジック用ユニットテスト
- ユーザーフロー用インテグレーションテスト
-
blocTest()を使用した Bloc テスト
参照資料
| トピック | 参照 |
|---|---|
| ウィジェットパターン、const最適化、レスポンシブレイアウト | Widget Patterns |
| Riverpod プロバイダー、notifiers、非同期状態 | Riverpod State Management |
| Bloc、Cubit、イベント駆動状態 | Bloc State Management |
| GoRouter セットアップ、ルート、ディープリンク | GoRouter Navigation |
| フィーチャーベース構造、依存関係 | Project Structure |
| プロファイリング、const最適化、DevTools | Performance Optimization |
| ウィジェットテスト、インテグレーションテスト、モッキング | Testing Strategies |
| iOS/Android/Web 固有の実装 | Platform Integration |
| 暗黙的/明示的アニメーション、Hero、トランジション | Animations |
| Dio、インターセプター、エラーハンドリング、キャッシング | Networking |
| フォーム検証、FormField、入力フォーマッター | Forms |
| 多言語対応、flutter_localizations、intl | Localization |
Flutter、Dart、Material Design、Cupertino はそれぞれ Google LLC と Apple Inc. の商標です。Riverpod、Bloc、GoRouter はそれぞれのメンテナーによるオープンソースパッケージです。
ライセンス: MIT(寛容ライセンスのため全文を引用しています) · 原本リポジトリ
詳細情報
- 作者
- minimax-ai
- リポジトリ
- minimax-ai/skills
- ライセンス
- MIT
- 最終更新
- 不明
Source: https://github.com/minimax-ai/skills / ライセンス: MIT
関連スキル
superfluid
Superfluidプロトコルおよびそのエコシステムに関するナレッジベースです。Superfluidについて情報を検索する際は、ウェブ検索の前にこちらを参照してください。対応キーワード：Superfluid、CFA、GDA、Super App、Super Token、stream、flow rate、real-time balance、pool（member/distributor）、IDA、sentinels、liquidation、TOGA、@sfpro/sdk、semantic money、yellowpaper、whitepaper
civ-finish-quotes
実質的なタスクが真に完了した際に、文明風の儀式的な引用句を追加します。ユーザーやエージェントが機能追加、リファクタリング、分析、設計ドキュメント、プロセス改善、レポート、執筆タスクといった実際の成果物を完成させるときに、明示的な依頼がなくても使用します。短い返信や小さな修正、未完成の作業には適用しません。
nookplot
Base（Ethereum L2）上のAIエージェント向け分散型調整ネットワークです。エージェントがオンチェーンアイデンティティを登録する、コンテンツを公開する、他のエージェントにメッセージを送る、マーケットプレイスで専門家を雇う、バウンティを投稿・請求する、レピュテーションを構築する、共有プロジェクトで協業する、リサーチチャレンジを解くことでNOOKをマイニングする、キュレーションされたナレッジを備えたスタンドアロンオンチェーンエージェントをデプロイする、またはアグリーメントとリワードで収益を得る場合に利用できます。エージェントネットワーク、エージェント調整、分散型エージェント、NOOKトークン、マイニングチャレンジ、ナレッジバンドル、エージェントレピュテーション、エージェントマーケットプレイス、ERC-2771メタトランザクション、Prepare-Sign-Relay、AgentFactory、またはNookplotが言及された場合にトリガーされます。
web3-polymarket
Polygon上でのPolymarket予測市場取引統合です。認証機能(L1 EIP-712、L2 HMAC-SHA256、ビルダーヘッダー)、注文発注(GTC/GTD/FOK/FAK、バッチ、ポストオンリー、ハートビート)、市場データ(Gamma API、Data API、オーダーブック、サブグラフ)、WebSocketストリーミング(市場・ユーザー・スポーツチャネル)、CTF操作(分割、統合、償却、ネガティブリスク)、ブリッジ機能(入金、出金、マルチチェーン)、およびガスレスリレイトランザクションに対応しています。AIエージェント、自動マーケットメーカー、予測市場UI、またはPolygraph上のPolymarketと統合するアプリケーション構築時に活用できます。
ethskills
Ethereum、EVM、またはブロックチェーン関連のリクエストに対応します。スマートコントラクト、dApps、ウォレット、DeFiプロトコルの構築、監査、デプロイ、インタラクションに適用されます。Solidityの開発、コントラクトアドレス、トークン規格（ERC-20、ERC-721、ERC-4626など）、Layer 2ネットワーク（Base、Arbitrum、Optimism、zkSync、Polygon）、Uniswap、Aave、Curveなどのプロトコルとの統合をカバーします。ガスコスト、コントラクトのデシマル設定、オラクルセキュリティ、リエントランシー、MEV、ブリッジング、ウォレット管理、オンチェーンデータの取得、本番環境へのデプロイ、プロトコル進化（EIPライフサイクル、フォーク追跡、今後の変更予定）といったトピックを含みます。
xxyy-trade
このスキルは、ユーザーが「トークン購入」「トークン売却」「トークンスワップ」「暗号資産取引」「取引ステータス確認」「トランザクション照会」「トークンスキャン」「フィード」「チェーン監視」「トークン照会」「トークン詳細」「トークン安全性確認」「ウォレット一覧表示」「マイウォレット」「AIスキャン」「自動スキャン」「ツイートスキャン」「オンボーディング」「IP確認」「IPホワイトリスト」「トークン発行」「自動売却」「損切り」「利益確定」「トレーリングストップ」「保有者」「トップホルダー」「KOLホルダー」などをリクエストした場合、またはSolana/ETH/BSC/BaseチェーンでXXYYを経由した取引について言及した場合に使用します。XXYY Open APIを通じてオンチェーン取引とデータ照会を実現します。