Flutter入門 - 1m-llc/Flutter-KtoK GitHub Wiki

Flutter公式で学ぶ

1. Codelabsで学ぶ

• Flutter初心者向けの教育コンテンツです。
• https://flutter.dev/docs/codelabs

2. 他の言語の開発者向けのコンテンツです。

• Flutter for iOS developers
  • https://flutter.dev/docs/get-started/flutter-for/ios-devs
• Flutter for Android developers
  • https://flutter.dev/docs/get-started/flutter-for/android-devs
• Flutter for web developers
  • https://flutter.dev/docs/get-started/flutter-for/web-devs

3. Flutter開発トップ

• https://flutter.dev/docs/development
• Flutter開発における様々な情報がまとまっています。

4. ウィジェットの紹介

• https://flutter.dev/docs/development/ui/widgets-intro
• 以下を学べます
  • Hello World
  • 基本的なウィジェット
  • 画面遷移のNavigatorを含む、基本的なMateriapAppウィジェット
  • Gestureのハンドリング
  • 入力によって変化するウィジェット
  • ウィジェットのライフサイクル

5. ウィジェットカタログ

• https://flutter.dev/docs/development/ui/widgets-intro
• 以下が紹介されています。
  • アニメーション
  • アセット（イメージ、アイコン）
  • 非同期（Async）
  • Basic widgets
    • AppBar
    • Column
    • Container
    • Icon
    • Image
    • Placeholder
    • RaisedButton
    • Raw（水平の配列表示）
    • Scaffold（土台）
      • コードを修正しながら実行して学べます。
      • https://api.flutter.dev/flutter/material/Scaffold-class.html
    • Text

6.ビルドとリリース

• iOSアプリのビルドとリリース
  • https://flutter.dev/docs/deployment/ios
• Androidアプリのビルドとリリース
  • https://flutter.dev/docs/deployment/android

非公式サイトで学ぶ

1.環境構築編

• Flutter環境構築
  • https://qiita.com/k_naruse___/items/359fcdfb8aa092e9a44e
    • 1（Flutter SDKインストール編）
    • 2（Xcode・iOSシミュレーターセットアップ編）
    • 3（Android Studio・Androidエミュレータセットアップ編）
    • 4（VSCodeセットアップ編）

2. Flutter入門のためのDart入門

• https://qiita.com/teradonburi/items/913fb8c311b9f2bdb1dd
  • Flutterのアーキテクチャ
  • Dart文法

3. Flutter でモバイルアプリを作ってみる

• https://www.apps-gcp.com/introduction-of-flutter-about-header-and-footer/
• 図やキャプチャ画像を多様してわかりやすく説明しています。

4. レイアウトについて体系的に学ぶ

• Flutter Layout Cheat Sheet
  • https://medium.com/flutter-community/flutter-layout-cheat-sheet-5363348d037e
• Flutter Layouts Walkthrough: Row, Column, Stack, Expanded, Padding
  • https://medium.com/coding-with-flutter/flutter-layouts-walkthrough-row-column-stack-expanded-padding-5ed64e8f9584

その他、ぐぐるとたくさん出てきます。