तालिका में होने वाले बदलावों की सदस्यता
विशिष्ट डेटाबेस तालिकाओं या पंक्तियों में प्रविष्टि, अपडेट और विलोपन को सुनने के लिए क्लाइंट-पक्षीय कोड लागू कीजिए।
तालिका में होने वाले बदलावों की सदस्यता, CoddyKit पर Supabase: Backend as a Service का एक निःशुल्क पाठ है। यह 4 में से 2वाँ पाठ है। आप नीचे पूरा पाठ निःशुल्क पढ़ सकते हैं—फिर अंतर्निहित कोड संपादक और 24/7 एआई ट्यूटर के साथ ब्राउज़र में इसका व्यावहारिक अभ्यास कर सकते हैं। यह Supabase: Backend as a Service सीखने के मार्ग का हिस्सा है और आपकी प्रगति वेब तथा CoddyKit ऐप पर सिंक होती रहती है। Supabase: Backend as a Service पाठ्यक्रम में कुल 4 पाठ शामिल हैं।
लाइव डेटा में आपका स्वागत है!
पिछले पाठ में हमने रीयलटाइम डेटा की अवधारणा के बारे में सीखा। अब आइए समझते हैं कि आपका ऐप आपके Supabase डेटाबेस में होने वाले बदलावों को वास्तव में कैसे सुन सकता है!
इसका मतलब है कि आपके उपयोगकर्ता अपनी स्क्रीन को रीफ़्रेश किए बिना तुरंत अपडेट देख सकते हैं। लाइव चैट, सूचनाओं या डैशबोर्ड के बारे में सोचिए।
रीयलटाइम क्लाइंट
Supabase एक शक्तिशाली रीयलटाइम क्लाइंट प्रदान करता है, जो डेटाबेस में होने वाले बदलावों को सुनना बेहद आसान बना देता है। यह PostgreSQL की प्रतिकृति सुविधाओं पर आधारित है।
- यह तुरंत संचार के लिए WebSockets का उपयोग करता है।
- आप इसके साथ
supabase.realtimeऑब्जेक्ट के माध्यम से काम करेंगे। - यह खास 'चैनलों' से जुड़कर काम करता है।
चैनल बनाना
बदलावों को सुनने से पहले आपको एक channel बनाना होगा। channel आपके डेटाबेस से अपडेट प्राप्त करने वाली एक समर्पित लाइन जैसा होता है।
आप बताते हैं कि आपकी रुचि किस तालिका में है, और फिर उस तालिका के इवेंट की सदस्यता ले सकते हैं।
import { createClient } from '@supabase/supabase-js';
const SUPABASE_URL = 'YOUR_SUPABASE_URL';
const SUPABASE_ANON_KEY = 'YOUR_ANON_KEY';
const supabase = createClient(SUPABASE_URL, SUPABASE_ANON_KEY);
// Create a channel for the 'messages' table
const messagesChannel = supabase.channel('table-db-changes')
.on(
'postgres_changes',
{ event: '*', schema: 'public', table: 'messages' },
(payload) => {
console.log('Change received!', payload);
}
)
.subscribe();
console.log('Subscribed to messages channel...');
// In a real app, you'd keep this running to listen.
// For this example, we'll just show the setup.
// You'd typically unsubscribe when the component unmounts.
// messagesChannel.unsubscribe();सभी इवेंट सुनना
ऊपर दिए गए उदाहरण में event: '*' का उपयोग किया गया है। यह एक वाइल्डकार्ड है, जो Supabase को बताता है कि आप अपनी निर्दिष्ट तालिका में होने वाले सभी प्रकार के बदलावों की सूचना पाना चाहते हैं।
- INSERT: एक नई पंक्ति जोड़ी गई।
- UPDATE: मौजूदा पंक्ति में बदलाव किया गया।
- DELETE: एक पंक्ति हटा दी गई।
हर इवेंट प्रकार आपके कॉलबैक फ़ंक्शन को सक्रिय करेगा।
कोड: तालिका के सभी बदलाव
आइए अपने channel के सेटअप को इस तरह बेहतर बनाते हैं कि वह products तालिका के सभी इवेंट प्रकारों को स्पष्ट रूप से सुने। मान लीजिए कि हम एक इन्वेंटरी ऐप बना रहे हैं!
इस कोड को चलाइए और कल्पना कीजिए कि नए उत्पाद जोड़े जा रहे हैं, उनमें बदलाव हो रहे हैं या उन्हें हटाया जा रहा है।
import { createClient } from '@supabase/supabase-js';
const SUPABASE_URL = 'YOUR_SUPABASE_URL';
const SUPABASE_ANON_KEY = 'YOUR_ANON_KEY';
const supabase = createClient(SUPABASE_URL, SUPABASE_ANON_KEY);
const productChanges = supabase.channel('product_updates')
.on(
'postgres_changes',
{ event: '*', schema: 'public', table: 'products' },
(payload) => {
console.log('Product change detected:', payload.eventType);
console.log('New data:', payload.new);
console.log('Old data:', payload.old);
}
)
.subscribe();
console.log('Listening for all changes on products table...');
// This script would typically run in a browser or Node.js environment
// where Supabase client is properly initialized and events would stream.
// For this interactive example, it shows the setup.
// In a real scenario, you'd wait for actual database events.
विशिष्ट इवेंट चुनना
कभी-कभी आपकी रुचि केवल कुछ खास प्रकार के बदलावों में होती है। उदाहरण के लिए, हो सकता है कि आप केवल यह जानना चाहते हों कि कोई नई वस्तु कब जोड़ी गई, न कि उसमें बदलाव कब हुआ या उसे कब हटाया गया।
आप अपनी subscription options में event प्रकार निर्दिष्ट कर सकते हैं:
event: 'INSERT'event: 'UPDATE'event: 'DELETE'
पंक्ति के डेटा के आधार पर फ़िल्टर करना
इवेंट प्रकारों के अलावा, आप स्वयं पंक्तियों में मौजूद डेटा के आधार पर भी अपडेट फ़िल्टर कर सकते हैं। विशिष्ट रिकॉर्ड में होने वाले बदलावों को सुनने के लिए यह बहुत शक्तिशाली सुविधा है!
कॉलम के मानों पर eq (बराबर) या neq (बराबर नहीं) जैसी शर्तों का उपयोग करें:
filter: 'id=eq.123'(ID 123 वाली पंक्ति में होने वाले बदलाव सुनें)filter: 'status=neq.archived'(ऐसे बदलाव सुनें जिनमें status archived नहीं है)
कोड: फ़िल्टर किए गए बदलाव
आइए ऐसी subscription सेट करते हैं, जो केवल नए उत्पाद जोड़े जाने (INSERT) पर और केवल तब सुने, जब उनका category 'electronics' हो।
इसे चलाकर देखिए कि आप फ़िल्टर को कितना विशिष्ट बना सकते हैं!
import { createClient } from '@supabase/supabase-js';
const SUPABASE_URL = 'YOUR_SUPABASE_URL';
const SUPABASE_ANON_KEY = 'YOUR_ANON_KEY';
const supabase = createClient(SUPABASE_URL, SUPABASE_ANON_KEY);
const newElectronics = supabase.channel('new_electronics_channel')
.on(
'postgres_changes',
{
event: 'INSERT',
schema: 'public',
table: 'products',
filter: 'category=eq.electronics' // Filter by category
},
(payload) => {
console.log('New electronic product added:', payload.new.name);
console.log('Details:', payload.new);
}
)
.subscribe();
console.log('Listening for new electronic products...');
// This code demonstrates the filter setup.
// Actual events would be logged if matching data is inserted.
आने वाले डेटा को संभालना
जब कोई इवेंट होता है, तो आपका कॉलबैक फ़ंक्शन एक payload ऑब्जेक्ट प्राप्त करता है। इस ऑब्जेक्ट में बदलाव से जुड़ी सभी जानकारी होती है:
eventType: 'INSERT', 'UPDATE' या 'DELETE'।new: नई पंक्ति का डेटा (INSERT/UPDATE के लिए)।old: पुरानी पंक्ति का डेटा (UPDATE/DELETE के लिए)।table,schema: बदलाव कहाँ हुआ, इसकी जानकारी।
इस डेटा की मदद से आप अपने UI को अपडेट कर सकते हैं या कोई अन्य लॉजिक चला सकते हैं।
बदलावों की सदस्यता समाप्त करना
जब channel की आवश्यकता न रह जाए, तो उसकी सदस्यता समाप्त करना महत्वपूर्ण है। इससे मेमोरी लीक और अनावश्यक नेटवर्क ट्रैफ़िक से बचा जा सकता है।
React component में आप componentWillUnmount या useEffect के cleanup फ़ंक्शन में सदस्यता समाप्त कर सकते हैं। बस अपने channel ऑब्जेक्ट पर .unsubscribe() कॉल करें।
const myChannel = supabase.channel('my_channel')
.on(...)
.subscribe();
// Later, when you're done listening:
myChannel.unsubscribe();
console.log('Unsubscribed from my_channel.');त्वरित जाँच: रीयलटाइम फ़िल्टर
आप orders तालिका में होने वाले किसी भी अपडेट को सुनना चाहते हैं, खास तौर पर उन orders को जिनमें status बदलकर 'shipped' हो जाता है।
अपने on() method में आप किन options का उपयोग करेंगे?
पुनरावलोकन: अपडेट बने रहिए!
बहुत अच्छा! आपने Supabase Realtime की मदद से लाइव डेटाबेस बदलावों को सुनना सीख लिया है।
- आप किसी खास तालिका के लिए एक channel बनाते हैं।
- सदस्यता लेने के लिए आप
.on('postgres_changes', options, callback)का उपयोग करते हैं। - आप इवेंट प्रकार (
INSERT,UPDATE,DELETE) और पंक्ति के डेटा (जैसे,filter: 'column=eq.value') के आधार पर फ़िल्टर कर सकते हैं। - जब channel की आवश्यकता न रह जाए, तो हमेशा उसकी सदस्यता समाप्त करना याद रखें।
अगले पाठ में हम इन्हीं अवधारणाओं का उपयोग करके लाइव चैट सुविधा बनाएँगे!
एआई शिक्षक के साथ Supabase: Backend as a Service सीखें — निःशुल्क
अपने ब्राउज़र में वास्तविक कोड लिखें और चलाएँ, चौबीसों घंटे एआई शिक्षक से तुरंत सहायता पाएँ, और वेब या ऐप पर वहीं से शुरू करें जहाँ आपने छोड़ा था।
- पाठ्यक्रम
- 11
- पाठ
- 40
अक्सर पूछे जाने वाले प्रश्न
क्या “तालिका में होने वाले बदलावों की सदस्यता” पाठ निःशुल्क है?
हाँ—“तालिका में होने वाले बदलावों की सदस्यता” का पूरा पाठ यहाँ वेब पर निःशुल्क पढ़ा जा सकता है। इंटरैक्टिव अभ्यास (अंतर्निहित कोड संपादक और 24/7 एआई ट्यूटर) करने और Supabase: Backend as a Service पाठ्यक्रम का बाकी हिस्सा अनलॉक करने के लिए CoddyKit PRO लें। Supabase: Backend as a Service पाठ्यक्रम में कुल 4 पाठ शामिल हैं।
“तालिका में होने वाले बदलावों की सदस्यता” में मैं क्या सीखूँगा?
विशिष्ट डेटाबेस तालिकाओं या पंक्तियों में प्रविष्टि, अपडेट और विलोपन को सुनने के लिए क्लाइंट-पक्षीय कोड लागू कीजिए। आप ब्राउज़र में सीधे चलाए जाने वाले व्यावहारिक कोड के साथ Supabase: Backend as a Service का अभ्यास करते हैं, और पाठ पूरा करते समय 24/7 एआई ट्यूटर आपके प्रश्नों के उत्तर देता है।
क्या Supabase: Backend as a Service शुरू करने के लिए मुझे किसी अनुभव की आवश्यकता है?
पहले के अनुभव की आवश्यकता नहीं है। CoddyKit पर Supabase: Backend as a Service शुरुआती से लेकर उन्नत शिक्षार्थियों तक सभी के लिए व्यवस्थित किया गया है, इसलिए आप यहीं से या शुरुआत से सीखना शुरू कर सकते हैं और अपनी गति से आगे बढ़ सकते हैं। यह 4 में से 2वाँ पाठ है।
“तालिका में होने वाले बदलावों की सदस्यता” पाठ पूरा करने में कितना समय लगता है?
CoddyKit का अधिकांश पाठ लगभग 5–10 मिनट में पूरा हो जाता है। हर पाठ छोटा और संवादात्मक है, इसलिए आप लगातार प्रगति करते हैं और वेब या ऐप पर वहीं से सीखना जारी रख सकते हैं जहाँ आपने छोड़ा था।
क्या मैं इस Supabase: Backend as a Service पाठ में कोड लिख और चला सकता हूँ?
हाँ। हर Supabase: Backend as a Service पाठ में एक अंतर्निर्मित कोड संपादक शामिल है, जिससे आप सीधे अपने ब्राउज़र में वास्तविक कोड लिख और चला सकते हैं और तुरंत एआई प्रतिक्रिया पा सकते हैं—स्थानीय सेटअप की आवश्यकता नहीं है।
इस पाठ्यक्रम के सभी पाठ
- रीयलटाइम सदस्यताओं को समझना
- तालिका में होने वाले बदलावों की सदस्यता
- लाइव चैट सुविधा बनाना
- उपस्थिति और प्रसारण चैनल