Page de statut et monitoring d'uptime pour applications Next.js
Pointez PulseAPI vers vos routes API Next.js, edge functions ou site déployé. Recevez des alertes quand quelque chose casse et offrez à vos clients une page de statut en temps réel.
Trois façons de livrer une page de statut pour Next.js
Choisissez le niveau de contrôle — sans code, low-code, ou full headless.
Hébergé
Ajoutez votre endpoint Next.js, pointez un CNAME sur status.votredomaine.com, fini. Marche en 5 minutes.
Headless
Utilisez notre API publique pour construire votre propre UI dans votre app Next.js. Contrôle total du design et du branding.
Voir l'APIBadges embarqués
Intégrez des badges SVG uptime et statut dans votre README ou landing. Mise à jour toutes les 5 minutes.
Collez ce health endpoint dans votre app Next.js
Copiez, collez, pointez PulseAPI sur l'URL. Renvoie 200 sain, 503 dégradé.
import { NextResponse } from 'next/server'
import { db } from '@/lib/db'
export const dynamic = 'force-dynamic'
export const runtime = 'nodejs'
export async function GET() {
const checks = await Promise.all([
db.raw('select 1').then(() => 'ok').catch(() => 'fail'),
fetch(process.env.REDIS_URL!, { signal: AbortSignal.timeout(500) })
.then((r) => (r.ok ? 'ok' : 'fail'))
.catch(() => 'fail'),
])
const [database, cache] = checks
const healthy = checks.every((c) => c === 'ok')
return NextResponse.json(
{ status: healthy ? 'healthy' : 'degraded', database, cache },
{ status: healthy ? 200 : 503 },
)
}Pointez PulseAPI vers /api/health. Utilisez `dynamic = "force-dynamic"` pour que Next.js ne cache pas la réponse. Renvoyer 503 en cas de panne partielle marque le service comme dégradé plutôt que tombé.
Ce qui casse dans les apps Next.js — et comment le détecter
Déploiements silencieux sur Vercel
Un mauvais déploiement peut livrer un build qui compile mais renvoie 500 en runtime. Monitorer l'URL publique détecte cela en secondes, pas quand un client se plaint.
Régressions sur edge functions
Les edge functions ont des limites de runtime strictes. Une dépendance lente ou un changement de timeout les casse sans échec de build.
Contenu ISR obsolète
Les échecs de revalidation on-demand laissent des pages périmées en cache. Une assertion sur le body vérifie que la page sert bien des données fraîches.
Notre page de statut ne vous plaît pas ? Construisez la vôtre dans Next.js.
Notre API renvoie les mêmes données que notre UI hébergée consomme. Spec OpenAPI complète sur api.pulseapi.tech/docs.
export const revalidate = 30
export default async function StatusPage() {
const res = await fetch('https://api.pulseapi.tech/status/acme', {
next: { revalidate: 30 },
})
const data = await res.json()
return (
<main>
<h1>{data.page.title}</h1>
<p>Status: {data.overallStatus}</p>
<ul>
{data.endpoints.map((ep) => (
<li key={ep.id}>{ep.name} — {ep.status} ({ep.uptime24h}%)</li>
))}
</ul>
</main>
)
}Monitoring Next.js — FAQ
Est-ce que ça marche avec Vercel, Netlify et Cloudflare Pages ?
Oui. PulseAPI vérifie votre URL publique de l'extérieur, donc ça marche avec n'importe quel hébergement. Vous pouvez monitorer l'URL de production, un preview deployment ou une route API spécifique.
Puis-je monitorer des edge et serverless functions ?
Oui. Donnez à PulseAPI l'URL de la edge function ou route API. Si elle renvoie un statut non-2xx, prend trop de temps, ou le body ne correspond pas à une assertion, vous recevez une alerte.
Ai-je besoin d'un SDK ?
Non. PulseAPI appelle simplement votre endpoint en HTTP à l'intervalle choisi. Il n'y a rien à installer dans votre app Next.js.
Puis-je construire une page de statut personnalisée au lieu de la version hébergée ?
Oui — c'est l'approche headless. L'API publique renvoie les mêmes données que notre UI. Récupérez-la depuis un Server Component, affichez ce que vous voulez, contrôle total sur le design.
Commencez à monitorer votre app Next.js en 5 minutes
Version gratuite. Sans carte. Ajoutez votre endpoint et recevez des alertes en cas de panne.