Hexabase(ヘキサベース)は企業においても安心して利用できるBaaS(Backend as a Service)を提供しています。多くのBaaSがそうであるように、主にフロントエンド開発者に利用してもらいたいと考えています。そこで現在、TypeScript SDKの開発が進められています。
この記事ではHexabase TypeScript SDKのインストールと、データストアのフィールドをCRUD操作する方法を紹介します。
インストール
インストールはnpmやyarnを使って行います。
# npmの場合
npm install @hexabase/hexabase-js
# yarnの場合
yarn add @hexabase/hexabase-js
インポート
インポートすると、 HexabaseClient
というオブジェクトが取得できます。
import { HexabaseClient } from "@hexabase/hexabase-js";
初期化
HexabaseClientを初期化します。
const client = new HexabaseClient();
認証
Hexabaseでは業務利用を想定しているため、利用する際に認証情報が必須になります。最初はメールアドレスとパスワードで認証し、その後はトークンを使ってGraphQLにアクセスします。 client
を使って処理します。
初回の認証は次のようになります。emailとパスワード、またはトークンが必須です。
await client.login({email, password, token});
後はこの client
に対して処理を行います。
データストアについて
データストアは、データベース機能になります。Hexabaseでは最上位にワークスペースがあり、その下にプロジェクト、そしてプロジェクトの下にデータストアがあります。
// ワークスペースを設定
await client.setWorkspace('demo');
// プロジェクトを取得
const project = await client.currentWorkspace.project('demoProject');
// データストアを取得
const datastore = await project.datastore('demoTable');
フィールドを追加する
この datastore
に対して、フィールドを追加する操作です。
const field = await datastore.field();
field!
.set('dataType', 'text')
.set('name', 'test_field')
.set('displayId', 'test_field');
await field!.save();
データタイプは、フィールドの型になります。以下が指定できます。
data_type | 項目の種類 | 一意キー | タイトルに利用 | 検索条件に利用 | 検索インデックスの有無 | 全文検索の対象とする | 一覧に表示する | アクション実行時に表示しない | APIの結果に表示しない |
---|---|---|---|---|---|---|---|---|---|
text | テキスト | 〇 | 〇 | 〇 | 〇 | 〇 | |||
textarea | 複数行テキスト | 〇 | 〇 | 〇 | |||||
select | 選択肢 | 〇 | 〇 | 〇 | |||||
radio | ラジオ | 〇 | 〇 | 〇 | |||||
checkbox | チェックボックス | 〇 | 〇 | 〇 | |||||
autonum | 自動採番 | 〇 | 〇 | 〇 | |||||
number | 数値 | 〇 | 〇 | 〇 | |||||
calc | 計算式 | 〇 | 〇 | 〇 | |||||
datetime | 日付・時刻 | 〇 | 〇 | 〇 | |||||
file | 添付ファイル | 〇 | 〇 | 〇 | |||||
users | ユーザー | 〇 | 〇 | 〇 | |||||
dslookup | データベース参照 | 〇 | 〇 | 〇 | |||||
label | ラベル | ||||||||
separator | セパレーター |
この他、以下のようなオプションが指定できます。
field!
.set('search', true) // 検索可能
.set('showList', true) // 一覧表示
.set('fullText', true) // 全文検索
.set('unique', false) // 一意制約
.set('hideOnInput', false) // 入力時に非表示
.set('hideFromApi', false) // APIから非表示
.set('hasIndex', false); // インデックス
フィールドを追加したら、データストアのフィールド一覧も更新してください。
await datastore.fields(true); // trueを指定すると強制リフレッシュ
フィールドを更新する
フィールドを更新するには、 field
に対して save
メソッドを実行します。
field!
.set('dataType', 'number')
.set('name', 'test_field')
.set('displayId', 'test_field');
await field!.save();
フィールドを削除する
フィールドを削除するには、 delete
メソッドを実行します。
await field!.delete();
フィールドのオプションを設定する
フィールドタイプがラジオ、選択、チェックボックスの場合は、入力の選択肢を指定できます。
const option = field!.option();
option!
.set('value', {en: 'test', ja: 'test'})
.set('displayId', 'test')
.save();
フィールドのオプションを取得する
フィールドのオプションを取得するには、 options
メソッドを実行します。
const options = await field!.options();
オプションを追加した際などは、リフレッシュしてください。
await field!.options(true); // trueを指定すると強制リフレッシュ
オプションを更新する
オプションを更新するには、 save
メソッドを実行します。
option!
.set('value', {en: 'test2', ja: 'test2'})
.set('displayId', 'test2')
.save();
オプションを削除する
オプションを削除するには、 delete
メソッドを実行します。
await option!.delete();
まとめ
SDKを使うことで、データベース参照は簡単に操作できます。フィールドの追加や削除をAPI経由でできれば、動的にデータストアを変更できます。必要に応じて、テーブルを追加することもできるでしょう。
Hexabaseには他にもバイナリファイルのアップロードや認証などの機能があります。それらの機能も利用してください。