👏

BFFの?をなるべく解消してみた🐶

2022/09/20に公開

この記事ではBFF(backend for frontend)について、?を解消するためにアバウトに書きたいと思います

1.BFFってなんぞや?

まずBFFってなんぞやってところですよね。
いきなり、BFFを使っていくと言われてもなにがなんだか。。ですよね😅
では書いていきましょう!!

BFFとはフロントエンドからくるデータに対してフロントとバックの間にサーバを用意して
そのサーバーでごにゅごにゅとデータの処理をして、バックエンドの適切なURLにその値を飛ばして
あげますよ〜ということをするのがBFFの役目という感じです。

2.なぜBFFを使うのか?

BFFを使わずにbackendのサーバに送ってそこでデータ処理したらええやないの!と思ったあなた👇

  • フロントエンドとバックエンドが持つ責務の分離できる
  • レスポンスをフロントエンドが扱いやすい形にすることで処理を簡略化できる

他にも理由はありますが、上記2つが大きい理由じゃないかなと思います。

3.どんなことをBFFがするのか

BFFを使ってデータをごにゅごにゅするのはわかったとして、
じゃあ、具体的になにをどう処理をするばいいのか?ってなってますよね、わかります。

例えば、フロントエンドからユーザーが入力したデータをJSONとして送られてくるとします。

{
 firstName:"hoge"
 userAge:24
}

このデータをバックエンドに送ろうとしましたが、データベースのテーブルのカラムは

{
 first_name:"hoge"
 user_age:24
}

この形でしたとなったわけですよ。
KEYをキャメルケースじゃなく、スネークケースにしないとダメですよね?

そこで

  • BFFでキャメルケース→ステークケースにする
  • バリデーションをしてからバックエンドに送る
backend:値をデータベースに入れる
frontend:入力されたデータを送る
BFF:データを適切な形に変更する

このようにそれぞれの責務を分離させることが可能になります。

これでBFFってこういうもんなんだとある程度認識できたはず...。

次に記事で実際にコードも踏まえてもっと具体的に書いていきたいと思います!
では!

Discussion