Hexabase(ヘキサベース)は企業においても安心して利用できるBaaS(Backend as a Service)を提供しています。多くのBaaSがそうであるように、主にフロントエンド開発者に利用してもらいたいと考えています。そこで現在、TypeScript SDKの開発が進められています。
この記事ではHexabase TypeScript SDKのインストールと、データストアからのデータ取得方法を紹介します。以前にデータを一覧取得する方法は解説しましたが、今回はデータの更新方法について解説します。
インストール
インストールは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
に対して処理を行います。
データストアへのアクセス時に必要な情報について
データストアへアクセスする際には以下の情報が必要です。
- データストアID
datastoreId
- (オプション) プロジェクトID
projectId
さらにデータ取得を行う際の情報(ページ数、取得件数など) params
が指定できます。以下がアクセス例です。
const project = client.currentWorkspace.project(projectId);
const datastore = project.datastore(datastoreId);
const items = await datastore.items();
const item = items[0];
データを取得する
データを取得する際には get
メソッドを使ってください。
item.get('Title');
データを更新する
データを更新する際には、まず set
メソッドを使います。
item.set('Title', '新しいタイトル');
その後、 save
メソッドを使って保存します。
await item.save();
この流れはデータを新規作成する際も同じです。
const item = datastore.item();
await item
.set('Title', 'はじめて保存するタイトル')
.save();
まとめ
データストアはクラウドデータベースとして、様々な型をサポートしたテーブルが利用できます。ぜひ皆さんのWebアプリケーションで利用してください。Hexabase TypeScript SDKを使えば、VueやReactなどと連携したWebアプリを素早く開発できるようになります。2023年04月現在絶賛開発を進めていますので、ぜひ試していただいてフィードバックいただければ嬉しいです!