सरल शब्दों में Redux कैसे काम करता है
React components के बीच डेटा पास करना अक्सर 'गेम ऑफ टेलीफोन' जैसा महसूस होता है। आप डेटा को पैरेंट से चाइल्ड और फिर ग्रैंडचाइल्ड तक पहुँचाते हैं। जैसे-जैसे आपका ऐप बढ़ता है, यह प्रक्रिया काफी उलझ जाती है।
Redux इसे हल करता है। यह 'सिंगल सोर्स ऑफ ट्रुथ' (सत्य का एकमात्र स्रोत) बनाता है। बिखरे हुए डेटा के बजाय, सब कुछ एक केंद्रीय तिजोरी (central vault) में रहता है।
Redux को समझने के लिए एक कॉफी शॉप के बारे में सोचें।
The Store (तिजोरी) यह दुकान का बहीखाता (ledger) है। यह बीन्स की संख्या, ऑर्डर और स्टाफ की सूची का हिसाब रखता है।
The Action (ऑर्डर)
एक ग्राहक काउंटर से सीधे लाटे (latte) नहीं उठाता। वे एक ऑर्डर देते हैं। Action एक साधारण ऑब्जेक्ट है जो बताता है कि क्या हुआ है।
उदाहरण: { type: 'ADD_TODO', text: 'Buy Milk' }
The Reducer (बरिस्ता) बरिस्ता ही एकमात्र व्यक्ति है जो बहीखाते को अपडेट करता है। वे वर्तमान स्थिति (current state) और नया ऑर्डर लेते हैं। फिर वे बहीखाते का एक नया संस्करण (version) तैयार करते हैं।
The Dispatch (कैशियर) कैशियर आपका ऑर्डर लेता है और उसे बरिस्ता को दे देता है। Dispatch वह फंक्शन है जो आपके action को store तक भेजता है।
Redux का उपयोग क्यों करें?
जैसे-जैसे आपका ऐप बढ़ता है और इसमें यूजर प्रोफाइल या शॉपिंग कार्ट जैसी चीजें जुड़ती हैं, एक केंद्रीय स्टोर डिबगिंग (debugging) को आसान बना देता है। आप यह देखने के लिए अपने action history को देख सकते हैं कि डेटा कब और क्यों बदला। यह आपकी वेबसाइट के लिए एक 'फ्लाइट रिकॉर्डर' की तरह काम करता है।
सारांश:
• Action: बदलाव का वर्णन करने वाला एक नोट। • Reducer: वह लॉजिक जो बदलाव करता है। • Dispatch: वह ट्रिगर जो action को लॉजिक तक भेजता है।
Source: https://dev.to/code_with_aravind/how-redux-works-in-simple-terms-1pkp