Hexabase によるシステムの構成
ここでは、Hexabase アプリケーションのシステム構成について説明します。
アプリケーションのシステム構成#
Hexabase は、Web システムのバックエンドを提供します。フロントエンドは、Hexabase の機能を API 呼び出しする形でスクラッチ開発できます。バックエンド拡張が必要な場合は、FaaS など を利用します。
| レイヤー | フロントエンド | バックエンド(Hexabase) | バックエンド拡張 |
|---|---|---|---|
| 役割 | 操作画面 | データベース定義 業務フロー定義 アクセス制御 | データ処理ロジック 外部連携 |
| 実装言語 実現手段 | JavaScript TypeScript | ブラウザでの設定作業 Hexabase CLI Hexabase SDK | C# Python Nodejs Java など |
| 実装フレームワーク | SPA React Vue Angular | --- | FaaS AzureFunctions AWS Lamda GCP Cloud Functions API 連携 |
フロントエンド開発の利用技術#
Hexabase のフロントエンドは、 SPA フレームワークにより、スクラッチ開発できます。
フロントエンド技術は進化の早い領域ですが、2020 年には React・Vue.js・Angular が人気を集めています。
https://2020.stateofjs.com/en-US/technologies/front-end-frameworks/
| React | Vue | Angular | |
|---|---|---|---|
| 採用技術 | Virtual DOM | Virtual DOM | Virtual DOM |
| JSX | 静的 HTML templates | 静的 HTML templates | |
| GitHub stars | 159k | 175k | 67k |
| npm weekly downloads | 8,882,562 | 1,963,489 | 2,072,443 |
| 学習コスト | やや高い | 標準 | 高い |
| フレームワークサイズ | 中 | 中 | 大 |
| 大規模開発 | 〇正しいコンポーネント分割が必須 | 〇可能だが、比較的シンプルなサイト開発に向いている | △ 大規模化すると複雑性が増す |
バックエンド拡張の利用技術#
Hexabase のバックエンド拡張は、以下のようなケースで利用します。
- メール送信などの通知（Hexabase からの出力）
- 特別な計算処理（Hexabase 内データの更新）
- 外部システムとのデータ連携（外部から Hexabase への入力を含む）
実装方法には、主に次の 4 種類があります。
API 連携#
Hexabase 内にある API 連携機能(WebHook)で、外部 Web サービスの API を呼び出します。
- プラットフォーム：Hexabase ＋各 Web サービス
- 開発言語：なし
- 追加費用：各 Web サービスの利用料
- 用途：メール連携、決済/請求、カレンダー など
ActionScript(Hexabase)#
Hexabase 内にある拡張プログラム呼び出し機能
- プラットフォーム：Nodejs
- 開発言語：JavaScript
- 追加費用：なし
- 用途：ごく小規模なプログラム実行に最適化
FaaS#
Function as a Service としてサービス提供されている仕組みを利用する
- プラットフォーム：Azure Functions、AWS Lamda, GCP Cloud Functions
- 開発言語：C#,Python,Java,Node(JavaScript)など
- 追加費用：実行時間による課金
- 用途：ある程度の本格的なサービス開発も可能
独自実装#
独自のマイクロサービスを開発
- プラットフォーム：自由に選定可能
- 開発言語：自由に選定可能
- 追加費用：サーバ利用料、システム運用コスト
- 用途：独自のサービス