サーバーレスにおいてロジックとは何か
知り合いのエンジニアの方に教えていただいた、サーバーレスアーキテクチャの構成要素の1つである「ロジック」の内容を整理していきます。この記事で説明する「ロジック」は、一般的にサーバーレスの分野で語られるロジックとは異なる点もあるとのことなのでご了承ください。
ただ筆者の理解不足と知識不足でどう見ても間違ったことを言っている、という箇所もあると思われるので、気づいた方はご指摘いただけると幸いです・・・。
サーバーレスアーキテクチャとは
こちらの記事にも書きましたが、まずサーバーレスアーキテクチャとは、サーバーの存在を意識する必要のない構成のことを指すそうです。
具体的にどのような構成かというと・・・。
構成は大きく、フロントエンド、ロジック、バックエンドの3つの要素に分けられます。
フロントエンドはWebアプリケーションで直接ユーザーの目に触れる部分を指します。例えばメールを送信するアプリで考えると、テキストを入力するスペースや送信ボタン、文字の大きさを変えるボタンなど、ユーザーが直接見て操作できる部分は全てフロントエンドに該当します。
それに対してバックエンドとは、Webサーバーやデータベース、およびその辺りで行われる処理のことを指します。
ロジックとは
上記のフロントとバックエンドは一般的にもよく聞く概念だと思われます。
ではロジックとはどういったものなのでしょうか。
ロジックとは、フロントからバックエンドまでの処理(機能)を1つのライブラリにまとめたものになります。ここにはフロントからバックエンドまでのデータ通信もその役割に含まれます。
なので例えば、「テキストを暗号化してサーバに送る」というロジックがあったとすると、①テキストを暗号化する機能、②暗号化されたテキストをサーバに送信する機能、③実際にフロントの端末からサーバに向けてデータ通信をする機能の3つが1つのライブラリにまとめられているイメージになります。
本来であればバックエンドに通信するまでに行う処理はフロント側のコードで書くものなのですが・・・
このようにその処理をロジックという要素に分離することで、フロント側のエンジニアはサービスの見た目に注力したコードを書けるようになります。
厳密にいうと見た目以外にも、ロジックに向けての入力値とバックエンドからの戻り値は意識したコードにする必要がありますが、従来のアーキテクチャと比較すると役割分担をはっきりさせることができるというわけです。
またロジックはJSで書かれたコードです。ブラウザからWebサーバにHTTPリクエストを投げた際に、HTMLやフロント用のJSなどと一緒に取得されます。そしてフロントとロジックの接点となるボタンをユーザがブラウザで押すと、ロジックのコードが走り出して色々処理してくれるという流れです。
またこれは本筋ではないですが、1つ1つの機能を実現するためにそれぞれ別に作成したJSのコードを1つのライブラリにまとめる処理のことをwebpackと呼ぶとのことです。
通信しないロジック
ロジックはフロントからバックエンドまでの処理をまとめたものだと説明しましたが、中には例外的にバックエンドに通信をしに行かないロジックもあります。
例えば、ログインのためメールアドレスを入力する際に、アドレスが特定の形にはまっていない場合などはバックエンドにアクセスしに行く必要がないため、通信をせずにブラウザに「正しいアドレスを入力してください」などと表示をする流れになります。