Next.js ऐप्स के लिए स्टेटस पेज और अपटाइम मॉनिटरिंग
PulseAPI को अपने Next.js API रूट्स, edge फ़ंक्शन्स या डिप्लॉय किए साइट पर पॉइंट करें। कुछ टूटने पर अलर्ट पाएं, और ग्राहकों को live स्टेटस पेज दिखाएं।
Next.js के लिए स्टेटस पेज लॉन्च करने के तीन तरीके
नियंत्रण का स्तर चुनें — zero-code, low-code, या पूर्ण headless।
Hosted
अपना Next.js endpoint जोड़ें, CNAME को status.yourdomain.com पर point करें, हो गया। 5 मिनट में।
Headless
Public API का उपयोग करके अपनी Next.js ऐप के अंदर अपनी UI बनाएं। डिज़ाइन और ब्रांडिंग पर पूरा नियंत्रण।
API देखेंएम्बेडेड badges
अपने README या landing page में SVG uptime और status badges डालें। हर 5 मिनट में auto-update।
इस health endpoint को अपनी Next.js ऐप में जोड़ें
Copy, paste, PulseAPI को URL पर point करें। स्वस्थ पर 200, degraded पर 503 return करता है।
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 },
)
}PulseAPI को /api/health पर पॉइंट करें। `dynamic = "force-dynamic"` का उपयोग करें ताकि Next.js response कैश न करे। आंशिक विफलता पर 503 लौटाने से service "down" के बजाय "degraded" मार्क होती है।
Next.js ऐप्स में क्या टूटता है — और कैसे पकड़ें
Vercel पर साइलेंट डिप्लॉय
खराब डिप्लॉय compile तो हो जाता है पर runtime पर 500 देता है। Live URL मॉनिटर करने से यह सेकंडों में पकड़ा जाता है, ग्राहक की शिकायत से पहले।
Edge functions में regressions
Edge functions पर सख्त runtime limits हैं। धीमी dependency या timeout बदलाव build fail किए बिना इन्हें तोड़ देता है।
ISR पुराना content
On-demand revalidation विफल होने पर पुराने pages cache में रह जाते हैं। Body content assertion check करता है कि ताज़ा data serve हो रहा है।
हमारा स्टेटस पेज पसंद नहीं? Next.js में अपना बनाएं।
हमारी API वही data लौटाती है जो हमारी hosted UI उपयोग करती है। पूर्ण OpenAPI spec यहां 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>
)
}Next.js मॉनिटरिंग — FAQ
क्या यह Vercel, Netlify, और Cloudflare Pages के साथ काम करता है?
हां। PulseAPI बाहर से आपका public URL check करता है, इसलिए किसी भी hosting के साथ काम करता है। आप production URL, preview deployment, या specific API route मॉनिटर कर सकते हैं।
क्या मैं edge और serverless functions मॉनिटर कर सकता हूं?
हां। PulseAPI को edge function या API route का URL दें। अगर यह non-2xx status देता है, बहुत देर लेता है, या body assertion match नहीं करता, तो आपको alert मिलता है।
क्या मुझे SDK चाहिए?
नहीं। PulseAPI आपके चुने interval पर बस HTTP से आपके endpoint को call करता है। Next.js ऐप में कुछ install करने की ज़रूरत नहीं।
क्या hosted की जगह custom स्टेटस पेज बना सकता हूं?
हां — यही headless approach है। Public API वही data लौटाती है जो हमारी UI उपयोग करती है। Server component से fetch करें, जैसे चाहें render करें, design पर पूरा control।
अपनी Next.js ऐप की मॉनिटरिंग 5 मिनट में शुरू करें
मुफ्त tier, कोई credit card नहीं। अपना endpoint जोड़ें और टूटने पर alerts पाएं।