How to Publish Events In NextJs To Self Hosted Plausible Instance

Updated November 2023

I started to self-host a plausible instance and needed to publish events to it.

With the following setup I was able to do so in NextJS 14.

First run yarn add next-plausible

Then you need a component like this around your layout:

0"use client";
1import {ReactNode} from "react";
2import PlausibleProvider from "next-plausible";
3
4interface Props {
5    children: ReactNode;
6}
7
8export function Providers({children}: Props) {
9    return (
10        <PlausibleProvider domain={'<your-app-domain.com>'} customDomain={'https://<your-plausible-domain.com>'}>
11            {children}
12        </PlausibleProvider>
13    );
14}