बैकबोन है ...
... घटकों का एक बहुत छोटा पुस्तकालय जो आप अपने कोड को व्यवस्थित करने में मदद करने के लिए उपयोग कर सकते हैं। यह एक एकल जावास्क्रिप्ट फ़ाइल के रूप में पैक किया गया है। टिप्पणियों को छोड़कर, इसमें वास्तविक जावास्क्रिप्ट की 1000 से कम लाइनें हैं। यह समझदारी से लिखा गया है और आप एक दो घंटे में पूरी बात पढ़ सकते हैं।
यह फ्रंट-एंड लाइब्रेरी है, आप इसे स्क्रिप्ट टैग के साथ अपने वेब पेज में शामिल करते हैं। यह केवल ब्राउज़र को प्रभावित करता है, और आपके सर्वर के बारे में बहुत कम कहता है, सिवाय इसके कि यह आदर्श रूप से एक आरामदायक एपीआई को उजागर करे।
यदि आपके पास एक एपीआई है, तो बैकबोन में कुछ सहायक विशेषताएं हैं जो आपको इसके बारे में बात करने में मदद करेंगी, लेकिन आप किसी भी स्थिर HTML पेज में अन्तरक्रियाशीलता जोड़ने के लिए बैकबोन का उपयोग कर सकते हैं।
रीढ़ की हड्डी के लिए है ...
... जावास्क्रिप्ट में संरचना जोड़कर।
क्योंकि जावास्क्रिप्ट किसी विशेष पैटर्न को लागू नहीं करता है, इसलिए जावास्क्रिप्ट एप्लिकेशन बहुत जल्दी गड़बड़ हो सकते हैं। जिस किसी ने भी जावास्क्रिप्ट में तुच्छ से परे कुछ बनाया है, संभवतः सवालों के खिलाफ भाग जाएगा:
- मैं अपना डेटा कहां संग्रहीत करूंगा?
- मैं अपने कार्य कहां रखूंगा?
- मैं अपने कार्यों को एक साथ कैसे करूंगा, ताकि वे समझदार तरीके से बुलाए जाएं और स्पेगेटी की ओर मुड़ें नहीं?
- मैं विभिन्न डेवलपर्स द्वारा इस कोड को कैसे बनाए रख सकता हूं?
बैकबोन आपको देकर इन सवालों के जवाब चाहता है:
- मॉडल और संग्रह आपको डेटा और डेटा के संग्रह का प्रतिनिधित्व करने में मदद करने के लिए।
- जब आपका डेटा बदलता है, तो आपको अपने DOM को अपडेट करने में मदद करने के लिए दृश्य।
- एक घटना प्रणाली ताकि घटक एक दूसरे को सुन सकें। यह आपके घटकों को डी-युग्मित रखता है और स्पेगेटीफिकेशन को रोकता है।
- समझदार सम्मेलनों का एक न्यूनतम सेट, इसलिए डेवलपर्स एक ही कोडबेस पर एक साथ काम कर सकते हैं।
हम इसे एमवी * पैटर्न कहते हैं। मॉडल, दृश्य और वैकल्पिक अतिरिक्त।
बैकबोन हल्का है
प्रारंभिक दिखावे के बावजूद, बैकबोन काल्पनिक रूप से हल्का है, यह शायद ही कुछ भी करता है। यह क्या करता है बहुत मददगार है।
यह आपको छोटी वस्तुओं का एक सेट देता है जिसे आप बना सकते हैं, और जो घटनाओं का उत्सर्जन कर सकते हैं और एक दूसरे को सुन सकते हैं। आप उदाहरण के लिए एक टिप्पणी का प्रतिनिधित्व करने के लिए एक छोटी सी वस्तु बना सकते हैं, और फिर ब्राउज़र में किसी विशेष स्थान पर टिप्पणी के प्रदर्शन का प्रतिनिधित्व करने के लिए एक छोटी टिप्पणी दृश्य वस्तु।
आप टिप्पणी को देखने के लिए टिप्पणी देख सकते हैं और टिप्पणी बदल जाने पर खुद को फिर से तैयार कर सकते हैं। यहां तक कि अगर आपके पास अपने पृष्ठ पर कई स्थानों पर समान टिप्पणी प्रदर्शित है, तो ये सभी दृश्य एक ही टिप्पणी मॉडल को सुन सकते हैं और सिंक में रह सकते हैं।
कोड बनाने का यह तरीका आपको कई उलझनों के साथ बहुत बड़ा होने पर भी आपको उलझने से बचाने में मदद करता है।
मॉडल
बाहर शुरू करते समय, अपने डेटा को वैश्विक चर में, या DOM में डेटा विशेषताओं के रूप में संग्रहीत करना आम है । इन दोनों के मुद्दे हैं। वैश्विक चर एक दूसरे के साथ संघर्ष कर सकते हैं, और आमतौर पर खराब रूप हैं। DOM में संग्रहीत डेटा विशेषताएँ केवल स्ट्रिंग्स हो सकती हैं, आपको उन्हें फिर से अंदर और बाहर पार्स करना होगा। सरणियों, तिथियों या वस्तुओं जैसी चीजों को स्टोर करना और संरचित रूप में अपने डेटा को पार्स करना मुश्किल है।
डेटा विशेषताएँ इस तरह दिखती हैं:
<p data-username="derek" data-age="42"></p>
बैकबोन आपके डेटा और संबंधित विधियों का प्रतिनिधित्व करने के लिए एक मॉडल ऑब्जेक्ट प्रदान करके इसे हल करता है । कहते हैं कि आपके पास एक टूडू सूची है, आपके पास उस सूची में प्रत्येक आइटम का प्रतिनिधित्व करने वाला एक मॉडल होगा।
जब आपका मॉडल अपडेट किया जाता है, तो यह एक ईवेंट को फायर करता है। आपके पास उस विशेष वस्तु से बंधा हुआ दृश्य हो सकता है। दृश्य मॉडल परिवर्तन की घटनाओं को सुनता है और खुद को फिर से प्रस्तुत करता है।
दृश्य
Backbone आपको DOM पर बात करने वाली View ऑब्जेक्ट्स प्रदान करता है। सभी फ़ंक्शंस जो DOM को मैनिपुलेट करते हैं या DOM ईवेंट्स को सुनने के लिए यहां जाते हैं।
एक दृश्य आम तौर पर एक रेंडर फ़ंक्शन को लागू करता है जो पूरे दृश्य को फिर से दिखाता है, या संभवतः दृश्य का हिस्सा होता है। रेंडर फ़ंक्शन को लागू करने के लिए कोई दायित्व नहीं है, लेकिन यह एक सामान्य सम्मेलन है।
प्रत्येक दृश्य डोम के एक विशेष हिस्से से जुड़ा होता है, इसलिए आपके पास एक सर्चफ़ॉर्मव्यू हो सकता है, जो केवल खोज फ़ॉर्म को सुनता है, और शॉपिंगकार्ट व्यू, जो केवल खरीदारी कार्ट को प्रदर्शित करता है।
दृश्य आमतौर पर विशिष्ट मॉडल या संग्रह के लिए भी बाध्य होते हैं। जब मॉडल अद्यतन करता है, तो यह एक घटना को आग लगाता है जिसे दृश्य सुनता है। दृश्य उन्हें खुद को पुनः प्रस्तुत करने के लिए प्रस्तुतिकरण कह सकते हैं।
इसी तरह, जब आप किसी फॉर्म में टाइप करते हैं, तो आपका दृश्य किसी मॉडल ऑब्जेक्ट को अपडेट कर सकता है। उस मॉडल को सुनने वाला हर दूसरा दृश्य तब अपने रेंडर फ़ंक्शन को कॉल करेगा।
यह हमें उन चिंताओं का एक अलग रूप देता है जो हमारे कोड को साफ सुथरा रखता है।
रेंडर समारोह
आप अपने रेंडर फ़ंक्शन को किसी भी तरह से लागू कर सकते हैं जिसे आप फिट देखते हैं। DOM को मैन्युअल रूप से अपडेट करने के लिए आप यहाँ कुछ jQuery डाल सकते हैं।
आप एक टेम्पलेट भी संकलित कर सकते हैं और उसका उपयोग कर सकते हैं। एक प्रविष्टि प्रविष्टि बिंदु के साथ एक स्ट्रिंग है। आप इसे JSON ऑब्जेक्ट के साथ एक संकलित फ़ंक्शन को पास करते हैं और एक संकलित स्ट्रिंग वापस प्राप्त करते हैं जिसे आप अपने DOM में सम्मिलित कर सकते हैं।
संग्रह
आपके पास संग्रह की पहुंच भी है जो मॉडल की सूची संग्रहीत करते हैं, इसलिए एक todoCollection, todo मॉडल की एक सूची होगी। जब कोई संग्रह किसी मॉडल को प्राप्त करता है या खो देता है, तो उसका क्रम बदलता है, या संग्रह अद्यतनों में एक मॉडल होता है, तो पूरा संग्रह एक घटना को आग लगा देता है।
जब भी संग्रह अपडेट होता है, तो एक दृश्य संग्रह को सुन सकता है और खुद को अपडेट कर सकता है।
आप अपने संग्रह में सॉर्ट और फ़िल्टर विधियाँ जोड़ सकते हैं, और उदाहरण के लिए इसे अपने आप सॉर्ट कर सकते हैं।
और इवेंट्स टु टाईट ऑल टुगेदर
जितना संभव हो, आवेदन घटकों को एक दूसरे से अलग किया जाता है। वे ईवेंट का उपयोग करते हुए संवाद करते हैं, इसलिए एक शॉपिंगकार्ट व्यू खरीदारी के कार्ट संग्रह को सुन सकता है, और जब कार्ट में जोड़ा जाता है तो स्वयं को फिर से तैयार करता है।
shoppingCartView.listenTo(shoppingCart, "add", shoppingCartView.render);
बेशक, अन्य ऑब्जेक्ट भी शॉपिंगकार्ट को सुन रहे होंगे, और अन्य चीजें भी कर सकते हैं जैसे कुल अपडेट करना, या स्थानीय भंडारण में राज्य को बचाना।
- दृश्य मॉडल को सुनते हैं और मॉडल में बदलाव होने पर प्रस्तुत करते हैं।
- जब संग्रह में कोई आइटम बदलता है, तो दृश्य संग्रह को सुनता है (या ग्रिड या मानचित्र आदि) सूची को प्रस्तुत करता है।
- मॉडल दृश्य को सुनते हैं ताकि वे राज्य बदल सकें, शायद जब कोई फ़ॉर्म संपादित किया जाता है।
अपनी वस्तुओं को इस तरह से काटना और घटनाओं का उपयोग करके संवाद करने का मतलब है कि आप कभी भी गाँठ में उलझेंगे नहीं, और नए घटकों और व्यवहार को जोड़ना आसान होगा। आपके नए घटकों को सिस्टम में पहले से मौजूद अन्य वस्तुओं को सुनना होगा।
कन्वेंशनों
बैकबोन के लिए लिखे गए कोड सम्मेलनों के ढीले सेट का अनुसरण करते हैं। DOM कोड एक व्यू में आता है। संग्रह कोड एक संग्रह में आता है। व्यापार तर्क एक मॉडल में जाता है। आपके कोडबेस को उठाने वाला एक और डेवलपर ग्राउंड रनिंग को हिट करने में सक्षम होगा।
सारांश में
बैकबोन एक हल्का पुस्तकालय है जो आपके कोड में संरचना को उधार देता है। घटक अपघटित होते हैं और घटनाओं के माध्यम से संवाद करते हैं ताकि आप गड़बड़ न हों। आप अपने कोडबेस को आसानी से विस्तारित कर सकते हैं, बस एक नई वस्तु बनाकर और इसे अपने मौजूदा ऑब्जेक्ट को उचित रूप से सुन सकते हैं। आपका कोड क्लीनर, अच्छे, और अधिक रखरखाव योग्य होगा।
मेरी छोटी सी किताब
मुझे बैकबोन इतनी पसंद आई कि मैंने इसके बारे में थोड़ा इंट्रो बुक लिख दिया। आप इसे यहाँ ऑनलाइन पढ़ सकते हैं: http://nicholasjohnson.com/backbone-book/
मैंने सामग्री को एक छोटे ऑनलाइन पाठ्यक्रम में भी तोड़ दिया, जिसे आप यहां पा सकते हैं: http://www.forwardadvance.com/course/backbone । आप लगभग एक दिन में कोर्स पूरा कर सकते हैं।