Skip to main content
Home
This package has been archived, and as such it is read-only.

Built and signed on GitHub Actions

PostHog integration for Deno Fresh & Preact

This package works with Node.js, Deno, Bun, Browsers
This package works with Node.js
This package works with Deno
This package works with Bun
This package works with Browsers
JSR Score
100%
Published
4 months ago (0.1.3)

Posthog Fresh

PostHog Analytics and Hooks for Deno Fresh


NOTE: Although PostHog Fresh is designed to work with Deno Fresh, it can also be used in other Preact environments.

To use in Deno Fresh, add the PostHogAnalytics component to your _app.tsx file or a high-level component in your app. This initializes PostHog with the provided API key and host, and sets up the PostHog instance for use lower in your app with the usePostHog hook.

Examples

Setup PostHogAnalytics in _app.tsx

import { type PageProps } from "fresh";
import PostHogAnalytics from "jsr:@knotbin/posthog-fresh";

export default function App({ Component }: PageProps) {
  return (
   <html>
    <body>
        <PostHogAnalytics
          apiKey={YOUR API KEY}
          apiHost={YOUR API HOST}
        />
        <main>
          <Component />
        </main>
      </body>
    </html>
  );
}

Capturing an event with the usePostHog hook

import { usePostHog } from "jsr:@knotbin/posthog-fresh";

export default function TrackingExample() {
  const posthog = usePostHog();

  const handleClick = () => {
    if (posthog) {
      posthog.capture('button_clicked', {
        button_name: 'example_button',
        page: 'home'
      });
    }
  };

  return (
    <button onClick={handleClick}>
      Click me (tracked with PostHog)
    </button>
  );
}
Built and signed on
GitHub Actions

New Ticket: Report package

Please provide a reason for reporting this package. We will review your report and take appropriate action.

Please review the JSR usage policy before submitting a report.

Add Package

deno add jsr:@knotbin/posthog-fresh

Import symbol

import * as posthog_fresh from "@knotbin/posthog-fresh";
or

Import directly with a jsr specifier

import * as posthog_fresh from "jsr:@knotbin/posthog-fresh";

Add Package

pnpm i jsr:@knotbin/posthog-fresh
or (using pnpm 10.8 or older)
pnpm dlx jsr add @knotbin/posthog-fresh

Import symbol

import * as posthog_fresh from "@knotbin/posthog-fresh";

Add Package

yarn add jsr:@knotbin/posthog-fresh
or (using Yarn 4.8 or older)
yarn dlx jsr add @knotbin/posthog-fresh

Import symbol

import * as posthog_fresh from "@knotbin/posthog-fresh";

Add Package

vlt install jsr:@knotbin/posthog-fresh

Import symbol

import * as posthog_fresh from "@knotbin/posthog-fresh";

Add Package

npx jsr add @knotbin/posthog-fresh

Import symbol

import * as posthog_fresh from "@knotbin/posthog-fresh";

Add Package

bunx jsr add @knotbin/posthog-fresh

Import symbol

import * as posthog_fresh from "@knotbin/posthog-fresh";