Backbone.js मॉड्यूलर सेटअप

Question

मैं रीढ़ की हड्डी के लिए नया हूं, और मैं यहां थोड़ी सी सहायता मांगने के लिए कह रहा हूं कि मैं अपने वर्तमान वेबपैप प्रोजेक्ट के निर्माण के बारे में कैसे जाऊंगा। मैं सर्वर के लिए एक मॉड्यूलर प्रशासन पैनल विकसित कर रहा हूँ। पैनल के प्रत्येक एकल "पृष्ठ" को एक पैकेज "मॉड्यूल" होना चाहिए जिसमें नियंत्रक, मॉडल और विचार शामिल हैं।

पैनल में बुनियादी नेविगेशन के साथ प्रारंभ में लोड होने वाला मुख्य लेआउट व्यू शामिल होगा। जब कोई उपयोगकर्ता नेविगेशन पर किसी लिंक पर क्लिक करता है, तो पृष्ठ लेआउट में AJAX के माध्यम से लोड हो जाता है। (और यदि यह बेवकूफ लगता है/ऐसा करने का कोई कारण नहीं है तो कृपया मुझे बताएं :))

चूंकि अन्य इन पृष्ठों को भी विकसित करेंगे, और चूंकि वे मॉड्यूलर हैं, इसलिए मुझे नहीं पता कि कौन से मॉडल, विचार और नियंत्रक मुझे पेज के अंदर प्रस्तुत किया जाएगा जिसे मैं AJAX के माध्यम से लोड करता हूं।

रीढ़ की हड्डी के साथ ऐसा करने के लिए मैं सबसे अच्छा कैसे जाऊं?

मैं विशेष रूप से सोच रहा हूं कि मैं बैकबोन मॉडल आदि को गतिशील रूप से कैसे बढ़ाऊंगा, और मैं कैसे प्रबंधित करूंगा (उदाहरण के लिए) उपयोगकर्ता पृष्ठ को छोड़कर/या बाद में इसका पुनरीक्षण कर रहा है।

क्या बैकबोन कुछ ऐसा प्रदान करता है जिसके साथ मैं काम कर सकता हूं, क्या मुझे खुद को एक साथ कुछ हैक करने की ज़रूरत है, क्या मुझे याद आ रही चीजों को करने का एक बेहतर तरीका है?

Answer 1

समस्याओं के आसपास आपकी सोच बहुत सही लगता है। अपने यूआई घटकों को जितना संभव हो स्वयं निहित करें। UI घटक सर्वोत्तम प्रथाओं पर कुछ और जानकारी प्राप्त करने के लिए यह 10 min video देखें।

यदि आप जावास्क्रिप्ट एप्लिकेशन विकास की अन्य महत्वपूर्ण चिंताओं के बारे में रुचि रखते हैं, तो BoilerplateJS संदर्भ आर्किटेक्चर देखें जो मैंने अपने अनुभव साझा करने के लिए प्रकाशित किया था। जैसा कि आपने वर्णन किया है (घटक सक्रियण के साथ मेनू) में एक समान नमूना अनुप्रयोग शामिल है।

अपने UI घटक सक्रियण के लिए मेरी सिफारिशों, छोड़ना हैं:

• हटाने/डोम घटकों न बनाएं। छुपाएं/शो के साथ पुन: उपयोग करें, क्योंकि आपके तत्व डीओएम
• से हटाए जाने के बाद भी स्मृति में पढ़ेंगे, क्लाइंट पक्ष पर 'राज्य' जानकारी को कम से कम करें। जब कोई उपयोगकर्ता घटक का पुनरीक्षण करता है, तो उसे सर्वर कॉल के साथ रीफ्रेश करें और फिर इसे दृश्यमान बनाएं (सर्वर का उपयोग राज्य की जानकारी के एकल सत्य के रूप में करें)।

अधिक जानकारी के लिए BoilerplateJS नमूना घटक कार्यान्वयन देखें। मैं उन लोगों को जानता हूं जो बैकबोनजेएस के साथ इसका उपयोग करते हैं (वर्तमान में यह नॉकआउटजेएस के साथ जहाजों)। हम v0.2 में बैकबोनजेएस का उपयोग करके इसका एक उदाहरण भेज देंगे जो एक हफ्ते में है।

Answer 2

Marionette या Chaplin पर एक नज़र डालें। दोनों बैकबोन के शीर्ष पर बने हैं और बैकबोन के साथ बड़े एप्लिकेशन को बनाने के लिए एक संरचित तरीका प्रदान करते हैं।

Answer 3

बैकबोन के साथ संयोजन में उपयोग की जाने वाली एक सामान्य मॉड्यूलर स्क्रिप्ट लोडिंग फ्रेमवर्क की आवश्यकता होगी। जेएस। यह हो सकता है कि आप क्या खोज रहे हैं। Requ.js एएमडी मॉड्यूल, एसिंक्रोनस मॉड्यूल के बारे में सब कुछ है। आम तौर पर प्रत्येक मॉडल, संग्रह, दृश्य यह स्वयं का मॉड्यूल है जो विशिष्ट मॉड्यूल की निर्भरताओं को परिभाषित करता है, फिर आवश्यकतानुसार उन मॉड्यूल को लोड करता है। यह बड़ी परियोजनाओं के लिए विशेष रूप से उपयुक्त है जहां आपके पास कई अलग-अलग टुकड़े हैं जिन्हें आपके आवेदन के विभिन्न बिंदुओं पर एक साथ मिश-मैश किए जाने की आवश्यकता है।

आप निश्चित रूप से एक मॉड्यूल में एकाधिक रीढ़ की हड्डी तत्वों को जोड़ सकते हैं (आमतौर पर मैं इसे दृश्यों और विशिष्ट सबव्यूज़ के लिए आरक्षित करता हूं जो केवल मूल दृश्य के साथ उपयोग किया जाएगा) लेकिन यह वास्तव में आपके ऊपर है।

बैकबोन के साथ, आम तौर पर इरादा एकल पृष्ठ अनुप्रयोग बनाना है - जिसका अर्थ है कि सभी पृष्ठ मचान आमतौर पर एक फ़ाइल के रूप में लपेटा जाता है और पूरी तरह से क्लाइंट-साइड पर लोड हो जाता है। प्रत्येक पृष्ठ के लिए डेटा को AJAX के माध्यम से बुलाया जाता है और उपयोगकर्ता नेविगेट करता है और एप्लिकेशन के विभिन्न पहलुओं को लोड करता है। क्या यह आपके वर्णन में क्या है?

यदि आप अलग-अलग पृष्ठों को लोड करना चाहते हैं जो प्रत्येक व्यक्तिगत रूप से सर्वर बन गए हैं, तो मुझे यकीन नहीं है कि बैकबोन उत्तर है। अन्य सर्वर-साइड एमवीसी ढांचे हैं जो इसे पूरा करने में मदद करते हैं।

आम तौर पर इस प्रकार की चीज़ के लिए बैकबोन का उपयोग कैसे किया जाता है इस पर छूता है।

बैकबोन मॉडल और कैसे विस्तारित करने के लिए, बैकबोन अंडरस्कोर को निर्भरता के रूप में उपयोग करता है और अंडरस्कोर एक अच्छा _.extend() फ़ंक्शन प्रदान करता है जो आपकी सभी वस्तुओं को आसानी से किसी भी तरह से बढ़ा सकता है। मिक्स्डिन में फेंकने वाली डिफ़ॉल्ट कार्यक्षमता को ओवरराइड करना, बैकबोन जाने तक यह सब बहुत दर्द रहित है। एक ढांचे के रूप में, बैकबोन बहुत ही स्वीकार्य है जब यह हर छोटी और टुकड़े को बदलने, संशोधित करने और अनुकूलित करने की बात आती है।

उपयोगकर्ताओं को देखने और संशोधित करने वाले पृष्ठों को संभालने के लिए, Backbone.router आपको उन यूआरएल बनाने की अनुमति देता है जो न केवल आपके ऐप में विशिष्ट "पेज" को इंगित करते हैं बल्कि वहां पहुंचने के लिए मनमाने ढंग से कोड निष्पादित करने की आवश्यकता होती है। "Mysite/# account" पर जाने वाले उपयोगकर्ता में लॉग इन की तरह कुछ राउटर को उस स्क्रिप्ट को लोड करने के लिए ट्रिगर करेगा जो उस विशेष दृश्य को लाएगा और साथ ही fetch() आवश्यक डेटा को उपयोगकर्ता के लिए देखने और चलाने के लिए आवश्यक डेटा लाएगा।

मुझे यकीन नहीं है कि वहां संसाधन हैं जो आपको प्रारंभ करने के लिए किसी प्रकार की बुनियादी संरचना प्रदान करते हैं। मुझे लगता है कि ज्यादातर अनुभव "टोडो लिस्ट" जैसे बुनियादी ट्यूटोरियल के माध्यम से जाते हैं और वहां से अपना रास्ता बनाते हैं। मुझे यकीन नहीं है कि आपका अनुभव स्तर सामान्य रूप से जावास्क्रिप्ट या प्रोग्रामिंग के साथ क्या है लेकिन मैंने बैकबोन के साथ शुरुआत की और मुझे वास्तव में बहुत कुछ पता नहीं था। जेएसओएन क्या था और HTTP की निम्न स्तर की समझ के बारे में केवल एक अस्पष्ट धारणा है, "यह वह चीज है जो वेब पेज प्राप्त करती है।" उस ने कहा, मुझे लगता है कि बैकबोन मेरे साथ शुरू करने के लिए वास्तव में आसान था और यह मेरे ज्ञान को पूरे क्लाइंट-साइड रीस्टफुल टाइप ऐप स्ट्रक्चर के बारे में बहुत गहरा कर देता है।

बैकबोन और नॉकआउट और कुछ अन्य जैसे कई अलग-अलग स्वादों में "टोडो लिस्ट" ऐप में से वास्तव में अच्छी सूची है। ढांचे पर निर्णय लेने पर, मैं मूल रूप से उपलब्ध सभी अलग-अलग ढांचे की तुलना में उस कोड के माध्यम से चला गया और बैकबोन का चयन किया क्योंकि यह मुझे सबसे ज्यादा समझ में आता था। मुझे खेद नहीं है। यह बहुत मजेदार है और मुझे लगता है कि इसमें शामिल होने का सबसे अच्छा तरीका कुछ डेमो ट्यूटोरियल आज़माएं।

Answer 4

यहाँ backbonejs

http://backbonetutorials.com/organizing-backbone-using-modules/