🏎️ ⌨️ 🙅 हर वेब डेवलपर द्वारा आवश्यक ब्राउज़र एक्सटेंशन 👨🏾‍🚀 👨🏼‍🎓 🤠

आधुनिक ब्राउज़र न केवल महान वेब ब्राउज़िंग ऐप हैं।

ब्राउज़र्स भी ऐसे प्लेटफ़ॉर्म हैं जो वेब डेवलपर्स को बढ़िया साइट्स बनाने में मदद करने के लिए एक टन का आसान टूल प्रदान करते हैं। डेवलपर के निपटान में, अंतर्निहित टूल के अलावा, बड़ी संख्या में ब्राउज़र एक्सटेंशन होते हैं। लेख के लेखक, जिसका अनुवाद आज हम प्रकाशित कर रहे हैं, ने अपनी राय में, सर्वश्रेष्ठ का चयन किया है, जो विभिन्न प्रकार के कार्यों का सामना करने में प्रोग्रामर की मदद करने के लिए डिज़ाइन किए गए एक्सटेंशन हैं। ये मुख्य रूप से Google Chrome के लिए एक्सटेंशन हैं।

प्रतिक्रिया / Redux और Vue.js के लिए विकास उपकरण

रिएक्ट और Vue.js प्रसिद्ध फ्रंट-एंड डेवलपमेंट टूल्स हैं। यथासंभव कुशलता से उनके साथ काम करने के लिए, यह उपयुक्त ब्राउज़र एक्सटेंशन स्थापित करने के लायक है। रिएक्टर डेवलपर टूल

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

रिएक्टर डेवलपर टूल

यदि आप एप्लिकेशन की स्थिति के साथ काम करते समय किसी भी समस्या का सामना करते हैं, तो Redux DevTools एक्सटेंशन आपकी सहायता के लिए आ सकता है। इसका उपयोग उन राज्यों के साथ काम करने के लिए किया जा सकता है जो अलग-अलग तरीकों से व्यवस्थित होते हैं; यह Redux के साथ उपयोग किए जाने पर विशेष रूप से अच्छी तरह से काम करता है। वैसे, यहां आपके लिए एक टिप है। इस एक्सटेंशन को इंस्टॉल करें और airbnb.com जैसी साइट पर जाएं। यह React / Redux का उपयोग करता है, इसलिए आप Redux DevTools की मदद से यह पता लगा पाएंगे कि इस साइट पर पृष्ठों की स्थिति का प्रबंधन कैसे किया जाता है। मेरे लिए - तो यह बहुत जानकारीपूर्ण है।

Vue.js devtools React Developer Tools के समान है, लेकिन Vue.js. के लिए Vue घटकों को डीबग करने के लिए यह एक्सटेंशन बहुत सुविधाजनक है और उन सभी के लिए उपयोगी है जो इस ढांचे का उपयोग करते हैं।

Vue.js devtools

Jsonview

क्या आपने कभी इस विचार को पकड़ा है कि अन्य प्रोग्रामर के ब्राउज़रों में JSON डेटा स्पष्ट और सटीक दिखता है, लेकिन आपका नहीं? शायद पूरी बात यह है कि अन्य लोग JSONView एक्सटेंशन का उपयोग करते हैं । यह एक्सटेंशन बहुत जल्दी और सटीक रूप से JSON डेटा को प्रारूपित करता है। JSONView निश्चित रूप से मेरे पसंदीदा ब्राउज़र एक्सटेंशन में से एक है।

Jsonview

लाइब्रेरी स्निफर

लाइब्रेरी स्निफ़र किसी के लिए भी एक महान उपकरण है जो जल्दी से पता लगाना चाहता है कि वे कौन से उपकरण, पुस्तकालय या ढांचे का उपयोग उन पृष्ठों को बनाने के लिए करते थे जो वे देखते हैं। उदाहरण के लिए, लाइब्रेरी स्निफर की सहायता से, आप यह पता लगा सकते हैं कि साइट किसके साथ बनाई गई थी: वर्डप्रेस, ड्रुपल, रिएक्ट, Vue.js, AngularJS ...

लाइब्रेरी स्निफर

सीएसएस स्कैन 2.0

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

CSS स्कैन 2.0

इस विस्तार में एक मुफ्त विकल्प है - CSS Peeper । यह मुख्य रूप से डिजाइनरों के लिए बनाया गया है, न कि कोड लिखने वालों के लिए।

वेब डेवलपर

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

वेब डेवलपर

Whatfont

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

Whatfont

ColorZilla

ColorZilla विस्तार Chrome और Firefox दोनों में इस्तेमाल किया जा सकता है। यह रंग प्रमाण लेने के लिए उपकरण प्रदान करता है, रंग चुनने के लिए एक उपकरण, रंग के साथ काम करने के लिए एक ढाल जनरेटर और अन्य उपयोगी उपकरण। उदाहरण के लिए, आप इसका उपयोग यह पता लगाने के लिए कर सकते हैं कि किसी वेब पेज में किसी भी पिक्सेल का क्या रंग है। यह रंग के साथ काम करने के इतिहास को संग्रहीत करता है और इसमें पट्टियाँ देखने के लिए एक उपकरण होता है।

ColorZilla

स्पेक्ट्रम

सामग्री की पहुंच आधुनिक वेब विकास का एक महत्वपूर्ण पहलू है। तथ्य यह है कि कई लोगों के पास वेब पेजों के साथ बातचीत करने की सीमित क्षमता है। ऐसी ही एक सीमा है कलर विजन डेफिसिएंसी (CVD)। यह एक व्यक्ति की कुछ रंगों को अलग करने की क्षमता को प्रभावित करता है। स्पेक्ट्रम एक्सटेंशन आपको विभिन्न प्रकार के सीवीडी वाले लोगों के लिए उनकी उपयुक्तता के लिए अनुसंधान साइटों की अनुमति देता है।

स्पेक्ट्रम

साइट पैलेट

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

साइट पैलेट

टोबी

टोबी एक्सटेंशन को ब्राउज़र टैब को इस तरह से व्यवस्थित करने के लिए डिज़ाइन किया गया है कि काम के दौरान आपको बड़ी संख्या में टैब को खुला नहीं रखना पड़ेगा। यह एक प्रकार का टैब कंट्रोल पैनल है जो माउस के साथ प्रयोग करना आसान है। यह विस्तार वेब डेवलपर की उत्पादकता को सकारात्मक रूप से प्रभावित कर सकता है।

टोबी

एपीआई एपीआई परीक्षक

टैलेंड एपीआई टेस्टर एक बेहतरीन एक्सटेंशन है जो आपको विभिन्न एपीआई वाले ब्राउज़र से काम करने की अनुमति देता है। ये REST, SOAP और HTTP तकनीकों पर आधारित API हो सकते हैं। यह समान है, उदाहरण के लिए, पोस्टमैन के लिए। एक्सटेंशन का मुफ्त संस्करण सभी प्रकार के HTTP अनुरोधों, सुरक्षित डेटा एक्सचेंज, प्रमाणीकरण के निष्पादन का समर्थन करता है।

एपीआई एपीआई परीक्षक

फुल पेज स्क्रीन कैप्चर

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

फुल पेज स्क्रीन कैप्चर

सारांश

हमने वेब डेवलपर्स के लिए लगभग एक दर्जन ब्राउज़र एक्सटेंशन की समीक्षा की। हम आशा करते हैं कि आप उनके बीच कुछ ऐसा पाएंगे जो आपके लिए उपयोगी है।

प्रिय पाठकों! वेब विकास के लिए आप कौन से ब्राउज़र एक्सटेंशन का उपयोग करते हैं?

हर वेब डेवलपर द्वारा आवश्यक ब्राउज़र एक्सटेंशन