🍳 AI x Flutter Cookbook

レシピ#1-1: Flutter開発環境の準備（キッチンのセットアップ）

AIとの共同開発を始める前に、まずは基本となるFlutterの開発環境を整える必要があります。これは、料理を始める前の「キッチンのセットアップ」に相当します。そしてこのキッチンは、AI時代のビルダー（自分の課題を自分で解決する個人）が、その解決策をアプリとして人に届けるための作業場でもあります。

このマニュアルでは、Flutter SDKをインストールし、開発の準備が整っているかを確認するまでの手順を解説します。

Step 1: Flutter SDKのインストール

Flutter SDKは、Flutterアプリを開発・ビルドするためのツールやライブラリの集合体です。

  1. 公式サイトからSDKをダウンロード:

  2. SDKを配置:

    • ダウンロードしたZIPファイルを解凍します。
    • 解凍してできたflutterフォルダを、PC内の適切な場所に配置します。
      • 推奨される場所: C:\flutter (Windows) や ~/development/flutter (macOS/Linux) など、パスにスペースや日本語が含まれない、浅い階層のディレクトリが理想です。
      • 避けるべき場所: C:\Program Files のような、管理者権限が必要な場所は避けてください。

Step 2: 環境変数 "Path" の設定

ターミナルのどこからでもflutterコマンドを実行できるように、Flutter SDKへの「道（Path）」をOSに教えてあげる必要があります。

  1. 先ほど配置したflutterフォルダの中にあるbinフォルダのフルパスをコピーします。

    • 例: C:\flutter\bin (Windows)
    • 例: /Users/your-username/development/flutter/bin (macOS/Linux)

  2. 環境変数Pathに、コピーしたパスを追加します。

    • Windowsの場合:

      1. スタートメニューで「環境変数」と検索し、「システム環境変数の編集」を開きます。
      2. 「環境変数...」ボタンをクリックします。
      3. 「（ユーザー名）のユーザー環境変数」セクションで、「Path」を選択し、「編集...」をクリックします。
      4. 「新規」をクリックし、コピーしたパス（例: C:\flutter\bin）を貼り付け、「OK」で全てのウィンドウを閉じます。

    • macOS/Linuxの場合:

      1. お使いのシェル設定ファイル（.zshrc, .bash_profile, .bashrcなど）をテキストエディタで開きます。
      2. ファイルの末尾に以下の行を追記します。（パスはあなたの環境に合わせてください） bash export PATH="$PATH:/Users/your-username/development/flutter/bin"
      3. ファイルを保存し、ターミナルを再起動して設定を反映させます。

Step 3: flutter doctorで健康診断

環境設定が正しく行われたかを確認するための、非常に便利なコマンドがflutter doctorです。

  1. 新しいターミナル（コマンドプロンプトやPowerShell）を開きます。（環境変数を反映させるため、必ず新しいウィンドウを開いてください）
  2. 以下のコマンドを実行します。 bash flutter doctor flutter doctorは、あなたのシステムをスキャンし、Flutter開発に必要なツールが揃っているかを診断します。

doctorの診断結果の見方

実行すると、以下のような診断結果が表示されます。

Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.x.x, on Microsoft Windows ...)
[!] Android toolchain - develop for Android devices (Android SDK version X.X.X)
    ✗ cmdline-tools component is missing
      Run `path/to/sdkmanager --install "cmdline-tools;latest"`
[✓] Chrome (develop for the web)
[!] Visual Studio - develop for Windows apps (Visual Studio Community 2022)
[!] Android Studio (version X.X)
    ✗ Unable to find bundled Java version.
[!] Connected device
    ! No devices available

! Doctor found issues in 3 categories.

問題の解決

flutter doctorは非常に親切で、多くの場合、問題を解決するための具体的なコマンドや手順を提示してくれます。

表示されたメッセージに従って、一つずつ問題を解決し、再度flutter doctorを実行してください。すべての主要な項目（Flutter, Android toolchainなど）が[✓]になることが、このステップのゴールです。

キッチンのセットアップが完了しました！これで、あなたはFlutterアプリを料理する準備が整いました。 次のレシピでは、AIという最新の調理器具（ツール）をキッチンに導入する方法を見ていきましょう。