लक्ष्य

यह बॉयलरप्लेट एक्सटेंशन डेवलपर्स को मेनिफेस्ट V3 का उपयोग करके अपने स्वयं के क्रोम एक्सटेंशन बनाने के लिए एक प्रारंभिक बिंदु प्रदान करता है।

नया क्या है

इस संस्करण में सबसे बड़ा सुधार एक पॉपअप इंटरफ़ेस को जोड़ना है। अब, जब उपयोगकर्ता ब्राउज़र के शीर्ष बार में एक्सटेंशन बटन पर क्लिक करते हैं, तो उन्हें कंसोल पर एक संदेश लॉग करने के बजाय एक इंटरैक्टिव पॉपअप प्रस्तुत किया जाता है।

विशेषताएँ

यह बॉयलरप्लेट तीन प्रमुख विस्तार व्यवहार प्रदर्शित करता है:

1. पेज लोड होने से पहले: पेज लोड होने से पहले DevTools कंसोल पर एक संदेश प्रिंट करें।
2. पेज लोड होने के बाद: पेज लोड होने से पहले DevTools कंसोल पर एक संदेश प्रिंट करें।
3. पॉपअप इंटरैक्शन: जब उपयोगकर्ता एक्सटेंशन बटन पर क्लिक करता है तो एक पॉपअप प्रदर्शित होता है, जिससे अधिक जटिल उपयोगकर्ता इंटरैक्शन की अनुमति मिलती है।

एक्सटेंशन अब पॉपअप के भीतर एक बटन प्रदान करता है, जिस पर क्लिक करने पर, DOM को संशोधित करने और कंसोल पर एक संदेश लॉग करने के लिए सक्रिय टैब में एक स्क्रिप्ट इंजेक्ट करता है।

इंस्टालेशन

1. github.com/llagerlof/fresh-chrome-extension से फ़ाइलों को क्लोन करें या डाउनलोड करें और उन्हें एक निर्देशिका में रखें।
2. अपने ब्राउज़र का एक्सटेंशन पृष्ठ खोलें: chrome://extensions
3. ऊपरी दाएं कोने में "डेवलपर मोड" सक्षम करें।
4. लोड अनपैक्ड पर क्लिक करें और एक्सटेंशन निर्देशिका का चयन करें।

इसका परीक्षण कैसे करें

1. कोई भी वेबसाइट खोलें।
2. ब्राउज़र के शीर्ष बार पर एक्सटेंशन बटन पर क्लिक करें। आपको एक बटन के साथ एक पॉपअप दिखाई देगा।
3. "पेज पर एक नारंगी डिव जोड़ने के लिए इस बटन पर क्लिक करें" लेबल वाले पॉपअप में बटन पर क्लिक करें।
4. निम्नलिखित परिवर्तनों पर गौर करें:
   • पृष्ठ के शीर्ष पर "DOM संशोधित!" संदेश के साथ एक नारंगी div दिखाई देता है।
   • डेवलपर टूल्स (F12) खोलें और कंसोल देखें। आपको "पॉपअप से क्रियान्वित कार्रवाई!" संदेश दिखाई देगा।

यह बॉयलरप्लेट अधिक जटिल क्रोम एक्सटेंशन बनाने के लिए एक ठोस आधार प्रदान करता है। अपनी विशिष्ट आवश्यकताओं के अनुरूप इसे बेझिझक संशोधित और विस्तारित करें।

हैप्पी कोडिंग!