@cside.dev/next
Integrate cside into your NextJS project with ease.
Installation
# npm
npm i @cside.dev/next
# yarn
yarn add @cside.dev/next
# pnpm
pnpm i @cside.dev/next
Usage
NextJS
Pages Router
// pages/_document.tsx
import Document, { Html, Head, Main, NextScript } from "next/document";
import { CSideScript } from "@cside.dev/next";
export default function Document() {
return (
<Html lang="en">
<Head>
<CSideScript /> {/* <- Here */}
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
);
}
App Router
// layout.tsx
import { CSideScript } from "@cside.dev/next";
export default function Layout({ children }) {
return (
<>
<CSideScript /> {/* <- Here */}
{children}
</>
);
}
Props
| Prop | Type | Default | Description |
|---|---|---|---|
teamId | string | — | Your cside team ID. Loads the script from https://{teamId}.csidetm.com/script.js. |
deviceIntelligence | boolean | false | Load the device intelligence script instead of the default monitoring (tag manager) script. Swaps the host from csidetm.com/script.js to csidefd.com/client.js. The old fingerprint prop is still honored as an alias. |
scriptURLOverride | string | — | Use a fully-custom script URL instead of building one from teamId. Useful for self-hosted proxies and testing. |
Pass a teamId to load your team-scoped script:
<CSideScript teamId="your-team-id" />
To load the device intelligence script for that team:
<CSideScript teamId="your-team-id" deviceIntelligence />
If neither teamId nor scriptURLOverride is provided, the component falls back to the default proxy script at https://proxy.csidetm.com/script.js (or https://proxy.csidefd.com/client.js when deviceIntelligence is true).
Minimum release age
We recommend configuring a minimum release age so your package manager only installs versions that have been published for at least 7 days. Compromised package versions are typically detected and unpublished within days of publication, so a cooldown protects you from npm supply chain attacks. This applies to all your dependencies, not just this package.
# npm (.npmrc, in days)
min-release-age=7
# yarn (.yarnrc.yml, as a duration string)
npmMinimalAgeGate: "7d"
# pnpm (pnpm-workspace.yaml, in minutes)
minimumReleaseAge: 10080