|
|
# रूटिंग में सुधार करें
|
|
|
|
|
|
## निर्देश
|
|
|
|
|
|
अब जब आपने एक बुनियादी रूटिंग सिस्टम बना लिया है, तो इसे पेशेवर सुविधाओं के साथ बेहतर बनाने का समय आ गया है जो उपयोगकर्ता अनुभव में सुधार करते हैं और बेहतर डेवलपर टूल प्रदान करते हैं। असली दुनिया के अनुप्रयोगों को केवल टेम्प्लेट स्विचिंग से अधिक की आवश्यकता होती है – उन्हें गतिशील पृष्ठ शीर्षक, लाइफसाइकल हुक, और विस्तारणीय आर्किटेक्चर चाहिए होते हैं।
|
|
|
|
|
|
इस असाइनमेंट में, आप अपनी रूटिंग कार्यान्वयन को दो आवश्यक सुविधाओं के साथ बढ़ाएंगे जो आमतौर पर उत्पादन वेब अनुप्रयोगों में पाई जाती हैं। ये सुधार आपके बैंकिंग ऐप को अधिक परिष्कृत महसूस करवाएंगे और भविष्य की कार्यक्षमता के लिए एक आधार प्रदान करेंगे।
|
|
|
|
|
|
रूट्स घोषणा में वर्तमान में केवल उपयोग करने के लिए टेम्प्लेट आईडी शामिल है। लेकिन जब नया पृष्ठ दिखाया जाता है, तो कभी-कभी थोड़ा और कुछ आवश्यक होता है। आइए हमारी रूटिंग कार्यान्वयन को दो अतिरिक्त सुविधाओं के साथ सुधारें:
|
|
|
|
|
|
### सुविधा 1: गतिशील पृष्ठ शीर्षक
|
|
|
**उद्देश्य:** प्रत्येक टेम्प्लेट को शीर्षक दें और टेम्प्लेट बदलने पर विंडो शीर्षक को इस नए शीर्षक के साथ अपडेट करें।
|
|
|
|
|
|
**इसका महत्त्व क्यों है:**
|
|
|
- **बेहतर** उपयोगकर्ता अनुभव लिए वर्णनात्मक ब्राउज़र टैब शीर्षक दिखाकर
|
|
|
- **एक्सेसिबिलिटी** बढ़ाता है स्क्रीन रीडर्स और सहायक तकनीकों के लिए
|
|
|
- **बेहतर** बुकमार्किंग और ब्राउज़र इतिहास संदर्भ प्रदान करता है
|
|
|
- **पेशेवर** वेब विकास सर्वोत्तम प्रथाओं का पालन करता है
|
|
|
|
|
|
**कार्यान्वयन तरीका:**
|
|
|
- **रूट्स ऑब्जेक्ट** को प्रत्येक रूट के लिए शीर्षक जानकारी शामिल करने के लिए बढ़ाएँ
|
|
|
- `updateRoute()` फ़ंक्शन को संशोधित करें ताकि वह `document.title` को गतिशील रूप से अपडेट करे
|
|
|
- यह सुनिश्चित करें कि स्क्रीनों के बीच नेविगेट करते समय शीर्षक सही तरीके से बदलें
|
|
|
|
|
|
### सुविधा 2: रूट लाइफसाइकल हुक्स
|
|
|
**उद्देश्य:** टेम्प्लेट बदलने के बाद कुछ कोड चलाने का विकल्प जोड़ें। हम चाहते हैं कि जब भी डैशबोर्ड पृष्ठ दिखाया जाए, तो डेवेलपर कंसोल में `'Dashboard is shown'` प्रदर्शित हो।
|
|
|
|
|
|
**इसका महत्त्व क्यों है:**
|
|
|
- **विशिष्ट रूट लोड होने पर** कस्टम लॉजिक निष्पादन सक्षम करता है
|
|
|
- **एनालिटिक्स, लॉगिंग, या आरंभिककरण कोड** के लिए हुक प्रदान करता है
|
|
|
- **अधिक जटिल रूट व्यवहारों के लिए** आधार तैयार करता है
|
|
|
- **वेब विकास में ऑब्जर्वर पैटर्न** को प्रदर्शित करता है
|
|
|
|
|
|
**कार्यान्वयन तरीका:**
|
|
|
- रूट कॉन्फ़िगरेशन में वैकल्पिक कॉलबैक फ़ंक्शन प्रॉपर्टी जोड़ें
|
|
|
- टेम्प्लेट रेंडरिंग पूरा होने के बाद कॉलबैक फ़ंक्शन (अगर मौजूद हो) को निष्पादित करें
|
|
|
- सुनिश्चित करें कि यह सुविधा किसी भी रूट के लिए काम करे जिसमें कॉलबैक परिभाषित हो
|
|
|
- परीक्षण करें कि जब डैशबोर्ड पर जाएं तो कंसोल संदेश दिखाई दे
|
|
|
|
|
|
## मूल्यांकन मापदंड
|
|
|
|
|
|
| मापदंड | उत्कृष्ट | पर्याप्त | सुधार की आवश्यकता |
|
|
|
| ------- | -------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------- |
|
|
|
| | दोनों सुविधाएँ लागू हैं और काम कर रही हैं। शीर्षक और कोड जोड़ना नए रूट पर भी कार्य करता है जो `routes` घोषणा में जोड़ा गया है। | दोनों सुविधाएँ काम करती हैं, लेकिन व्यवहार हार्डकोडेड है और `routes` घोषणा के माध्यम से कॉन्फ़िगर नहीं किया जा सकता। तीसरा रूट शीर्षक और कोड जोड़ने के साथ जोड़ना काम नहीं करता या आंशिक रूप से काम करता है। | इनमें से एक सुविधा गायब है या सही तरीके से काम नहीं कर रही। |
|
|
|
|
|
|
---
|
|
|
|
|
|
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
|
|
|
**अस्वीकरण**:
|
|
|
इस दस्तावेज़ का अनुवाद AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) का उपयोग करके किया गया है। जबकि हम सटीकता के लिए प्रयासरत हैं, कृपया ध्यान दें कि स्वचालित अनुवादों में त्रुटियाँ या गलतियां हो सकती हैं। मूल दस्तावेज़ अपनी मूल भाषा में ही आधिकारिक स्रोत माना जाना चाहिए। महत्वपूर्ण जानकारी के लिए पेशेवर मानव अनुवाद की सिफारिश की जाती है। इस अनुवाद के उपयोग से उत्पन्न किसी भी गलतफहमी या गलत व्याख्या के लिए हम उत्तरदायी नहीं हैं।
|
|
|
<!-- CO-OP TRANSLATOR DISCLAIMER END --> |
