※自分の学習記録のメモとしてこの記事を書いています。
1日目：Flutter学習1日目 -公式を読む 1. インストール編-
2日目前編：Flutter学習2日目前編 -公式を読む 2. エディターの設定編-
2日目後編：Flutter学習2日目後編 -公式を読む 3. テストドライブ編-（イマココ）
今回は公式ドキュメントのTest driveページを進めて行きます！
このページではテンプレートから新しいFlutterアプリを作成→実行し、アプリに変更を加えると「ホットリロード」する体験方法が説明されています。
今回はVS Codeで進めていきます🔥
アプリを作成する
- View > Command Paletteを選択します（もしくは⌘+Shift+P）
- 「flutter」と入力し、Flutter：New Projectを選択
- プロジェクト名（myapp）を入力し、Enteｋrキーを押します
- 親ディレクトリを求められるので選択します（私の場合は~/works）
- main.dartファイルが表示されるまで待って終わりです
アプリを実行する
-
VS Codeの下部にある青いステータスバーを見つけます
-
Device Selectorからデバイスを選択します（私の場合はシミュレーターを選択しました）
-
Run > Start Debuggingを選択します
-
アプリの起動を少し待ちます。アプリのビルドが完了するとシミュレーターの画面が変わります
ホットリロードを試す
- lib/main.dartを開きます
- 文字を変更します
'You have pushed the button this many times'
👇👇👇
'You have clicked the button this many times'
- 保存するとホットリロードでシミュレーターの文字が変わりました🎉
プロファイルまたはリリースの実行
とても便利なホットリロードですが、公式で注意書きがありました。
So far you’ve been running your app in debug mode. Debug mode trades performance for useful developer features such as hot reload and step debugging. It’s not unexpected to see slow performance and janky animations in debug mode. Once you are ready to analyze performance or release your app, you’ll want to use Flutter’s “profile” or “release” build modes. For more details, see Flutter’s build modes.
訳：
これまでは、デバッグモードでアプリを実行していました。デバッグモードは、ホット リロードやステップデバッグなどの開発者にとって便利な機能のためにパフォーマンスを犠牲にしています。デバッグモードでパフォーマンスが低下したり、ぎこちないアニメーションが表示されるのは予想外のことではありません。パフォーマンスを分析したり、アプリをリリースしたりする準備ができたら、Flutterの「profile」または「release」ビルドモードを使用することをお勧めします。詳細については、Flutterのビルドモードを参照してください。
実際にリリースする際には十分気をつけたいと思います！
感想
iOSを開発している方が「ホットリロードは感動する」って言っていたのできっとネイティブ開発の方にとっては目玉の機能なんだろうな〜と思って今回進めていました☺️
次回（3日目）は、小さなアプリを作成して、Flutterのコアとなる概念を学びます！💡