quickstart

完全な Even Hub G2 スマートグラスプロジェクトをスキャフォールディングします。以下の手順を順番にすべて実行してください。手順を省略しないでください。$ARGUMENTS から導出したプロジェクト名を使用します（指定がない場合は my-evenhub-app を使用します）。

この処理で行うこと

以下を含む、完全に動作する Even Hub プロジェクトディレクトリを作成します。

• Vite + TypeScript アプリ（またはユーザーが希望するフレームワーク）
• インストール済みで、すぐに使用できる Even Hub SDK
• 開発用依存関係としての Even Hub CLI と Simulator
• 生成された app.json マニフェスト
• G2 ディスプレイにテキストを表示する、動作する src/main.ts スターターファイル

---

手順

1. プロジェクト名を決定する

$ARGUMENTS からプロジェクト名を抽出します。スペースと特殊文字を取り除き、有効なディレクトリ名にします（例："My Cool App" → my-cool-app）。引数が指定されていない場合は、my-evenhub-app を使用します。

また、ディレクトリ名からハイフンを取り除いて package_id のスラッグを導出します（例：my-cool-app → mycoolapp）。app.json の package_id は、ハイフンを含まない小文字にする必要があります（例：com.example.mycoolapp）。

2. Vite でプロジェクトを作成する

次のコマンドを実行します（<name> をプロジェクト名に置き換えてください）。

npm create vite@latest <name> -- --template vanilla-ts

ユーザーが別のフレームワーク（react、vue、svelte など）を指定した場合は、vanilla-ts を適切な Vite テンプレートに置き換えて、それに従います。判断に迷った場合は vanilla-ts を使用します。

3. 基本的な依存関係をインストールする

cd <name> && npm install

4. Even Hub SDK をインストールする

npm install @evenrealities/even_hub_sdk

5. 開発ツール（CLI + Simulator）をインストールする

npm install -D @evenrealities/evenhub-cli @evenrealities/evenhub-simulator

6. アプリマニフェストを生成する

npx evenhub init

これにより、プロジェクトのルートに app.json が書き込まれます。コマンドが対話形式の場合は、以下のテンプレートの値を使用して各フィールドを入力します。生成後、app.json を開き、テンプレートに一致するよう修正します。

• min_sdk_version を "0.0.12" に設定します（init コマンドでは、これより古いバージョンがデフォルトになる場合があります）。
• アプリに特定の権限が実際に必要でない限り、permissions を [] に設定します。init コマンドで生成されたプレースホルダーの権限はすべて削除します。
• それ以外のすべてのフィールドが、以下の app.json テンプレート セクションと一致していることを確認します。残っているプレースホルダー値は、プロジェクトに合うよう編集します。

7. src/main.ts をスターターコードに置き換え、ボイラープレートを整理する

src/main.ts を、以下の内容で正確に上書きします。その後、Vite テンプレートから残った未使用のボイラープレートファイル（例：src/counter.ts、src/style.css、src/assets/）を削除します。

import { waitForEvenAppBridge, TextContainerProperty, CreateStartUpPageContainer } from '@evenrealities/even_hub_sdk'

const bridge = await waitForEvenAppBridge()

const mainText = new TextContainerProperty({
  xPosition: 0,
  yPosition: 0,
  width: 576,
  height: 288,
  borderWidth: 0,
  borderColor: 5,
  paddingLength: 4,
  containerID: 1,
  containerName: 'main',
  content: 'Hello from G2!',
  isEventCapture: 1,
})

const result = await bridge.createStartUpPageContainer(new CreateStartUpPageContainer({
  containerTotalNum: 1,
  textObject: [mainText],
}))
console.log('Page created:', result === 0 ? 'success' : 'failed')

8. プロジェクト構成を確認する

作成されたファイルの概要を出力します。最終的なプロジェクト構成は次のようになります。

<name>/
  app.json
  index.html
  package.json
  src/
    main.ts
  ...

---

app.json テンプレート

npx evenhub init でファイルが自動生成されない場合は、プロジェクトのルートに以下の内容で app.json を作成します（値はプロジェクトに合わせて更新してください）。

{
  "package_id": "com.example.<name>",
  "edition": "202601",
  "name": "<Human-readable app name>",
  "version": "0.1.0",
  "min_app_version": "2.0.0",
  "min_sdk_version": "0.0.12",
  "entrypoint": "index.html",
  "permissions": [],
  "supported_languages": ["en"]
}

フィールドの説明：

• package_id — アプリの逆ドメイン形式の一意な識別子です（例：com.acme.myapp）。ハイフンは使用できません — 各セグメントには小文字と数字のみを使用してください。
• edition — アプリの対象となる Even Hub プラットフォームのエディションです。現在の G2 ファームウェアには "202601" を使用します。
• name — Even Hub アプリストア／ランチャーに表示される、人が読みやすい表示名です。
• version — アプリのセマンティックバージョンです（MAJOR.MINOR.PATCH）。
• min_app_version — このアプリの実行に必要な Even Hub コンパニオンアプリの最小バージョンです。
• min_sdk_version — 必要な Even Hub SDK の最小バージョンです。ビルドに使用する SDK のバージョンに合わせます（現在は "0.0.12"）。
• entrypoint — Vite がアプリのルートとして配信する HTML ファイルです。"index.html" のままにします。
• permissions — 権限オブジェクト（{ "name": "...", "desc": "..." }）の配列です。特別な権限が不要なアプリでは [] を使用します。有効な名前：network、location、g2-microphone、phone-microphone、album、camera。
• supported_languages — アプリがサポートする ISO 639-1 言語コードです。

次のステップ

スキャフォールディング後にプロジェクトを実行する方法をユーザーに案内します。

1. 開発サーバーを起動する

   npm run dev
   

   Vite により、アプリが http://localhost:5173 で配信されます（5173 番ポートが使用中の場合は、別のポートが使われます）。

2. シミュレーターでプレビューする

   npx evenhub-simulator http://localhost:5173
   

   シミュレーターでは、G2 のディスプレイ（576x288、4 ビットグレースケール）がデスクトップウィンドウに表示されるため、実機なしで反復作業を行えます。

3. 実際のグラスでテストする

   コンピューターとグラスが同じ Wi-Fi ネットワークに接続されていることを確認してから、次を実行します。

   npx evenhub qr --url http://<your-ip>:5173
   

   Even Hub コンパニオンアプリで QR コードをスキャンし、アプリを G2 にサイドロードします。

---

ハードウェアのクイックリファレンス

プロパティ	値
ディスプレイ解像度	576 x 288 px
色深度	4 ビットグレースケール（16 段階の緑）
カメラ	なし
スピーカー	なし
接続性	Bluetooth 5.2
入力	フレーム上のタッチパッド、オプションの R1 リングコントローラー

レイアウトを設計する際は、これらの制約に留意してください。全幅コンテナーには width: 576、全高コンテナーには height: 288 を使用し、すべての色は 0～15 のグレースケール値にする必要があります。

---

主なリソース

• SDK パッケージ：npm の @evenrealities/even_hub_sdk
• 公式ドキュメント：https://hub.evenrealities.com/docs/getting-started/overview
• コミュニティ Discord：https://discord.gg/Y4jHMCU4sv

---

タスク

次の内容で新しい Even Hub G2 プロジェクトをスキャフォールディングします：$ARGUMENTS