flutter(private memo)

公式のドキュメントとの関連をメモ

https://firebase.google.com/docs/flutter/setup?hl=ja&platform=web

前提条件

• IDEをインストール：ローカルのmacにVS-codeをインストール（なくても大丈夫）
• Flutterをインストール：VMインスタンスにsudo snap install flutter --classicでインストール
• Firebaseにログイン：とりあえずやらない

step1

• 1.まだインストールしていない ...

• 2.firebase loginはFirebase CLIインストール時に行ったので不要
• 3.dart pub global activate flutterfire_cliを実行
• flutterfireのパスを通すため.bashrcなどにexport PATH="$PATH":"$HOME/.pub-cache/bin"を追記

step2

• Flutterプロジェクトのディレクトリ内でflutterfire configureを実行

step3

ここは手順通りでOK

• 1.flutter pub add firebase_core
• 2.flutterfire configure
• flutter create helloなどで新規作成した場合は、FlutterアプリでFirebaseを使用するコーディングがされていないので、手順の3,4を行う

step4

今回はFirestoreを使用するのでFirestoreのプラグインを追加する

• 1.flutter pub add cloud_firestore
• 2.flutterfire configure
• プログラムにデータベース関連のコーディングを行う

たぶん必要最小限の手順でFlutterとFirebase連携できるはず。
これをみながら動画を作成する予定です。

何気なく flutter って入力すると、動いた。
Cloud Shellってflutterも入ってたのか ...

いや、そうでもないか

φ(･_･;
firebase にflutter プロジェクトを作る時って、コマンド必須？
コンソール画面で作成できない？
terraformではできない？

   49  dart pub global activate flutterfire_cli
   50  export PATH="$PATH":"$HOME/.pub-cache/bin"
   51  flutterfire configure --project=dev-chottodake-open-test
   52  firebase --version
   53  curl -sL https://firebase.tools | bash
   54  firebase login --no-localhost
   55  firebase projects:list

φ(･_･;
open-testを初期状態にする

• terraform destroy
• ./init-open-test.sh 独自の初期化シェルでサービスの停止などなど
• APIとサービスの認証情報を消せるものは全部削除
• IAMでGoogle自動生成のものも含めて消せるものは全部削除
• IAMと管理の中にあるfirebaseのラベルを削除
• firebaseのコンソールでアプリを削除（プロジェクトの削除ではないよ）
• IAMを見るとまた勝手に増えてたので削除

でもコンソールでfirebase関連のメニューなどを選択した時点でAPIを勝手に有効にしたり、サービスアカウント勝手に作ったりするんですよねぇ。

ラベルを削除すればfirebase projects:listで一覧に表示されなくなるのかな。
それプラス色々削除しないとダメなのかな。
前回削除したあとに、再作成すると、firestoreのデータ残ってたっぽかったな。
プロジェクト自体の再作成をすれば、完全に綺麗になるんだけど、GCPに作成できるプロジェクト数のデフォルトって５つくらいだったはずで、削除してもすぐに消えないから、気軽に削除できないんですよね。

φ(･_･?
Cloud Shellでどこまでできるかな

yukip@cloudshell:~$ firebase --version
12.4.8

yukip@cloudshell:~$ firebase projects:list
Error: Failed to authenticate, have you run firebase login?

yukip@cloudshell:~$ firebase login --no-localhost
i  Firebase optionally collects CLI and Emulator Suite usage and error reporting information to help improve our products. Data is collected in accordance with Google's privacy policy (https://policies.google.com/privacy) and is not used to identify you.
...
✔  Success! Logged in as yukip@chottodake.dev
yukip@cloudshell:~$ 

yukip@cloudshell:~$ dart pub global activate flutterfire_cli
...
You can fix that by adding this to your shell's config file (.bashrc, .bash_profile, etc.):

  export PATH="$PATH":"$HOME/.pub-cache/bin"

Activated flutterfire_cli 0.2.7.
yukip@cloudshell:~$ 

yukip@cloudshell:~$ export PATH="$PATH":"$HOME/.pub-cache/bin"
yukip@cloudshell:~$ flutterfire
FlutterAppRequiredException: The current directory does not appear to be a Flutter application project.
yukip@cloudshell:~$ 

φ(･_･
続き

yukip@cloudshell:~$ flutter create xxx

yukip@cloudshell:~/xxx$ flutterfire configure
i Found 0 Firebase projects.                                                                                            
✔ Enter a project id for your new Firebase project (e.g. my-cool-project) · dev-chottodake-open-test                    
i New Firebase project dev-chottodake-open-test created successfully.                                                   
FirebaseCommandException: An error occured on the Firebase CLI when attempting to run a command.
COMMAND: firebase projects:create dev-chottodake-open-test --json 
ERROR: Failed to create project because there is already a project with ID dev-chottodake-open-test. Please try again with a unique project ID.
yukip@cloudshell:~/xxx$ 

消したはずだけど、まだ残骸が残っているのかなぁ。というかfirebaseのコンソールにプロジェクトが表示されてるから、残ってるってことですよね。
adminプロジェクトに間違ってfirebase追加した方はラベルを消すとfirebaseのコンソールからも消えたっぽいんだけどなぁ。

yukip@cloudshell:~/xxx$ flutterfire configure --project=dev-chottodake-open-test
i Found 0 Firebase projects. Selecting project dev-chottodake-open-test.                                                
FirebaseProjectNotFoundException: Firebase project id "dev-chottodake-open-test" could not be found on this Firebase account.
yukip@cloudshell:~/xxx$ 

この一連のことができると、VMインスタンスにFirebase CLI とか flutterfire_cli いらないのかなってね

firebaseのコンソールで、アプリを追加する時に、flutterアプリの時はcliからやってねみたいな手順が表示されるので面倒だけど、これって web を選んどいてもいいのかな。

GCPプロジェクトにfirebaseを追加したら、firebaseだけを消すことってなかなか難しい。
ラベルについて書いてあるサイトも多いけど、ラベル消してもfirebaseコンソールにプロジェクトが残るんですよね。
gcloud CLI で firestore のデフォルトデータベースを削除しても残ります。
もちろんAPIは全部止めてサービスアカウントも全部消してます。

で、今回やったのは、プロジェクトの削除w
元々GCPのプロジェクト側はterraformでやってるのでまぁまぁ初期化できます（自動作成されるアカウントは手で消す）ので、プロジェクト削除で全然問題ないんです。
プロジェクトの削除ができない理由は削除猶予期間が３０日もあるからなんですよね。

というわけで、プロジェクトを削除して、念の為、１日くらい放置して、プロジェクトを復活させます。

すると、♪　firebaseコンソールにゾンビのように残ってたプロジェクトが、消えてるんです（というか復活しないんですw）

GCPとしてのプロジェクトは復活してます。が、公式にもあるように全部完璧に復活するわけではないです。
今回試したときに、あれ、ないな〜と思ったのはシークレットなんちゃら関連ですかね。
プロジェクト復活はサービスによっては復活に時間がかかるものがあるようなので、シークレットやもしかしたら、firebaseも復活しちゃうかもしれませんけど ...

GCPプロジェクトは残しつつ、firebaseプロジェクトを抹殺することができそうな感じですが、もう少し観察してみますw

これはほんと個人メモ　φ(･･

とりあえずここまでの作業内容を動画を見ながら時系列にメモ。これを見ながら後でやり直してみます。

メモ

• プロジェクト選択
• 現在有効になっているAPIとサービスを表示
• IAMの表示（google提供のロールも表示）
• chromeのズームは100%
• firebaseコンソール表示
• 登録されているアプリの設定を表示
• GCEのVMインスタンス一覧を表示
• cloud shell起動
• cloud shellを新しいウィンドウで表示
• editorを開く
• yukipフォルダを開く
• 設定のカラーテーマで default dark を選択
• ll コマンドなどでディレクトリの色を確認
• cloud shell editor の chromeのズームを 125%に変更
• git clone https://github.com/yukip-20000418/open-test.git 実行
• 右下の toggle bottom panel アイコンを押してターミナル領域を非表示に
• 左の一覧から init-open-test.sh を選択して中身を確認
• chrome のズームを100%に戻してみる
• main.tf の中身を確認
• zennウインドウの文字サイズを二段階大きくしてみた
• editor側のズームを150%にして大きさを確認
• ターミナルウインドウも表示させ大きさ確認
• gcpのコンソールに戻って、下に表示されているターミナル領域をxで削除
• firebaseコンソールを125%にしてみた
• firestoreの表示状態を確認
• gcpのコンソールも125%にしてみた
• VMインスタンスの一覧画面の大きさ確認
• オブザーバビリティの画面の大きさ確認
• 左側のメニュー表示をアイコンにしてみる
• gcpコンソール側のffirestoreのメニューを選択
• cloud shellの画面に移動
• gcloud alpha firestore databases delete --database="(default)"を実行してみる
• データが残っているので削除できない。
• firebaseコンソール側のfirestore画面でコレクションを削除
• cloud shell で再実行。
• gcpコンソールのfirestore画面にはまだ情報が残っている(画面更新していないから)
• IAMのラベルを表示
• firebase=enabeld のラベルを削除＆保存
• firebaseコンソールでプロジェクトの概要の上のfirebaseタイトルをクリックしてTOP画面を表示
• プロジェクトに open-test が残っていることを確認
• shift + 再読み込みでも残っている
• open-test プロジェクトを選択
• helloアプリの設定を表示
• 一番下の このアプリを削除 で削除。
• firebase のTOP画面で open-test プロジェクトが残っていることを確認
• gcpコンソールでラベルが復活していないか画面を更新して確認
• 有効なAPIとサービスを表示
• cloud shell editor で terraform init 実行
• terraform destroy 実行
• 左側のファイル一覧を非表示にして、ズームを125%に
• init-open-test.sh を実行
• APIとサービスの画面を更新
• シェルで削除したので service usage api と secret manager api だけになっている
• gcpのfirestore画面を表示
• firestorea api が有効になっていませんと表示されていた
• データベース一覧には何もなし。 (default) データベースもない
• APIとサービスの画面を表示
• 画面表示したので、cloud firestore API と firebase rules api が起動されていた
• それぞれ選択して個別にAPIを無効化した
• APIとサービスの中の認証情報の画面を表示
• IAMの表示google管理も含めて不要なものを全て削除
• cloud storage の画面で、削除されたデータを表示をオンにしてみてた
• cloud shell editore で ls -a $HOME の後に sudo rm -rf $HOME を実行
• cloud shell を再起動
• cloud shell のタグを閉じる
• mac のターミナルを起動
• ターミナルの設定で、フォントサイズなどを確認
• カラーは不透明度80%、ブラー80%、フォントは monaco 14
• ウインドウのサイズは確認しなかったが、 144x25
• ターミナルを閉じた
• 画面にdock を表示させて、chrome のウインドウがdockに被らないように変更
• gcpのコンソールのタグを一旦閉じて、再度ショートカットからGCPコンソールを開く
• cloud shell 起動
• エディタを開く
• ターミナルを開く
• 文字の大きさを確認してみた
• エディタを開く
• terminal を開く
• ファイル一覧を表示（explorer）
• ズームで100％でのターミナルやフォルダ一覧の表示を確認
• open folder で yukip を表示
• ズーム125%でエディタエリアとターミナルエリア、フォルダ一覧の大きさを確認
• macのターミナルを開いて日本語のフォントの見え方を確認
• ./color.sh で横幅 144x25の状態も確認
• ターミナルは閉じた。
• ズームを100%に戻した
• firebaseのコンソールに戻ってopen-testを選択
• ズームを100%にした
• gcpコンソールのopen-testを選択して、ズームを125%に変更
• cloud shell editor も 125%に

結局色々触ったと思ったけど結論は以下w

• chromeのズームは125%が良さそう。
• firebaseコンソールのプロジェクトは消えない。

やっぱ無理かな

ただ、adminプロジェクトで間違ってfirebaseプロジェクトを作ってしまったときは、サービス止めてラベル消した程度で、firebaseコンソールから一覧が消えた。
なので、DB周りに残骸があってプロジェクトが消えてくれないのかもしれない。けど (default)データベースを削除しても消えてくれなかった。

φ(･･
個人のメモなので意味はありません。

別の動画の操作も抜き出し。

terraform plan
terraform destroy
init-open-test.sh
アプリ削除
firestore コレクション削除
ラベル削除
init-open-test.sh
IAM削除
サービスアカウント削除
init-open-test.sh
マーカー2
init-open-test.sh
tmp修正
init-open-test.sh
terraform plan
マーカー1
.ssh/config edit
rm known_hosts*
rm -rf ~/Library/Application Support/Code
rm -rf ~/.vscode/
remote ssh install
init.sh
sudo reboot
git clone ..... hello.git
flutter --version
flutter doctor -v
flutter extention install
vscode file re-open /hello
flutter clean
flutter pub get
flutter build web
python3 -m http.server 34567
flutter run -d web-server ..... 0.0.0.0
firebase firestore データベースの作成
有効期限延長
dart pub global activate flutterfire_cli
export PATH ....
curl -sL  ..... firebase.tools | bash
firebase login --no-localhost
firebase projects:list
firebase init
間違って admin に作った
firebase init
flutterfire configure --project .....
firebase ラベル追加
flutterfire configure --project .... RERUN
gcloud config set project dev-chottodake-open-test
gcloud services enable firebase.googleapis.com
flutterfire configure --project ...... RERUN
flutter run -d web-server --web-port .....