LoginSignup
1
1

More than 1 year has passed since last update.

Hexabase TypeScript SDKを使ってデータストアのデータを更新する

Last updated at Posted at 2023-04-25

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月現在絶賛開発を進めていますので、ぜひ試していただいてフィードバックいただければ嬉しいです!

hexabase/hexabase-js

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1