【運用中のDBとうまく付き合うBFF開発】③ 複雑な条件分岐に宣言的プログラミングで立ち向かう

image

この記事は、【 可茂IT塾 Advent Calendar 2023 】の6日目の記事です。

はじめに

2023年頭に、長らく運用しているWebアプリケーションのアプリ版を新しく作るため、Flutterアプリのバックエンドアプリケーション(APIサーバー)を開発する業務を任せていただきました。

いわゆるBFF(Backend For Frontend)の開発です。

クライアント・サーバーの関係図

この開発を通じて学んだことを共有します。3記事のシリーズになっているので合わせて以下の記事をお読みください。

  1. 📚 【運用中のDBとうまく付き合うBFF開発】① NestJSとPrismaで生SQLを使ってデータを取得する
  2. 📚 【運用中のDBとうまく付き合うBFF開発】② passport-localを使った認証とハッシュソルトの実装
  3. 📖 【運用中のDBとうまく付き合うBFF開発】③ 複雑な条件分岐に宣言的プログラミングで立ち向かう

複雑な条件分岐に立ち向かう

今回の開発では、DBに存在するデータを元に複雑な条件分岐をえて出力した値を新しくDBに保存しなければいけない要件もありました。

色々な障壁がありました。例えば

  • 真偽値な値が01の文字列で表現されて保存している
  • 条件分岐に使う比較演算子の記号がDBに文字列として保存されていてそれを解析しなければいけない
  • 入っている記号によってカラムにデータが入っていたりnullだったりする

など、一筋縄ではいかない実装でした。

特に「条件分岐に使う比較演算子の記号がDBに文字列として保存されていてそれを解析しなければいけない」のは大変でした。

このようなテーブルに保存された条件を解析して入力を計算しなければいけないロジックを実装する必要がありました。

テーブルの図

記号には、=,=>, < などが入ります。

これに対して、以下の流れでロジックを書くことで、複雑な条件分岐を実装せざるを得ない部分を簡潔にしながら実装しました。

  1. コールバック関数でそれぞれの条件に合わせた計算を行う関数を生成する
  2. 数値2の記号と数値3の記号の条件分岐を先に処理し、入力を整える
  3. 記号に対する処理を書く

擬似コードで書くとこのようなコードになります。

const createCompareArray = (exampleDataMatchTableResult: { suchi1: number; suchi2: number; kigo1: string; suchi3: number; kigo2: string; }[]) => {
  return exampleDataMatchTableResult.map((v) => {
    // 記号1と記号2がある場合
    if (v.kigo1 && v.kigo2) {
      return (input: string) => {
        // ...
      }
    }
    // 記号1のみある場合
    if (v.kigo1) {
      return (input: string) => {
        // ...
      }
    }

    // 記号2のみある場合
    if (v.kigo2) {
      return (input: string) => {
        // ...
      }
    }
  });
};


const getResult = (input:string) => {
  const functions = createCompareArray(exampleTableResult);
  const results =
    functions.map((fn) => {
      retrun fn(input)
    });
  const result = results.find((v) => Boolean(v));
  return result;
};

このようにすることで、条件を解析して処理する部分を処理の流れから切り離すことができました。

Reactと呼ばれる宣言的にUIを記述するフレームワークを得意としており、関数型プログラミングのエッセンスを進んで学んでいたからこそ、このような実装ができたのだと思います。

終わりに

難しいロジックに対して、どのような実装をしたかを紹介しました。これより、コードを書ける感触もあるので、次同じような実装をするときはもう少し工夫してみようと思います。

以上が、私が2023年に開発したBFFの開発で学んだことです。シリーズを通して読んでいただけた方、ありがとうございました。

お知らせ

カリキュラムなし!学びたいことだけをプロと学べる『TechCampus』の詳細情報

カリキュラムなし!学びたいことだけをプロと学べる『TechCampus』の詳細情報

カリキュラムなし!学びたいことだけをプロと学べる『TechCampus』の詳細情報!興味のある人はぜひコミュニティに参加ください!

Read More
可茂IT塾ではFlutterインターンを募集しています!

可茂IT塾ではFlutterインターンを募集しています!

可茂IT塾ではFlutterインターンを募集しています!可茂IT塾のエンジニアの判断で、一定以上のスキルをを習得した方には有給でのインターンも受け入れています。

Read More

タグ

Flutter (96)初心者向け (26)イベント (17)Google Apps Script (14)Nextjs (11)可茂IT塾 (8)Firebase (7)riverpod (6)React (6)ChatGPT (4)新卒 (4)就活 (4)Dart (4)JavaScript (4)FlutterWeb (3)Prisma (3)NestJS (3)デザイン (3)Slack (3)TypeScript (3)ワーケーション (3)インターン (3)お知らせ (3)VSCode (2)設計 (2)線型計画法 (2)事例 (2)画像 (2)Figma (2)iOS (2)アプリ開発 (2)React Hooks (2)tailwindcss (2)社会人 (2)大学生 (2)RSS (1)CodeRunner (1)個人開発 (1)Android (1)Unity (1)WebView (1)Twitter (1)フルリモート (1)TextScaler (1)textScaleFactor (1)学生向け (1)supabase (1)Java (1)Spring Boot (1)shell script (1)正規表現 (1)パワーポイント (1)趣味 (1)Cupertino (1)ListView (1)就活浪人 (1)既卒 (1)保守性 (1)iPad (1)シェアハウス (1)スクレイピング (1)PageView (1)画面遷移 (1)flutter_hooks (1)Gmail (1)GoogleWorkspace (1)ShaderMask (1)google map (1)Google Places API (1)GCPコンソール (1)Google_ML_Kit (1)Vercel (1)Google Domains (1)Git (1)オンラインオフィス (1)LINE (1)Bitcoin (1)bitFlyer (1)コミュニティー (1)文系エンジニア (1)Freezed (1)アイコン (1)go_router (1)debug (1)Apple Store Connect (1)FlutterGen (1)Image (1)File (1)検索機能 (1)Shader (1)Navigator (1)メール送信 (1)Dio (1)Material Design (1)カスタム認証 (1)アニメーション (1)Arduino (1)ESP32 (1)経験談 (1)フリーランス (1)vscode (1)mac (1)csv (1)Dialog (1)BI (1)LifeHack (1)ショートカット (1)Chrome (1)高校生 (1)キャリア教育 (1)非同期処理 (1)生体認証 (1)BackdropFilter (1)レビュー (1)getAuth (1)Algolia (1)コンサルティング (1)Symbol (1)

お知らせ

カリキュラムなし!学びたいことだけをプロと学べる『TechCampus』の詳細情報

カリキュラムなし!学びたいことだけをプロと学べる『TechCampus』の詳細情報

カリキュラムなし!学びたいことだけをプロと学べる『TechCampus』の詳細情報!興味のある人はぜひコミュニティに参加ください!

Read More
可茂IT塾ではFlutterインターンを募集しています!

可茂IT塾ではFlutterインターンを募集しています!

可茂IT塾ではFlutterインターンを募集しています!可茂IT塾のエンジニアの判断で、一定以上のスキルをを習得した方には有給でのインターンも受け入れています。

Read More