convalytics

Convalytics

Convex アプリ向けに構築された、ウェブ分析とプロダクトイベントトラッキングです。

ダッシュボード： convalytics.dev

Convalytics とは？

Convalytics は、Convex アプリに次の 2 つの機能を提供します。

1. ウェブ分析 — 軽量なスクリプトタグを使って、ページビュー、セッション、直帰率、参照元、デバイス／ブラウザーの内訳を自動で取得します。
2. プロダクトイベントトラッキング — サインアップ、支払い、機能の利用状況、その他のカスタムイベントを、Convex のミューテーションやアクションから直接記録します。サーバー側のイベントは広告ブロッカーによってブロックされません。

すべてのデータは単一のダッシュボードに集約されます。最初のイベントが発生するとプロジェクトが自動で作成されるため、アカウントを作成せずにトラッキングを開始できます。

クイックスタート

npx convalytics init

プロジェクトを自動で作成し、Convex コンポーネントをインストールして、convex/convex.config.ts に変更を加え、書き込みキーを埋め込んだ convex/analytics.ts を作成し、ブラウザースクリプトタグを index.html に挿入します。また、AI エージェント用のスキルファイルもインストールします。Cursor、Claude Code、その他の AI コーディングエージェントですぐに利用できます。

パッケージ

パッケージ	説明
convalytics-dev	サーバー側のイベントトラッキング用 Convex コンポーネント
convalytics	ゼロ設定でプロジェクトをセットアップする CLI

プロジェクト構成

convalytics/
  convex/          # Convex backend — dashboard API, ingest, billing, auth
  src/             # React frontend — dashboard UI
  cli/             # CLI (published as convalytics on npm)

Convex コンポーネント（npm の convalytics-dev）は、専用のリポジトリにあります： Dan-Cleary/convalytics-convex-component

技術スタック

• バックエンド： Convex — データベース、サーバー関数、スケジュール済みジョブ、リアルタイムクエリ
• フロントエンド： React 19、React Router v7、TailwindCSS v4、Vite、Recharts
• ホスティング： Vercel（フロントエンド）、Convex Cloud（バックエンド）
• 課金： Stripe（使用量ベースのプラン）
• メール： Resend + React Email

開発

npm install
npm run dev

これにより、Vite フロントエンドと convex dev が並行して起動します。

リンク

• ダッシュボード
• コンポーネントのリポジトリ
• GitHub
• Twitter