FlutterとDartが何かを知り、ツールをインストールし、最初のプロジェクトを作成して、ホットリロードの魔法を体験しましょう。
このレッスンを Kodokon で開くFlutterはフレームワークです。すぐに使えるコードの大きな道具箱で、モバイルアプリケーション、つまりスマートフォンにインストールするプログラムを作るためにGoogleが開発しました。その大きな強みは、コードを一度だけ書けば、iPhone、Android、ウェブ、さらにはデスクトップでも動くことです。そのコードはDartというプログラミング言語で書かれます。これは機械に命令を与えるための言葉と規則の集まりです。Flutterをインストールするには、docs.flutter.devの公式ガイド（Get startedのセクション）に従いましょう。そこでSDK（Software Development Kit、すべてのツールを含むキット）をダウンロードし、Visual Studio CodeなどのコードエディターとそのFlutter拡張機能をインストールします。そのあと、すべてをターミナルで確認します。ターミナルは、コンピューターを操作するためにテキストのコマンドを入力する窓です。
flutter doctorflutter doctorコマンドは医者のように振る舞います。あなたのマシンを診察してチェックリストを表示し、準備ができているものには緑のチェックを、足りないものにはバツを、そしてそれを直すための指示を示します。要点が緑になったら、最初のプロジェクトを作成できます。プロジェクトとは、アプリのすべてのコードを収めるフォルダーのことです。Flutterのプロジェクト名は小文字で、スペースやアクセント記号を使わず、単語を区切るにはアンダースコア（_）を使って書きます。
flutter create my_first_app
cd my_first_app
flutter runflutter createは、完全なデモアプリを含むmy_first_appフォルダーを作ります。cd（change directory）はそのフォルダーの中に移動し、flutter runはアプリをコンパイルして、USBで接続したスマートフォン、エミュレーター（画面に表示される仮想のスマートフォン）、またはChromeブラウザで起動します。あなたが書くコードはすべてlib/main.dartファイルの中にあります。その中身をこの最小限のプログラムに置き換えましょう。
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(useMaterial3: true),
home: const Scaffold(
body: Center(
child: Text("Hello Flutter!"),
),
),
);
}
}すべてを完全に理解しようとせず、大まかに読んでみましょう。importはFlutterのグラフィックの道具箱を読み込み、void main()はエントリーポイント（最初に実行される関数）で、runAppは画面の中央に"Hello Flutter!"というテキストを表示してアプリを起動します。それぞれの部分は次のレッスンで詳しく説明します。さて、ホットリロードの魔法です。メッセージのテキストを変えてファイルを保存すると、表示されているアプリが再起動なしに即座に更新されます。この非常に短いサイクルこそ、Flutterの大きな強みの一つです。