सबक सीखा: AngularJS पर एक बड़ी परियोजना के साथ एक वर्ष

AngularJS पर एक बड़ी परियोजना के साथ काम करने के एक वर्ष के बाद, मैं इस प्रक्रिया में सीखे गए कुछ पाठों को साझा करने के बारे में सोच रहा हूँ। सबसे पहले, मुझे कोणीय पसंद है। यह मेरी जरूरतों को पूरी तरह से संतुष्ट करता है और, मुझे लगता है, यह पूरी तरह से भविष्य के भविष्य में बदल जाता है, जब मुझे एक-पृष्ठ "वसा ग्राहक" के लिए एक विश्वसनीय रूपरेखा की आवश्यकता होती है। वह कमाल है। एक विश्व स्तरीय टीम इस पर काम कर रही है, समुदाय शानदार है, और इसमें वेब अनुप्रयोगों के लिए कार्यों का एक पूरा संयोजन शामिल है (या समुदाय प्रदान करता है)।

कोड संगठन

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

  - परियोजना
 - नियंत्रक
 --- someController.js
 --- someOtherController.js
 --- ...
 --- someController99.js 

नियंत्रक के साथ एक फ़ोल्डर का एक उदाहरण मस्तिष्क बनाता है। मेरा नया नियम: यदि आपने किसी विशिष्ट फ़ाइल को खोजने के लिए अपने मन में वर्णमाला के माध्यम से छँटाई की है, तो संभवतः फ़ोल्डर में बहुत सारी फाइलें हैं।

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

क्लिफ मेयर्स ने एक बड़े कोणीय ऐप में कोड के आयोजन के बारे में एक शानदार लेख लिखा।

भयानक और शक्तिशाली निर्देश

अब मेरा विचार है कि निर्देशन कोणीय की हत्यारा विशेषता है । ये बहुत कम पैकेज हैं जिनमें UI तर्क होते हैं। HTML सिंटैक्स का विस्तार करने की क्षमता उन्हें बहुत लचीला और शक्तिशाली बनाती है। हम निश्चित रूप से निर्देशों का उपयोग करते हैं, लेकिन शायद जितनी बार हम कर सकते हैं उतनी बार नहीं।

कोणीय निर्देशों की पसंदीदा विशेषताओं में से एक लिंक करने की क्षमता है। उन्हें HTML विशेषताओं के रूप में सेट करके, आप मल्टीलेवल कार्यक्षमता के साथ जटिल विजेट बनाने के लिए निर्देशों का उपयोग कर सकते हैं। सिक्के का फ्लिप पक्ष समय-समय पर दिखाई देता है, जब कार्यात्मक स्तर एक-दूसरे के साथ प्रतिस्पर्धा करने की कोशिश करते हैं, लेकिन सामान्य तौर पर निर्देश अद्भुत हैं।

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

यदि आपने उनके बारे में कोई वीडियो नहीं देखा है, तो जॉन लिंडक्विस्ट के egghead.io पर जाएं और निर्देशों की एक श्रृंखला देखें। सभी वीडियो महान हैं और निर्देश के बारे में कहानी शिक्षाप्रद है।

अपने ढांचे को जानें

चूँकि मैंने इस परियोजना को शुरू किया था, इसलिए मैं निश्चित रूप से कुछ समय के लिए कोणीय की अंतड़ियों में खोदा था। स्रोत कोड को पढ़ना आसान है और अच्छी तरह से परीक्षण किया गया है, इसलिए उन लोगों के लिए जो जावास्क्रिप्ट को समझते हैं, पठन करना विस्मयकारी होगा ।

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

एक तरफ छोड़कर, मैं जिक्री के साथ ऐसा करने के लिए मजबूर महसूस करता हूं। इतना कोड, इतना कम समय।

सभा

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

अगर मैंने आज प्रोजेक्ट शुरू किया, तो मैंने निश्चित रूप से आसानी से टेम्पलेट बनाने और जीवन को आसान बनाने के लिए योमन का उपयोग किया।

सीएसएस

यह सीधे तौर पर एंगुलर से संबंधित नहीं है, लेकिन एंगुलर प्रोजेक्ट का एक और महत्वपूर्ण पहलू है, इसलिए मैं इस पर कुछ समय बिताना चाहूंगा।

मैं मानता हूं कि एक साल पहले मेरा रवैया "एफ सीएसएस" था (एफ एक ड्यूस है)। वह डर गया और मुझे इतनी घृणा के साथ ले आया। जाहिर है, यह अज्ञानता से उपजा है, और मैंने पिछले साल सीएसएस लेआउट के साथ खेलने की कोशिश की। मेरा रवैया अब "f CSS" नहीं है और "SCSS" (एस ट्रिपल है) की तरह लगता है क्योंकि मुझे एक जगह मिली जहां सीएसएस और मैं बाद में कभी भी खुश रह सकते हैं।

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

भविष्य में मैं SASS / कम्पास में गहराई से तल्लीन करना चाहता हूं, उपरोक्त वर्णित कोणीय में काम के मॉड्यूलर और घटक स्तर के साथ अपनी अभिव्यंजक शैली क्षमताओं का संयोजन। मैं स्टाइल शीट के लिए एक अधिक संगठित दृष्टिकोण का उपयोग करना चाहूंगा , बहुत कुछ एसएमएसीएसएस की तरह एक बुनियादी मानक प्रदान करता है जो बताता है कि शैलियों को कैसे काम करना और व्यवस्थित करना है।

फिलहाल, सीएसएस और मैंने पूरी तरह से सामंजस्य स्थापित किया है। मैंने अपनी अज्ञानता को दूर किया है, जो स्पष्ट रूप से, मजबूत रिश्ते बनाने की कुंजी बन गई है। हम देखेंगे कि यह कैसे जाता है। एक बार की बात है।

निष्कर्ष

यदि आप एक-पेज का वेब अनुप्रयोग बना रहे हैं, तो कोणीय एक अच्छा विकल्प है। जितनी जल्दी हो सके आवेदन की संरचना पर निर्णय करना महत्वपूर्ण है। अपने कोड को मॉड्यूल और घटकों में तोड़ने का निर्णय लें ताकि आप निर्देशों की पूरी शक्ति का उपयोग कर सकें और पुन: उपयोग की क्षमता को अधिकतम कर सकें।

यदि आप चर्चा में भाग लेना चाहते हैं तो आप हैकर न्यूज़ के लेख पर टिप्पणी छोड़ सकते हैं।

PS एक रूसी भाषी दर्शकों के लिए, टिप्पणियाँ, निश्चित रूप से, यहाँ :-)
पीपीएस मूल लेख