Skip to content

Using Spotlight with Remix

1. Installation

Follow the Remix Getting Started guide on Sentry, and continue from there.

Terminal window
npm add @spotlightjs/spotlight

2. Configuration

Initialize Spotlight within entry.client.js, after you’ve hydrated the document:

In the Browser you don’t need to set spotlight: true, Spotlight.init() will automatically detect if Sentry is available and if so, hook into the SDK.

// entry.client.(js/ts)
import * as Sentry from "@sentry/remix";
dsn: "__DSN__",
// ...other Sentry options
startTransition(() => {
hydrateRoot(document, <RemixBrowser />);
if (process.env.NODE_ENV === "development") {
import("@spotlightjs/spotlight").then((Spotlight) =>
Spotlight.init({ injectImmediately: true }),

3. Run the Sidecar

Spotlight’s architecture requires a sidecar to be running alongside your service. This is to enable streaming data collection from your backend services into the Spotlight overlay.