Hexabase TypeScript SDKを使ってSQL風にデータをCRUD操作する

[Hexabase（ヘキサベース）](https://www.hexabase.com/)は企業においても安心して利用できるBaaS（Backend as a Service）を提供しています。多くのBaaSがそうであるように、主にフロントエンド開発者に利用してもらいたいと考えています。そこで現在、TypeScript SDKの開発が進められています。

この記事ではHexabase TypeScript SDKのインストールと、SQL風にデータの取得、作成、更新、削除を行う方法を紹介します。

## インストール

インストールはnpmやyarnを使って行います。

```
# npmの場合
npm install @hexabase/hexabase-js

# yarnの場合
yarn add @hexabase/hexabase-js
```

## インポート

インポートすると、 `HexabaseClient` というオブジェクトが取得できます。

```jsx
import { HexabaseClient } from "@hexabase/hexabase-js";
```

## 初期化

HexabaseClientを初期化します。

```jsx
const client = new HexabaseClient();
```

### 認証

Hexabaseでは業務利用を想定しているため、利用する際に認証情報が必須になります。最初はメールアドレスとパスワードで認証し、その後はトークンを使ってGraphQLにアクセスします。 `client` を使って処理します。

初回の認証は次のようになります。emailとパスワード、またはトークンが必須です。

```jsx
await client.login({email, password, token});
```

後はこの `client` に対して処理を行います。

## 現在のワークスペースを取得する

ログインした時点でHexabaseClientのcurrentWorkspaceが現在のワークスペースオブジェクトになっています。

```jsx
client.currentWorkspace
```

ワークスペースを切り替える場合には、 `setWorkspace` メソッドを使います。

```jsx
client.setWorkspace(newWorkspaceId);
```

## クエリーオブジェクトを作成する

クエリーオブジェクトはプロジェクトを指定して作成します。

```jsx
const query = hexabase.query(projectID);
```

このクエリーオブジェクトに対してCRUD操作を指定します。

## 検索する（SELECT）

SQLでいうSELECTは以下のように記述します。

```jsx
const items = await query
      .from(datastoreID)
      .select('*');
```

取得するフィールドを制限する場合は以下のようにします。

```jsx
const res = await query
      .from(datastoreID)
      .select('textInputUnique, autoNum');
```

他にもlimit/offset/orderなどが利用できます。

```jsx
const res = await query
      .from(datastoreID)
      .limit(20)
      .offset(10)
      .order('autoNum', 'asc')
      .select('*');
```

件数だけ取得する際には `count` を使います。

```jsx
const numbers = await query
      .from(datastoreID)
      .count();
```

検索条件は `where` で指定します。whereは配列を与えるとand条件になります。

```jsx
const updatedItems = await query
      .from(datastoreID)
      .where(query.condition.equalTo('i_id', item.id))
      .select();
```

## 作成する（INSERT）

作成は `insert` を使います。各フィールドの値を指定します。

```jsx
const item = await query
      .from(datastoreID)
      .insert(
        {
          textInputUnique: 'name',
          number: 100,
          number2: 200,
        }
      ) as Item;
```

複数同時に作成もできます。

```jsx
const items = await query
      .from(datastoreID)
      .insert([
        {
          textInputUnique: 'name 1',
          number: 100,
          number2: 200,
        },
        {
          textInputUnique: 'name 2',
          number: 100,
          number2: 200,
        },
        {
          textInputUnique: 'name 3',
          number: 100,
          number2: 200,
        },
      ]) as Item[];
```

## 更新する（UPDATE）

データを更新する場合は `update` を使います。同時に指定する `where` 条件にマッチするデータを更新します。

```jsx
const updatedItems = await query
      .from(datastoreID)
      .where(query.condition.equalTo('i_id', item.id))
      .update({
        textInputUnique: newName,
        number: NUMBER1,
        number2: NUMBER2,
      });
```

## 削除する（DELETE）

削除は `delete` を使います。 `update` と同じく、 `where` 条件にマッチするデータを削除します。

```jsx
const res = await query
      .from(datastoreID)
      .where(query.condition.equalTo('number', NUMBER1))
      .delete();
```

## まとめ

Hexabase TypeScript SDKはO/Rマッパーとして利用することも、今回のようにSQL風に実行もできます。主にデータストアのCRUD操作用になります。

Hexabase TypeScript SDKを使えば、VueやReactなどと連携したWebアプリを素早く開発できるようになります。2023年05月現在絶賛開発を進めていますので、ぜひ試していただいてフィードバックいただければ嬉しいです！

[hexabase/hexabase-js](https://github.com/hexabase/hexabase-js)