Next.js

The Coralogix RUM SDK is a library (plugin) for Next.js that provides telemetry instrumentation. Learn how to integrate with Coralogix's Real User Monitoring (RUM).

Prerequisites

Create a RUM API key with the Send Your Data permission preset. The Browser SDK setup below needs it.

Installation

Create a file named coralogix.tsx in the app folder and include the following code:

For SDK version 2.1.0 and above:

'use client';
import { CoralogixRum } from '@coralogix/browser';

export default function CoralogixRumInit() {
  CoralogixRum.init({
    environment: 'test',
    application: 'my-app',
    version: '1.0.0',
    public_key: 'my-key-123',
    coralogixDomain: 'EU2',
  });

  return null;
}

For SDK version below 2.1.0:

'use client';
import { useEffect } from 'react';

export default function CoralogixRumInit() {
  useEffect(() => {
  initializeCoralogixRUM();
  }, []);

return null;
}

export const initializeCoralogixRUM = async () => {
  const { CoralogixRum } = await import('@coralogix/browser');
  
  CoralogixRum.init({
  environment: 'test',
  application: 'my-app',
  version: '1.0.0',
  public_key: 'my-key-123',
  coralogixDomain: 'EU2',
});
};

In your main tsx file, call CoralogixRumInit.

import CoralogixRumInit from "@/app/coralogix";

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {

  return (
      <html lang="en">
      <body>
      <CoralogixRumInit/>
      {children}
      </body>
      </html>
  );
}

Last updated on September 10, 2026

Prerequisites​

Installation​

Prerequisites

Installation