Convex ClickHouse Component Demo

Simulated Mutation

Track an Event

buffer ready

Component State

Pending

Flushed

Failed

Convex mutation

Component buffer

ClickHouse table

Bring Your Own Credentials

Environment

This live page is safe to share because it does not collect or store credentials. Your deployed Convex app provides its own ClickHouse HTTP endpoint, user, and password.

CLICKHOUSE_URL=https://example.clickhouse.cloud:8443
CLICKHOUSE_USER=default
CLICKHOUSE_PASSWORD=your_password

Install

Mount the Component

npm install @devwithbobby/clickhouse

import { defineApp } from "convex/server";
import clickhouse from "@devwithbobby/clickhouse/convex.config.js";

const app = defineApp();
app.use(clickhouse);

export default app;

Example App Code

Track and Flush Events

import { ClickHouse } from "@devwithbobby/clickhouse";
import { components } from "./_generated/api";

export const clickhouse = new ClickHouse(components.clickhouse, {
  credentials: () => ({
    url: process.env.CLICKHOUSE_URL!,
    user: process.env.CLICKHOUSE_USER!,
    password: process.env.CLICKHOUSE_PASSWORD!,
  }),
});

await clickhouse.insert(ctx, "events", [{
  workspace_id: "workspace_demo",
  event: "signup",
  created_at: Date.now(),
}]);

await clickhouse.flush(ctx);

Flush Log

Recent Activity

No events buffered yet.