Logging in Next.js is hard (But it doesn't have to be)

A typical Next.js deployment can execute code in up to three different runtimes: Edge, Node.js, and the browser.

You may already be capturing logs from server-side code, but if you are not capturing the full request from middleware through server rendering to the browser, you are missing critical debugging information when problems arise.

TL;DR: A typical Next.js deployment can run in up to three environments: Node, Edge, and the browser. Most JavaScript logging libraries target Node; far fewer are compatible with Edge and the browser. LogTape and Sentry both provide runtime-agnostic logging in JavaScript.

Problem 1: Most Loggers Assume Node.js

Most loggers were built specifically for Node.js, relying on APIs like AsyncLocalStorage or fs that aren’t available in the browser or Edge runtimes.