How to Monitor Your Nuxt 3 Application with Vigilmon

Nuxt 3 is a powerful full-stack framework for Vue.js with SSR, SSG, API routes (Nitro server), and edge deployment support. Once your Nuxt 3 app is in production, monitoring it properly means checking more than just whether the homepage loads. This guide covers uptime monitoring, health endpoints, API route monitoring, and alerting for Nuxt 3 with Vigilmon.

What to Monitor in a Nuxt 3 App

A typical Nuxt 3 production setup has several components:

1. The SSR frontend - your main Nuxt-rendered pages
2. Nitro server API routes - your /api/* endpoints
3. SSL certificate - your custom domain's certificate
4. Background tasks - if you're using scheduled tasks or cron jobs

Step 1: Add a Health Endpoint to Your Nuxt 3 App

Nuxt 3's Nitro server makes it easy to add a health endpoint. Create the file:

// server/routes/health.get.ts
export default defineEventHandler(async (event) => {
  return {
    status: 'ok',
    timestamp: new Date().toISOString(),
    service: 'nuxt-app'
  }
})

This creates a GET /health endpoint automatically. Verify it works locally:

curl http://localhost:3000/health
# { "status": "ok", "timestamp": "...", "service": "nuxt-app" }

Step 2: Add Database Health Check (Optional but Recommended)

If your Nuxt 3 app uses a database (via Prisma, Drizzle, etc.), extend the health endpoint:

// server/routes/health.get.ts
import { prisma } from '~/server/lib/prisma'

export default defineEventHandler(async (event) => {
  try {
    // Lightweight DB check
    await prisma.$queryRaw`SELECT 1`

    return {
      status: 'ok',
      db: 'connected',
      timestamp: new Date().toISOString()
    }
  } catch (error) {
    setResponseStatus(event, 503)
    return {
      status: 'error',
      db: 'disconnected',
      error: (error as Error).message
    }
  }
})

Step 3: Set Up Vigilmon Monitors

Go to vigilmon.online and add monitors:

Monitor 1: Health endpoint

• URL: https://your-nuxt-app.com/health
• Expected status: 200
• Keyword check: "status":"ok"
• Interval: 30 seconds or 1 minute

Monitor 2: Main frontend route

• URL: https://your-nuxt-app.com
• Expected status: 200
• Interval: 1 minute

Monitor 3: Critical API route

• URL: https://your-nuxt-app.com/api/your-key-endpoint
• Expected status: 200
• Add a keyword check for expected response content

Monitoring Different Nuxt 3 Deployment Modes

Nuxt 3 SSR on Vercel

Vercel deploys Nuxt 3's Nitro output as serverless functions. Your Nuxt app's URL is https://your-project.vercel.app or your custom domain.

Monitor your production URL directly. Cold starts on Vercel can add latency - if you see false positives, increase your alert sensitivity threshold or use 1-minute intervals.

Nuxt 3 on Cloudflare Pages / Workers

When using the Cloudflare preset, your Nuxt app runs at the edge. Add a Vigilmon monitor for your Cloudflare Pages URL or custom domain. Vigilmon's multi-region checks verify your app is reachable from different geographic regions.

Nuxt 3 on Node.js Server (PM2)

If you're running Nuxt 3's SSR output with a Node.js server and PM2:

# Your production build outputs to .output/server/index.mjs
pm2 start .output/server/index.mjs --name nuxt-app

Monitor the public URL. If PM2 restarts after a crash, Vigilmon catches the downtime window.

Nuxt 3 Static (SSG / nuxi generate)

For statically generated Nuxt sites deployed to Netlify, Vercel, or similar:

• Monitor your main URL
• Add SSL certificate monitoring
• If you have API routes that call external services, monitor those separately

Monitoring Nuxt 3 API Routes

Nuxt 3 API routes (in server/api/) can be monitored directly if they accept GET requests without authentication:

// server/api/status.get.ts
export default defineEventHandler(async () => {
  return { message: 'API is running', timestamp: Date.now() }
})

Monitor https://your-app.com/api/status with Vigilmon. For authenticated endpoints, use the health endpoint approach instead.

SSL Certificate Monitoring

When you add HTTPS monitors in Vigilmon, SSL certificate expiry is checked automatically. You'll receive alerts:

• 30 days before expiry
• 14 days before expiry
• 7 days before expiry

This prevents the embarrassing "your SSL certificate expired" outage.

Setting Up Alerting

Email alerts: Go to Vigilmon settings ? Notifications ? Add email address. You'll receive an immediate email when any monitor goes down.

Webhook to Slack:

1. Create a Slack incoming webhook
2. In Vigilmon, add a webhook notification with the Slack URL
3. Payload:

{
  "text": "?? {{monitor_name}} is DOWN - check https://your-app.com immediately"
}

Heartbeat Monitoring for Nuxt 3 Scheduled Tasks

If you use Nuxt 3's Nitro scheduled tasks (introduced in Nitro 2.x):

// server/plugins/scheduler.ts
export default defineNitroPlugin(() => {
  // Use node-cron or a custom interval
  setInterval(async () => {
    await runDailyTask()

    // Ping Vigilmon heartbeat on success
    await $fetch('https://heartbeat.vigilmon.online/ping/your-token')
  }, 24 * 60 * 60 * 1000) // Every 24 hours
})

Create a Heartbeat monitor in Vigilmon with a 25-hour interval. If your task stops running, the heartbeat is missed and you're alerted.

Status Page for Your Users

If your Nuxt 3 app is a user-facing product, create a public status page:

1. In Vigilmon: Status Pages ? New
2. Add your monitors (health endpoint, main route)
3. Configure your subdomain: status.your-app.com
4. Share the URL in your app's footer or documentation

When an incident happens, users can self-check status instead of emailing you.

Monitoring Checklist

• [ ] /health endpoint created and monitored
• [ ] Main SSR route monitored (/)
• [ ] Critical API route monitored
• [ ] SSL certificate monitored (automatic with HTTPS monitors)
• [ ] Email alerts configured
• [ ] Webhook alerts to Slack/Discord
• [ ] Heartbeat monitors for scheduled tasks (if applicable)
• [ ] Status page created

Summary

Component	Monitor URL	Check Type
Health endpoint	/health	HTTP 200 + keyword
Frontend	/	HTTP 200
API route	/api/status	HTTP 200
SSL cert	Auto on HTTPS	Expiry alert
Scheduled tasks	Heartbeat	Heartbeat interval

Nuxt 3 with Nitro's server capabilities is production-ready. Your monitoring should be too. A health endpoint, two Vigilmon monitors, and email alerts cover 90% of what you need to sleep soundly.

?? Monitor your Nuxt 3 app with Vigilmon - free tier available