PostHog ローカル開発ループ

概要

PostHog のための高速で再現可能なローカル開発ワークフローをセットアップします。

前提条件

• posthog-install-auth のセットアップ完了
• Node.js 18 以上（npm/pnpm付き）
• TypeScript サポート対応のコードエディタ
• バージョン管理用の Git

手順

ステップ 1: プロジェクト構造の作成

my-posthog-project/
├── src/
│   ├── posthog/
│   │   ├── client.ts       # PostHog クライアントラッパー
│   │   ├── config.ts       # 設定管理
│   │   └── utils.ts        # ヘルパー関数
│   └── index.ts
├── tests/
│   └── posthog.test.ts
├── .env.local              # ローカルシークレット (Git 無視)
├── .env.example            # チーム用テンプレート
└── package.json

ステップ 2: 環境設定

# 環境テンプレートをコピー
cp .env.example .env.local

# 依存関係をインストール
npm install

# 開発サーバーを起動
npm run dev

ステップ 3: ホットリロードのセットアップ

{
  "scripts": {
    "dev": "tsx watch src/index.ts",
    "test": "vitest",
    "test:watch": "vitest --watch"
  }
}

ステップ 4: テストの設定

import { describe, it, expect, vi } from 'vitest';
import { PostHogClient } from '../src/posthog/client';

describe('PostHog Client', () => {
  it('should initialize with API key', () => {
    const client = new PostHogClient({ apiKey: 'test-key' });
    expect(client).toBeDefined();
  });
});

成果物

• ホットリロード対応の動作する開発環境
• モッキング機能付きの設定済みテストスイート
• 環境変数管理
• PostHog 開発用の高速反復サイクル

エラーハンドリング

エラー	原因	解決方法
Module not found	依存関係が不足	npm install を実行
Port in use	別のプロセスが使用中	プロセスを終了するか、ポートを変更
Env not loaded	.env.local がない	.env.example からコピー
Test timeout	ネットワークが遅い	テストタイムアウトを増加

例

PostHog レスポンスのモック

vi.mock('@posthog/sdk', () => ({
  PostHogClient: vi.fn().mockImplementation(() => ({
    // ここにモックメソッドを追加
  })),
}));

デバッグモード

# 詳細ログを有効化
DEBUG=POSTHOG=* npm run dev

リソース

• PostHog SDK リファレンス
• Vitest ドキュメント
• tsx ドキュメント

次のステップ

本番環境対応のコードパターンについては、posthog-sdk-patterns を参照してください。