प्रोडक्शन में निगरानी और त्रुटि ट्रैकिंग
संरचित लॉगिंग, Sentry के माध्यम से त्रुटि ट्रैकिंग, प्रदर्शन विश्लेषण और अपटाइम निगरानी के साथ अपने परिनियोजित Next.js ऐप को स्वस्थ रखें।
प्रोडक्शन में निगरानी और त्रुटि ट्रैकिंग, CoddyKit पर Next.js 15 फुलस्टैक (App Router + Server Actions) का एक निःशुल्क पाठ है। यह 4 में से 4वाँ पाठ है। इस अध्ययन पथ के 3 तक कोई भी पाठ पूरा पढ़ना निःशुल्क है — इसके बाद CoddyKit PRO हर पाठ अनलॉक करता है, साथ ही अंतर्निर्मित कोड संपादक और चौबीसों घंटे एआई शिक्षक के साथ व्यावहारिक अभ्यास भी उपलब्ध कराता है। यह Next.js 15 फुलस्टैक (App Router + Server Actions) सीखने के मार्ग का हिस्सा है और आपकी प्रगति वेब तथा CoddyKit ऐप पर सिंक होती रहती है। Next.js 15 फुलस्टैक (App Router + Server Actions) पाठ्यक्रम में कुल 4 पाठ शामिल हैं।
प्रोडक्शन की निगरानी क्यों करें?
आपका ऐप लाइव होने के बाद आप हर उपयोगकर्ता के वातावरण को दोहरा नहीं सकते। निगरानी बताती है कि कुछ कब और कितनी बार, तथा किन लोगों के लिए खराब होता है—ताकि समस्याएँ फैलने से पहले आप उन्हें ठीक कर सकें।
तीन स्तंभ
ऑब्ज़र्वेबिलिटी इन पर आधारित होती है:
- लॉग: अलग-अलग घटनाएँ
- मेट्रिक्स: समय के साथ संख्याएँ (विलंबता, त्रुटि दर)
- ट्रेस: सेवाओं के बीच किसी अनुरोध का मार्ग
संरचित लॉगिंग
सादा टेक्स्ट लॉग खोजना कठिन होता है। सुसंगत फ़ील्ड वाले संरचित JSON लॉग बनाएँ, ताकि टूल उन्हें फ़िल्टर और एकत्र कर सकें।
console.log(JSON.stringify({
level: 'error',
route: '/api/checkout',
userId: 42,
msg: 'payment failed'
}));Sentry इंस्टॉल करना
Sentry स्टैक ट्रेस और संदर्भ के साथ अनहैंडल्ड त्रुटियों को कैप्चर करता है। विज़ार्ड इसे सर्वर और क्लाइंट दोनों में जोड़ देता है।
npx @sentry/wizard@latest -i nextjsत्रुटियाँ कैप्चर करना
Sentry अनकैप्चर किए गए अपवादों को अपने-आप पकड़ता है, लेकिन आप अतिरिक्त संदर्भ के साथ संभाली गई त्रुटियों की रिपोर्ट भी कर सकते हैं।
import * as Sentry from '@sentry/nextjs';
try {
await charge();
} catch (e) {
Sentry.captureException(e, { tags: { feature: 'billing' } });
}error.tsx के साथ त्रुटि सीमाएँ
error.tsx फ़ाइल रूट खंड में रेंडर त्रुटियों को पकड़ती है और सफ़ेद स्क्रीन के बजाय फ़ॉलबैक दिखाती है। यह एक Client Component है।
'use client';
export default function Error({ error, reset }) {
return <button onClick={reset}>Try again</button>;
}Web Vitals से प्रदर्शन
Core Web Vitals—LCP, CLS, INP—से वास्तविक उपयोगकर्ता अनुभव को ट्रैक करें। Next.js इन्हें एक रिपोर्टिंग हुक के ज़रिए उपलब्ध कराता है।
export function reportWebVitals(metric) {
if (metric.name === 'LCP') sendToAnalytics(metric);
}Vercel Analytics और Speed Insights
Vercel पर Analytics और Speed Insights पैकेज बिना किसी अतिरिक्त कॉन्फ़िगरेशन के, प्रत्येक एक कॉम्पोनेंट के साथ वास्तविक दुनिया के मेट्रिक्स एकत्र करते हैं।
import { SpeedInsights } from '@vercel/speed-insights/next';
// render <SpeedInsights /> in your root layoutअपटाइम निगरानी
अपटाइम मॉनिटर निश्चित अंतराल पर स्वास्थ्य एंडपॉइंट को पिंग करता है और उसके विफल होने पर आपको सचेत करता है। इसके लिए एक हल्का रूट उपलब्ध कराएँ।
// app/api/health/route.ts
export function GET() {
return Response.json({ status: 'ok' });
}अलर्ट सेट करना
यदि कोई डेटा देखे ही नहीं, तो वह बेकार है। अलर्ट कॉन्फ़िगर करें: त्रुटि दर बढ़ने या विलंबता के सीमा पार करने पर Slack में टीम को सूचित करें। उन लक्षणों पर अलर्ट करें जिन्हें उपयोगकर्ता महसूस करते हैं, शोर पर नहीं।
सर्वोत्तम अभ्यास
प्रोडक्शन पर नज़र बनाए रखें:
- संरचित लॉग बनाएँ
- Sentry और error.tsx से त्रुटियों को ट्रैक करें
- Core Web Vitals पर नज़र रखें
- एक अपटाइम जाँच और अर्थपूर्ण अलर्ट जोड़ें
त्वरित जाँच
निगरानी संबंधी अपने ज्ञान की जाँच करें।
पुनरावलोकन
आपने प्रोडक्शन की निगरानी करना सीखा:
- लॉग, मेट्रिक्स और ट्रेस मिलकर ऑब्ज़र्वेबिलिटी बनाते हैं
- त्रुटियों पर नज़र रखने के लिए संरचित लॉगिंग और Sentry का उपयोग करें
error.tsxसे रेंडरिंग की त्रुटियों को पकड़ें- Web Vitals पर नज़र रखें, हेल्थ एंडपॉइंट जोड़ें और अलर्ट सेट करें
अब आप उपयोगकर्ताओं की शिकायत करने से पहले समस्याएँ ढूँढ़कर ठीक कर सकते हैं।
एआई शिक्षक के साथ TypeScript सीखें — निःशुल्क
अपने ब्राउज़र में वास्तविक कोड लिखें और चलाएँ, चौबीसों घंटे एआई शिक्षक से तुरंत सहायता पाएँ, और वेब या ऐप पर वहीं से शुरू करें जहाँ आपने छोड़ा था।
- पाठ्यक्रम
- 22
- पाठ
- 88
अक्सर पूछे जाने वाले प्रश्न
क्या “प्रोडक्शन में निगरानी और त्रुटि ट्रैकिंग” पाठ निःशुल्क है?
हाँ — Next.js 15 फुलस्टैक (App Router + Server Actions) अध्ययन पथ के 3 तक कोई भी पाठ, जिसमें “प्रोडक्शन में निगरानी और त्रुटि ट्रैकिंग” भी शामिल है, यहाँ वेब पर पूरा पढ़ना निःशुल्क है। इसके बाद CoddyKit PRO हर पाठ अनलॉक करता है, साथ ही अंतर्निर्मित कोड संपादक और चौबीसों घंटे एआई शिक्षक के साथ इंटरैक्टिव अभ्यास भी उपलब्ध कराता है। Next.js 15 फुलस्टैक (App Router + Server Actions) पाठ्यक्रम में कुल 4 पाठ शामिल हैं।
“प्रोडक्शन में निगरानी और त्रुटि ट्रैकिंग” में मैं क्या सीखूँगा?
संरचित लॉगिंग, Sentry के माध्यम से त्रुटि ट्रैकिंग, प्रदर्शन विश्लेषण और अपटाइम निगरानी के साथ अपने परिनियोजित Next.js ऐप को स्वस्थ रखें। आप ब्राउज़र में सीधे चलाए जाने वाले व्यावहारिक कोड के साथ Next.js 15 फुलस्टैक (App Router + Server Actions) का अभ्यास करते हैं, और पाठ पूरा करते समय 24/7 एआई ट्यूटर आपके प्रश्नों के उत्तर देता है।
क्या Next.js 15 फुलस्टैक (App Router + Server Actions) शुरू करने के लिए मुझे किसी अनुभव की आवश्यकता है?
पहले के अनुभव की आवश्यकता नहीं है। CoddyKit पर Next.js 15 फुलस्टैक (App Router + Server Actions) शुरुआती से लेकर उन्नत शिक्षार्थियों तक सभी के लिए व्यवस्थित किया गया है, इसलिए आप यहीं से या शुरुआत से सीखना शुरू कर सकते हैं और अपनी गति से आगे बढ़ सकते हैं। यह 4 में से 4वाँ पाठ है।
“प्रोडक्शन में निगरानी और त्रुटि ट्रैकिंग” पाठ पूरा करने में कितना समय लगता है?
CoddyKit का अधिकांश पाठ लगभग 5–10 मिनट में पूरा हो जाता है। हर पाठ छोटा और संवादात्मक है, इसलिए आप लगातार प्रगति करते हैं और वेब या ऐप पर वहीं से सीखना जारी रख सकते हैं जहाँ आपने छोड़ा था।
क्या मैं इस Next.js 15 फुलस्टैक (App Router + Server Actions) पाठ में कोड लिख और चला सकता हूँ?
हाँ। हर Next.js 15 फुलस्टैक (App Router + Server Actions) पाठ में एक अंतर्निर्मित कोड संपादक शामिल है, जिससे आप सीधे अपने ब्राउज़र में वास्तविक कोड लिख और चला सकते हैं और तुरंत एआई प्रतिक्रिया पा सकते हैं—स्थानीय सेटअप की आवश्यकता नहीं है।
इस पाठ्यक्रम के सभी पाठ
- Vercel पर परिनियोजन
- फुलस्टैक एप्लिकेशन बनाना
- परियोजना समीक्षा और सर्वोत्तम विधियाँ
- प्रोडक्शन में निगरानी और त्रुटि ट्रैकिंग