JsonDiscovery: JSON को एक ब्राउज़र में देखने का अनुभव बदलना

आज मैं JSONDiscovery के बारे में बात करना चाहता हूं , JSON देखने के लिए एक ब्राउज़र एक्सटेंशन। शायद आप कहेंगे: "हमारे पास इतने ही विस्तार हैं!" हां, यह पूर्ण है, लेकिन JsonDiscovery की विशेषताएं इसे दूसरों से अलग करती हैं और इसे वास्तव में शक्तिशाली बनाती हैं।

आइए नजर डालें ...

प्रदर्शनों के लिए, मैंने हार्ट्सस्टोन-डीबी परियोजना (विचार के लिए ओल्गा कोबेट्स के लिए धन्यवाद) से सभी कार्डों के संग्रह के लिए JSON फ़ाइल का उपयोग किया। और यहाँ यह दिखता है कि यदि आप इसे किसी ब्राउज़र में खोलते हैं तो JsonDiscovery स्थापित है:

पहली नज़र में, यह सिर्फ एक और JSON पेंटब्रश है। ऐसा इसलिए है क्योंकि अधिकांश सुविधाएँ सतह पर नहीं हैं, इसलिए आपको अपने JSON से विचलित नहीं करना है। आइए उन्हें प्रकट करें:

• क्लिपबोर्ड में आसान कॉपी JSON के टुकड़े
• JSON संरचना हस्ताक्षर
• JSON को एक अनुरोध के साथ बदलना
• JSON अनुरोध लिखने के लिए सुझाव
• JSON से डेटा डिस्प्ले सेट करना
• लिंक पर "रिपोर्ट" साझा करना

हम प्रत्येक आइटम पर अधिक विस्तार से विचार करते हैं।

क्लिपबोर्ड में आसान कॉपी JSON के टुकड़े

ऐसा होता है कि आपको JSON के टुकड़े की नकल करने की आवश्यकता होती है, अर्थात, कुछ नेस्टेड ऑब्जेक्ट या सरणी। JsonDiscovery के साथ, यह एक सरल कार्य है, क्योंकि प्रत्येक तैनात ऑब्जेक्ट और सरणी में एक्शन बटन होते हैं। उनमें से एक "ƒ" बटन है, जिस पर क्लिक करके आप JSON को एक कॉम्पैक्ट या स्वरूपित रूप में कॉपी कर सकते हैं:

JSON संरचना हस्ताक्षर

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

आप कुछ विवरण प्राप्त करने के लिए संरचना हस्ताक्षर में एक संपत्ति या मूल्य के प्रकार को भी इंगित कर सकते हैं, उदाहरण के लिए, फ़ील्ड के लिए किन मूल्यों का उपयोग किया गया था:

JSON अनुरोध

"रिपोर्ट बनाएं" बटन पर क्लिक करने से आप एक ऐसे पृष्ठ पर पहुँच जाते हैं जहाँ आप अपने JSON से अनुरोध कर सकते हैं और / या इसके प्रदर्शन को कॉन्फ़िगर कर सकते हैं:

प्रश्नों के लिए, जोरा भाषा का उपयोग किया जाता है । यह आंशिक रूप से जावास्क्रिप्ट 2015+ के सिंटैक्स पर आधारित है, लेकिन अधिक हद तक, यह कॉम्पैक्ट और अधिक (डेटा क्वेरी कार्य के भाग के रूप में) व्यक्त करने का इरादा है।

आमतौर पर आपको केवल foo.bar.baz जैसे कुछ पथ का उपयोग करके डेटा के सबसेट का चयन करना होगा। यदि कुंजी ने वर्णों को निषिद्ध किया है, तो बस [] (वर्ग कोष्ठक) का उपयोग करें, अर्थात, foo['a key with whitespaces'] । सब कुछ जावास्क्रिप्ट की तरह है, सिवाय इसके कि आपको कोई चिंता नहीं है कि कोई रास्ता है या नहीं:

अक्सर फ़िल्टरिंग या मैपिंग का उपयोग करना आवश्यक होता है। जोरा प्रदान करता है .[] छानने के लिए और .() मानचित्रण के लिए:

ऊपर स्क्रीनशॉट में उदाहरण ( cards.[health].({ name, health }) जावास्क्रिप्ट में इस तरह लिखा जा सकता है:

 cards.filter($ => $.health).map($ => ({ name: $.name, health: $.health })) 

जो बहुत अधिक क्रिया है, है ना?

आप Jora के बारे में और इसके सिंटैक्स के बारे में इसके github भंडार में और अधिक जानकारी प्राप्त कर सकते हैं। (वैसे, इसमें एक CLI और सैंडबॉक्स भी है )

JSON अनुरोध लिखने के लिए सुझाव

इस सुविधा का सही वर्णन नहीं किया जा सकता है। आपको खुद इसे आजमाने की जरूरत है। कम से कम एक बार:

डेटा डिस्प्ले सेटिंग्स

जब आपने JSON से आवश्यक डेटा का चयन किया है, तो आप इसके प्रदर्शन को कॉन्फ़िगर कर सकते हैं। उदाहरण के लिए, उन्हें एक तालिका या सूची में प्रदर्शित करें, जैसे:

दुर्भाग्य से, इस समय मानचित्रण का वर्णन करने के तरीके के बारे में पर्याप्त दस्तावेज नहीं है (जो सब पाया जा सकता है वह खोज में पाया जा सकता है। जेएस भंडार )। लेकिन मेरा मानना ​​है कि यह निकट भविष्य में तय हो जाएगा।

लिंक पर "रिपोर्ट" साझा करना

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

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