Flutter開発

目次

• 概要
• 使用するべき場面
• クイックスタート
• リファレンスガイド
• ベストプラクティス

概要

Dart言語を使用してFlutterで高性能でビジュアル的に優れたモバイルアプリケーションを作成します。ウィジェットの合成、状態管理パターン、ナビゲーション、API統合をマスターします。

使用するべき場面

• ネイティブパフォーマンスを持つiOSおよびAndroidアプリの構築
• FlutterのウィジェットシステムでカスタムUIを設計
• 複雑なアニメーションと視覚効果の実装
• ホットリロードによる迅速なアプリ開発
• プラットフォーム全体で一貫したUXを作成

クイックスタート

最小限の動作例：

// pubspec.yaml
name: my_flutter_app
version: 1.0.0

dependencies:
  flutter:
    sdk: flutter
  provider: ^6.0.0
  http: ^1.1.0
  go_router: ^12.0.0

// main.dart with GoRouter navigation
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp.router(
// ... (see reference guides for full implementation)

リファレンスガイド

references/ディレクトリ内の詳細な実装：

ベストプラクティス

✅ すべき事

• すべてのUI要素にウィジェットを使用する
• 適切な状態管理を実装する
• 可能な限りconst コンストラクタを使用する
• 状態のライフサイクルでリソースを解放する
• 複数のデバイスサイズでテストする
• 意味のあるウィジェット名を使用する
• エラーハンドリングを実装する
• レスポンシブデザインパターンを使用する
• iOSとAndroid両方でテストする
• カスタムウィジェットをドキュメント化する

❌ してはいけない事

• build()メソッド内に画面全体を構築する
• 複雑な状態ロジックにsetStateを使用する
• build()内でネットワーク呼び出しを行う
• プラットフォーム間の違いを無視する
• ウィジェットツリーの過度なネストを作成する
• 文字列をハードコードする
• パフォーマンス警告を無視する
• テストをスキップする
• エッジケースの処理を忘れる
• 徹底的なテストなしで本番環境に展開する