Appearance
イベント
概要
イベントは hedgehog
でオンラインイベントを開催する際に最も基本となる要素です。
投げ銭、物販等、 hedgehog
上の他のほとんど全ての要素はイベントに紐づける事が可能で、イベントを中心として各種データを取得してくる運用を想定しています。
一方で、イベント自体はタイトルや説明など、イベントに関する基本情報しか持っていないという点に注意して下さい。実際にイベントを開催する際には、適宜チケットや物販等の要素を紐づける必要があります。
サンプル
ここでは、基本的なイベントを作成してフロントエンド側で情報を取得するまでの流れを解説します。
WARNING
以下サンプルは、環境変数に STAGE_UUID がセットされている前提になります。
1. イベントを作成する admin
ここではサンプルとして、 2 つイベントを作成します。
ts
const event1 = await Hedgehog.stage
.ref(process.env.STAGE_UUID as string)
.event.admin.create({
title: "〇〇イベント",
isPublic: true,
startDate: new Date(Date.now() + 10 * 24 * 60 * 60 * 1000).toISOString(),
image: new File([], ""), // 本来はイベントのタイトル画像を入力します
});
const event2 = await Hedgehog.stage
.ref(process.env.STAGE_UUID as string)
.event.admin.create({
title: "××イベント",
isPublic: true,
startDate: new Date(Date.now() + 20 * 24 * 60 * 60 * 1000).toISOString(),
image: new File([], ""), // 本来はイベントのタイトル画像を入力します
});
TIP
このステップは、Hedgehog Dashboard でも同様の操作が可能です。
2. フロントエンドを作成する
イベントに使用する web サイトを作成します。イベントの趣旨に沿った web サイトを、自由に作成してください。
3. イベント情報を取得する
ステージに紐づくイベントをすべて取得します。
ts
const events = await Hedgehog.stage
.ref(process.env.STAGE_UUID as string)
.event.list()
.all();
console.log(events.length); // 2
先程取得した 2 つのイベントが返ってきたら成功です。
ここでは一覧取得時に all()
を使用していますが、数が多くなるようであれば page()
を使用して取得数を制限し、フロントエンド上でもページネーションを実装する必要があるでしょう。