✦ For Next.js · App Router · Pages Router · Server Actions ✦

01Observability for Next.js

Don't let Vercel hide
your Next.js logs.

Vercel gives you about one hour of logs. FlareLog captures API routes, Server Actions, Route Handlers, and client errors — then lets you search them by path, component, or error for days.

$npm install @flarelog/sdk
Vercel Dashboard
FlareLog
Next.js error — 62 min ago

Application error: a server-side exception has occurred

Digest: 2948302219...

Logs Expired

Upgrade Vercel to see older logs

Live streamSearchable history
nowERRORServer action failed: payment_intent_unexpected_state
12sWARNSlow server component: 420ms render
45sINFOGET /api/products 200 — 56ms
1mERRORgenerateStaticParams rejected
3mWARNBot traffic spike: 12k requests / 5 min
5mINFOPOST /api/session 200 — 89ms

90d

Pro retention

3

lines to install

10k

free logs/mo

$19

flat Pro bucket

Your Next.js app is production-grade. But your logs aren't. By morning the trace is gone.

App Router server errors show a digest, Server Actions fail silently, and route handler logs vanish in an hour. FlareLog gives your Next.js stack the observability it deserves.

02Zero-config setup

One SDK for App Router,
Pages Router, and client errors.

Wrap your API route or add the React error boundary. That's it. No OpenTelemetry files, no heavy dependencies, no runtime friction.

1

Install the SDK

Run npm install @flarelog/sdk. One package covers your Next.js backend, API routes, and React client-side errors.

2

Set your API key

Add FLARELOG_API_KEY to your Vercel environment variables or .env.local. The SDK detects Vercel automatically.

3

Wrap your backend

Use withFlareLog around your API route handler. Then use req.logger anywhere to add context.

4

Wrap your client (optional)

Add FlareLogErrorBoundary around your App component to capture React render errors in the browser.

pages/api/checkout.ts
import { flarelog } from "@flarelog/sdk";
import { withFlareLog } from "@flarelog/sdk/next";

const logger = flarelog({ apiKey: process.env.FLARELOG_API_KEY });

export default withFlareLog(logger, async (req, res) => {
  req.logger.info("Checkout started", {
    path: req.url,
    method: req.method,
  });

  try {
    const order = await createOrder(req.body);
    req.logger.info("Order created", { orderId: order.id });
    res.status(200).json({ order });
  } catch (err) {
    req.logger.error("Checkout failed", { error: err });
    res.status(500).json({ error: "Checkout failed" });
  }
});
.env.local / Vercel dashboard
# Add to your Vercel project
vercel env add FLARELOG_API_KEY

# or paste in the dashboard
FLARELOG_API_KEY=fl_your_api_key
03Core pillars

Built for modern
Next.js production

Retention

Days of searchable logs

Stop losing incident context after one hour. FlareLog keeps 7 days on the free tier and 90 days on Pro, so last week's failing Server Action is still searchable.

Search

Query by route, error, or component

Search structured JSON logs by nextUrl.pathname, component, or any custom metadata. Ditch Vercel's text-only grep.

Async

No dropped background logs

Background work inside Server Actions, Route Handlers, or waitUntil is reliably flushed before the invocation ends — instead of vanishing when the function freezes.

04Predictable pricing

A traffic spike on Product Hunt
shouldn't 10× your logs bill.

Vercel's event-based observability metering scales with every request. FlareLog gives you a flat Pro bucket up to 2M logs for $19/mo — so bot traffic doesn't become a surprise invoice.

Capability
FlareLog
Vercel Logs
Log retention
7 days free, 90 days on Pro
~1 hour on Hobby; paid plans still limited
Search by App Router / dynamic route
Structured JSON query by path, error, component
Basic text search
Server Action errors
Full error + stack trace retained for days
Generic digest, logs can expire before debug
Async logs (waitUntil, background jobs)
Reliably flushed before invocation ends
Dropped when function freezes
Pricing during traffic spikes
$19/mo Pro flat bucket up to 2M logs
Event-based metering → bill shock
AI-native debugging
MCP server for Cursor / Claude / Lovable
Browser-only workflow

Why it matters

Bot traffic

Scrapers hitting dynamic routes can generate millions of log events. FlareLog's Pro bucket absorbs the noise without multiplying your bill.

Why it matters

Launch day

Product Hunt traffic is a good problem — unless your logging cost scales linearly. Flat-rate monitoring keeps launches stress-free.

Why it matters

Server Actions gone wrong

Debugging a failing Server Action from a digest string is painful. Searchable retained logs let you trace the exact call and payload.

05AI-Native debugging

Ask your AI why a route
is 500ing in prod.

FlareLog's MCP server connects Cursor, Claude Desktop, or Lovable Agent to your real Next.js logs. Skip the dashboard and let your AI read structured production errors in context.

  • "Show every error in /app/checkout today"
  • "Why did this Server Action fail for user 4829?"
  • "List 500s grouped by route for the last hour"
  • Paste one JSON config, works in every editor
Connect MCP server
cursor settings.json
{
  "mcpServers": {
    "flarelog": {
      "url": "https://mcp.flarelog.dev",
      "headers": {
        "Authorization": "Bearer fl_your_api_key"
      }
    }
  }
}

↑ Paste into Cursor, Claude Desktop, or Lovable Connectors.

06FAQ

Questions Next.js devs
actually ask

Does it work with the App Router?

Yes. Wrap your Route Handlers or API routes with withFlareLog and attach FlareLogErrorBoundary for client errors. Structured logs carry route and component context automatically.

Will it slow down my API routes or Server Actions?

No. Logs are batched and sent asynchronously out-of-band. Per-request overhead is sub-millisecond, so your TTFB and action latency stay untouched.

Can I see Server Action errors with full context?

Yes. Server Action failures are captured as structured errors with the action name, payload metadata you choose to log, and stack trace — and retained for 7–90 days depending on your tier.

What about React client errors?

Use FlareLogErrorBoundary and useFlareLog from @flarelog/sdk/react to send React render and caught errors to the same dashboard.

Do I need a Vercel Pro plan?

No. FlareLog is independent of your Vercel tier. You can stay on Vercel Hobby and still get days of log retention and structured search.

How does pricing work?

Free tier includes 10,000 logs/mo and 7-day retention. Pro is $19/mo for 2M logs/mo and 90-day retention. No surprises during traffic spikes.

07Start today

Build on Next.js.
Debug like it's 2026.

Free tier includes 10,000 logs/month, structured search, and client error capture. No credit card, no marketplace integration — just install the SDK.