Middleware

Middleware enables developers to easily monitor and analyze log and trace data generated on Vercel, gain insights into their applications, and proactively address potential issues. This Integration offers a robust APM solution through a unified dashboard, streamlining real-time and synthetic monitoring.

In addition, You can create custom dashboards to view trace data, set up alerts on different parameters, and monitor critical issues. The integration enables you to see detailed information about your logs and traces, such as service name, severity, latency, request counts, success ratio, method name, profiling, and attributes.

It will produce automatic logs; Proceed by adding a few lines to complete the data flow for traces and profiling.

Required: Integrate @middleware.io/agent-apm-nextjs package

@middleware.io/agent-apm-nextjs assists the platform in sending logs and traces from your Next.js project.

// Install package
npm install @middleware.io/agent-apm-nextjs

// Modify next.config.js
module.exports = {
  // your existing config
  experimental: { instrumentationHook: true }
}

// Create instrumentation.ts file
import tracker from '@middleware.io/agent-apm-nextjs';
export function register() {
    tracker.track({
        serviceName: "<SERVICE-NAME>",
        accessToken: "<ACCESS-TOKEN>",
        target: "vercel",
    });
}

// For logs
export default async function handler(req, res) {
    tracker.warn("Warning", { "tester": "Alex" });
    tracker.error("Error");
}

More details on the Installation > Instrumentation > APM > Vercel integration page.