Zenn
Open12

📱 DartとFlutterを学ぶ

Flutter
Dart
akariakari

ハッカソンのアプリ開発ででFlutterを使うことになりました！
年末年始で一気に勉強するぞ…！

akariakari

プロジェクトを作成する

👇これをやっていきます
https://codelabs.developers.google.com/codelabs/flutter-codelab-first?hl=ja#2
👇動画も見ながらやると分かりやすい
https://www.youtube.com/watch?v=8sAyPDLorek

flutter run -d デバイスIDで立ち上げ

https://dev.classmethod.jp/articles/master-the-flutter-devicesflutter-run-command-in-flutter-app-development/#:~:text=100.0.4896.88-,flutter run,-flutter devicesコマンド

その他

  • MacOSで開発する場合、ターゲットデバイスはMacOSのDesktopにする
  • Web版だとホットリロードが効かず、毎回保存した後にrまたはR をコマンド入力する必要がある
akariakari

Firebaseについて学ぶ①

https://firebase.google.com/codelabs/firebase-get-to-know-flutter?hl=ja#0

①で詰まったところ

1. flutterfire configureコマンドでエラーになる

  • FirebaseCommandException: An error occured on the Firebase CLI when attempting to run a command.のエラーが出る

👇解決方法

  • https://firebase.google.com/docs/cli#install_the_firebase_cliを見て、FlutterFire CLIをインストールする
  • firebase login --reauthコマンドを入力し、Webでログインする

https://qiita.com/norifumi92/items/8e7832f9c46df4918291

Firebaseについて学ぶ②

https://firebase.google.com/codelabs/firebase-auth-in-flutter-apps?hl=ja#0

akariakari

ポケモンから学ぶFlutter

👇いちばん面白そうだったので、この本からやっていきます
https://zenn.dev/sugitlab/books/flutter_poke_app_handson

詰まったところ

1. 画像が表示されない

  • socketexceptionのエラーが出る
  • 以下の方法で解決できた

https://zenn.dev/ta4/articles/macos_cant_tcp

2. チップの周りに実線が入る

  • 重要じゃないところなので一旦飛ばす
  • デザインの面から言うと修正したい…

3. Step3: メイン画面とサブ画面を移動しようから、何やってるのか分からなくなる

  • GitHubのコードと比較しながら、とりあえずやりきる