狐好きぷろぐらまー

狐好きプログラマーのブログです。

【codemagic】FlutterプロジェクトにてビルドからFirebase App Distributeの配布までをcodemagicで自動化する手順【Flutter】

こんばんは。 pregum_foxです。

今回は個人開発毎回ビルドを手元で行うと、時間が溶けてしまうのでcodemagicを利用して

GitHubのレポジトリのdevelopブランチにPRがマージされたタイミングでビルドからFirebase App Distributeで配布を行う処理を自動化する手順を備忘録として残しておきます。

以下目次です。

  • この記事を読んでわかること
  • 事前に準備が必要なもの
    • 必須
    • iOSでのビルドする場合
    • Androidでビルドする場合
    • Firebase App Distributionで配布する場合
  • 手順
    • firebase-tools コマンドのインストール
    • firebaseプロジェクトの初期化
    • firebaseパッケージをFlutterプロジェクトへ追加
    • codemagicの設定
      • Build triggers
      • Build
      • Distribution
      • Firebase App Distribution
        • Firebase service account
        • Android Firebase app ID
        • iOS Firebase app ID
        • Tester groups for Android app / Tester groups for iOS app
  • 雑感

この記事を読んでわかること

codemagicを用いてFlutterの開発環境のビルド〜Firebase App Distributionの配布までの設定方法

事前に準備が必要なもの

必須

  • codemagicのアカウント
  • GitHubのアカウント

iOSでのビルドする場合

  • code signing certificate(*.p12 ファイル)
    • p12ファイルの作成方法はこちらこちら の記事が参考になります。
  • プロビジョニングプロファイル(*.mobileprovision)
    • 今回は開発環境なのでiOS App Development でOK

Androidでビルドする場合

  • keystore
    • 今回は開発環境なので、~/.android/debug.keystore のkeystoreを使用します。残りの3項目は左記のkeystoreの場合は、いじっていなければ以下の想定です。
  • alias
    • androiddebugkey
  • storepass`
    • android
  • keypass
    • android

Firebase App Distributionで配布する場合

  • Firebaseのアカウント
続きを読む

【Supabase】対象のEmailの重複確認を行う関数の作成方法とその呼び出し方【Flutter】

こんにちは。pregum_foxです。

最近模様替えを行いモニタの配置が変わって姿勢がよくなりましたが、机の高さを変えられる昇降デスクが欲しくなった今日この頃です。

概要

今回は、supabaseのsignUpメソッドにてデフォルトの挙動ではすでに存在するEmailを渡しても例外を投げないので、ないなら自分で作ってしまおうということで事前に存在チェックをするPostgres functionを定義して、Flutterから呼び出す処理がうまく動作したので記事にしました。

注意点

Issueにはセキュリティの問題からサニタイズされたユーザーデータ(つまりダミーのユーザーデータ)を返すようなので、戻り値で判定できないようになっているので、セキュリティホールにならないように実装が必要です。

以下目次です。

  • 概要
  • 注意点
  • 検証環境
  • Postgres functionsの実装
    • SQLの説明
    • 同名のPostgres functionの確認
    • SQLの実行
  • Flutterからの呼び出し方
  • まとめ
  • 参考記事
続きを読む

【Tool】最近開発で使っているツールについてまとめてみました【macOS】

こんにちは。pregum_foxです。

最近使う電子マネーSuicaからQUICPayに変えてみたのですが、通知のタイトルを初めてみたときシンプルすぎて少し笑ってしました。

支払い自体はスムーズでチャージもしなくてよいので、今後も使っていこうと思ってます。

概要

さて今回は、最近開発で使っているツールをまとめてみようと思います。

いわゆる「ぼくのかんがえたさいきょうのつーる」のつもりで書いていますので

  • 「このツールの方が良いでしょJK」
  • 「このツール使ってないとか、にわか乙」
  • 「それ、GPTでできるよ」

などがあれば、コメントもらえると嬉しいです😉

注意点

この記事の対象OSはmacOS です。

ですのでWindows ならこれがあるやLinux では〜〜 などは聞き流してしまうのでご注意ください。

また、対象はモバイルアプリ・Webアプリの方をターゲット層のつもりで書いています。

インフラ系の方にはお口に合わない可能性があります。

その場合でも色々ご意見いただけますと幸いです 🙏

以下目次です。

バックグラウンド

普段どのような開発をしているか説明します。

普段はモバイルアプリの開発をやりつつ、React.jsやCloud Function for FirebaseなどのNode.js + TypeScriptのコードも書いていたりしています。

ですので、バックエンドは知ってるぐらいで詳しくないです。

趣味では、FlutterやBaaSの勉強をしつつ個人開発を細々とやっています。

そんな人間がよく使うツール一覧をまとめましたので、その認識で読んでいただけると幸いです。

  • 概要
  • 注意点
  • バックグラウンド
  • ターミナル
    • Warp
      • 使っていて便利だと感じた点
      • 少し困っている点
  • Spotlight系
    • Raycast
      • 便利な点
      • 試してみたい点
  • 作業記録系
    • toggl
  • Window移動(cmd + tab的なもの)
    • AltTab
      • 嬉しい点
      • ちょっと悲しい点
  • git操作
    • tig コマンド
      • 便利な点
      • 少し手を加える必要がある点
    • lazygit コマンド
      • 便利な点
      • 少し困った点
    • gh コマンド
      • 嬉しい点
  • クリップボード
    • Clipy
      • 嬉しい点
  • ブラウザの拡張機能
    • vimium
      • 嬉しい点
      • 悲しい点
    • CLEAN crxMouse Gestures
      • 嬉しい点
      • 対応が必要な点
  • ちょっとした変換
    • Macのデフォルトの変換ショートカットキー
  • メモ帳
  • トンネリング
    • ngrok
  • npmなどのバージョン管理ツール
    • anyenv
    • fvm
    • homebrew
  • IME関連
    • 英かな
    • Karabiner-Elements
  • 感想
  • 参考URL
続きを読む

【Flutter】Supabaseでの中間テーブルの作り方とFlutterからの使い方について【Supabase】

こんにちは。pregum_foxです。

今回の記事は Supabase Advent Calendar 2023 の6日目の記事となっています。

前回は いせりゅー🥳 さん の【Flutter x Supabase】SNS系のアプリで自分の投稿だけを取得する方法 でした!

それではSupabaseでの中間テーブルの作り方とFlutterからの使い方について書いていきます。

以下目次です。

  • 背景
  • 想定読者
  • この記事を読むとできるようになること
  • この記事を読んでもできないこと
  • 開発環境
  • 今回作成するテーブル一覧
  • 今回作成するアプリの操作フロー
  • 完成図
  • 手順
    • 1. Supabaseプロジェクトを作成
    • 2. .env ファイルの設定
    • 3. DBの初期設定
      • menusテーブルの作成
      • allergensテーブルの作成
      • menus_allergensテーブルの作成
    • 4. Flutter側の呼び出し側の実装
  • うまくいかない場合に、確認する点
  • 宣伝
  • RLSについて再度ご連絡
  • 雑感
  • 参考サイト
続きを読む

【Supabase】Flutter + Supabase Authentication で Social Login(Facebook) のサインアップ・サインイン処理のサンプルを作った

こんにちは。pregum_foxです。 今回はFlutterでSocial Login(Facebook)のサンプルを作成していきます。 前回はSocial Login(Google)のサンプルを作成しました。

【Supabase】Flutter + Supabase Authentication で Social Login(Google) のサインアップ・サインイン処理のサンプルを作った【Flutter】 - 狐好きぷろぐらまー

今回は下記のSocial Login(Facebook)のサンプルを作成します。

supabase.com

他の認証サンプルを見たい場合は下記記事から確認できます。

pregum-fox.hatenablog.jp

それでは目次です。

  • 開発端末
  • 検証端末
  • Facebookログインを導入するための大まかな手順
  • サンプルで作成したリポジトリ
  • 必要なもの
  • 具体的な手順
    • 1. Facebook 開発者アカウントにアクセスします。
    • 2. Facebook アプリを作成
    • 3. FacebookアプリのFacebook ログインをセットアップする
    • 4. emailの取得権限を設定
    • 5. Facebook アプリID とシークレットを Supabase プロジェクトに入力
    • 6. アプリのリダイレクトの設定
      • Supabase側の設定
      • アプリ側の設定
    • 6.クライアントコードを実装
  • 完成
  • 雑感
  • 参考サイト
続きを読む

【Supabase】Flutter + Supabase Authentication で Social Login(Google) のサインアップ・サインイン処理のサンプルを作った【Flutter】

こんにちは。pregum_foxです。

今回はFlutterでSocial login(Google)のサンプルを作成していきます。

前回はPhone Login(SMS)のサンプルを作成しました。

https://pregum-fox.hatenablog.jp/entry/2023/11/04/142144pregum-fox.hatenablog.jp

今回は下記のSocial Login(Google)のサンプルを作成します。

supabase.com

他の認証サンプルを見たい場合は下記記事から確認できます。

pregum-fox.hatenablog.jp

それでは目次です。

  • 開発端末
  • 検証端末
  • Social Loginについて
  • 実装後のサンプルリポジトリ
  • 大まかな手順
  • 必要なもの
  • 具体的な手順
  • まとめ
  • 雑感
  • 参考URL
続きを読む

【VSCodeVim】vim-plugを使ったことがないけど、VSCodeVimからVSCode Neovimに移行した【VSCode Neovim】

こんにちは、pregum_foxです。

明日は技術書典があるので行ってみようと思ってチケットを見ると13時までは売り切れていました。

行く予定の方は下記からチケットを受け取っておくことをお勧めします。

techbookfest.org

ちなみにチケット自体は0円です。

チケット予約・確認箇所

はじめに

この記事では、以下のような人間でもVSCodeVimからVSCode Neovimへの移行過程を共有します。

  • vscodeにもneovim拡張機能あるんだ、ん、vim-plug なにそれ?美味しいの?
  • VSCode Neovim入れたけど動かない〜
  • init.vimの中の記述のPlug ~~ ってなに?
  • なにもわかんないけど、とりあえず動けばヨシ!

以下目次です。

  • はじめに
  • この記事の対象読者
  • この記事を読むと、できるようになること
  • この記事の想定していない読者
  • 動作環境
  • 移行手順
    • 0. neovimのインストール
    • 1. Plugのセットアップ
    • 2. easymotionの設定
    • 3. 追加の試み
  • 現在使用している init.vim
  • まとめ
続きを読む