色々やりたい系エンジニアのメモ

いろいろやりたい気持ちだけが先行する人

【Flutter】企業系アプリによくある機能をどう作ってるか考えてみる

これの内容を実際作るとしたらどうするかという話

www.iroiro-engineer.com

はじめに

How to記事ではなく、個人メモになります。

目次

  • 会員証
  • 通知
  • ポイント機能
  • クーポン
  • ニュース
  • 店舗検索

会員証

  • 会員番号のバーコード
  • ポイント機能がついていることも

作り方を考えてみる

だいたいパッケージ化されている

pub.dev

ぱっと見これでいけそう

感想

会員証の画面は意外と簡素

通知

アプリ内で見れるものだけでなく、push通知を伴うことが多い印象

作り方を考えてみる

アプリ内通知

  • APIでサーバーから取ってくるだけ
  • 遷移先
    • アプリ内の任意の画面
    • 内部ブラウザで開く
    • 外部ブラウザで開く

push通知

  • FCM
  • 遷移先
    • アプリ内の任意の画面
    • 内部ブラウザで開く
    • (外部ブラウザ)
      • push通知をタップしたときにいきなりブラウザが開くパターンはあまり見ない気がする

技術面

Flutterのパッケージで見つかったのはこれ

pub.dev

Railsで送信するならこれ(gem)

github.com

fcmという名前のgemもあるが、公式ではないらしく遅いらしい

自分が昔作ったときはこれ

zenn.dev

感想

自分的にはサーバーサイドで送信するイメージなので、Flutterパッケージは何をしているんだろうと気になる

ポイント機能

会員証画面と同じこともある印象

作り方を考えてみる

...と言っても、サーバーサイドで作ってアプリ側では表示だけしている印象

以下2つのAPIをサーバーサイドで作ってアプリ側で叩く

  • 現在のポイント情報API
    • 残高
    • 総獲得
      • 会員ランクなどがある場合、次のランクまでいくつ
  • クーポンや別のアプリのポイントに交換できる場合そのためのAPI

感想

アプリ側でできることの種類はもっと色々アプリ入れて観察してみないとわからない

クーポン

  • 所持クーポン一覧
  • クーポン使用 これもサーバーサイドで作ってアプリ側は表示だけの印象なので略

ニュース

webviewが多いイメージ webviewでなくとも、API叩いて表示している印象

  • 以下のAPIを作る
    • ニュース一覧
    • ニュース詳細

店舗検索

webでよくある、セレクトボックスから都道府県選択して...という形式もあるが、 googlemapにピンが立っている形式をよく見かける印象

これはどうやっているのかイメージできない。 店舗情報はAPIサーバーが持っている気がするから、それをどうにかしてマッピングする方法があるのだろう。

自分のレベルではまだわからない。

まとめ

  • 考えてみると面白い
  • 案外シンプル
  • サーバーサイドありきな構成が多いのかもしれない
    • 管理用にCMS作るだろうし当然っちゃ当然