⚠️ Experimental: This wizard is still in an experimental phase. If you have any feedback, please drop an email to joshua [at] posthog [dot] com.
To use the wizard, you can run it directly using:
npx @posthog/wizard
Currently the wizard can be used for React, NextJS, Svelte and React Native projects. If you have other integrations you would like the wizard to support, please open a GitHub issue!
The following CLI arguments are available:
Option | Description | Type | Default | Choices | Environment Variable |
---|---|---|---|---|---|
--help |
Show help | boolean | |||
--version |
Show version number | boolean | |||
--debug |
Enable verbose logging | boolean | false |
POSTHOG_WIZARD_DEBUG |
|
--integration |
Choose the integration to setup | choices | Select integration during setup | "nextjs", "react", "svelte", "react-native" | POSTHOG_WIZARD_INTEGRATION |
--force-install |
Force install the SDK NPM package (use with caution!) | boolean | false |
||
--install-dir |
Relative path to install in | string | . |
POSTHOG_WIZARD_INSTALL_DIR |
|
--region |
PostHog region to use | choices | "us", "eu" | POSTHOG_WIZARD_REGION |
|
--default |
Select the default option for all questions automatically (where possible) | boolean | false |
POSTHOG_WIZARD_DEFAULT |
|
--signup |
Create a new PostHog account during setup | boolean | false |
POSTHOG_WIZARD_SIGNUP |
Note: A large amount of the scaffolding for this came from the amazing Sentry wizard, which you can find here 💖
While the wizard works great on its own, we also find the approach used by this project is a powerful way to improve AI agent coding sessions. Agents can run CLI tools, which means that conventional code like this can participate in the AI revolution as well – with all the benefits and control that conventional code implies.
If you want to use this code as a starting place for your own project, here's a quick explainer on its structure.
The entrypoint for this tool is run.ts
. Use this file to interpret arguments and set up the general flow of the application.
Did you know you can capture PostHog events even for smaller, supporting products like a command line tool? src/utils/analytics.ts
is a great example of how to do it.
This file wraps posthog-node
with some convenience functions to set up an analytics session and log events. We can see the usage and outcomes of this wizard alongside all of our other PostHog product data, and this is very powerful. For example: we could show in-product surveys to people who have used the wizard to improve the experience.
Supporting agent sessions after we leave is important. There are plenty of ways to break or misconfigure PostHog, so guarding against this is key.
src/utils/rules/add-editor-rules.ts
demonstrates how to dynamically construct rules files and store them in the project's .cursor/rules
directory.
LLM agent sessions are anti-deterministic: really, anything can happen.
But using LLMs for code generation is really advantageous: they can interpret existing code at scale and then modify it reliably.
If they are well prompted.
src/lib/prompts.ts
demonstrates how to wrap a deterministic fence around a chaotic process. Every wizard session gets the same prompt, tailored to the specific files in the project.
These prompts are channeled using src/utils/query.ts
to an LLM interface we host. This gives us more control: we can be certain of the model version and provider which interpret the prompts and modify the files. This way, we can find the right tools for the job and again, apply them consistently.
This also allows us to pick up the bill on behalf of our customers.
When we make improvements to this process, these are available instantly to all users of the wizard, no training delays or other ambiguity.
Run:
pnpm try --install-dir=[a path]
To build and use the tool locally:
pnpm build
This compiles the TypeScript code and prepares the dist
directory. Run this command any time you make changes to the wizard's source code.
pnpm link --global
This command makes your local version of the wizard available system-wide. You generally only need to do this once.
Then:
wizard [options]
The wizard will execute your last build.
To make your version of a tool usable with a one-line npx
command:
- Edit
package.json
, especially details likename
,version
- Run
npm publish
from your project directory - Now you can run it with
npx yourpackagename