वेब डिजाइनर और डेवलपर्स के लिए नए संसाधन (अप्रैल 2018)
इस महीने हमने टेक में उल्लेखनीय नामों से कुछ घोषणाएं देखीं। उदाहरण के लिए, Apple ने एक नया डेटाबेस सिस्टम ओपन किया, Google ने मोबाइल पर आपकी वेबसाइट की गति को मापने के लिए एक नया टूल जारी किया, और Gitub को एक मुफ्त कोर्स के साथ आपको Git, Github और कोडिंग के साथ शुरू किया।.
इसके अलावा, आज की पोस्ट में, मैं भी करूँगा वर्तमान में बढ़ रहे हैं कि कई नए उपकरणों की सुविधा. आइए सूची में हमारे पास और अधिक होने के लिए कूदें.
VuePress
Vue के निर्माता से एक नया उपकरण, VuePress a है स्थैतिक साइट जनरेटर मन में Vue.js के साथ बनाया गया है। यह प्रत्येक पृष्ठ के लिए स्थिर HTML उत्पन्न और प्रदान करता है, और एसपीए (सिंगल-पेज एप्लिकेशन) के रूप में चलता है. यह कुछ विशेषताओं के साथ आता है जिसमें Google Analytics ID जोड़ने की क्षमता है, खोज, अगला और मौजूदा नेविगेशन, साइडबार, और PWA.

आईएमजी-2
एक जावास्क्रिप्ट पुस्तकालय जो एक परिचय देता है कस्टम तत्व, img-2
. नया तत्व कई अनुकूलन जोड़ता है जो मानक के साथ नहीं आते हैं img
तत्त्व, उपयोगकर्ताओं के लिए छवि कैसे भरी हुई है, इसे सुधारना. कस्टम तत्व के साथ, छवि पूर्व-कैश्ड होगी, यह भी हल्का भार छवियां और सेवा केवल कैशे से होगी क्योंकि छवियां उपयोगकर्ता के व्यूपोर्ट में प्रवेश करती हैं। डेमो देखें.

Tabler
एक सुरुचिपूर्ण डैशबोर्ड / व्यवस्थापक पैनल बूटस्ट्रैप 4 पर आधारित. डैशबोर्ड में चार्ट, फॉर्म, गैलरी, एक मूल्य निर्धारण तालिका और एक अच्छा जैसे पूर्व-निर्मित घटक हैं कस्टम प्रतीक का संग्रह. डेवलपर्स को जल्दी से एक व्यवस्थापक पैनल बनाने की अनुमति देने के लिए एक महान प्रारंभिक बिंदु। डेमो देखें!

DayJS
DayJS जावास्क्रिप्ट लाइब्रेरी दिनांक और समय को प्रारूपित करने के लिए. इससे भी अधिक, DayJS ने मोमेंट.जेएस के समान एपीआई की सुविधा प्रदान की है, फिर भी यह आकार में केवल 2kb वजन है। यह देखते हुए, यह एक हो सकता है Moment.js के लिए बढ़िया विकल्प, यदि आप लाइटर लाइब्रेरी चाहते हैं, तो अभी तक जो आपने पहले से जाना है, उसकी परिचितता बनाए रखें.

UnifiedArchive
संपीड़ित फ़ाइलों से निपटने के लिए एक PHP लाइब्रेरी, यूनिफाइडअर्चिव सहित कई प्रकार के प्रारूपों का समर्थन करता है आरएआर, जिप, गज़िप, टार, और कई अन्य संपीड़न प्रकार। इस लाइब्रेरी के साथ, आप फ़ाइलों या निर्देशिकाओं को संग्रहीत और निकाल सकते हैं। यह एक प्रदान करता है फ़ाइलों में हेरफेर करने के लिए मुट्ठी भर एपीआई संग्रह से निकाले जाने के बाद। UnifiedArchive एक संगीतकार पैकेज के रूप में उपलब्ध है.

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

वर्डप्रेस यूनिटटेस्ट डोम पार्सर
Takayuki Miyauchi से एक अच्छी टिप वर्डप्रेस अनुप्रयोगों में यूनिटटेस्ट का प्रदर्शन करते समय डोनेमेंट का परीक्षण करना. मैंने व्यक्तिगत रूप से इसे वास्तव में उपयोगी पाया; आशा है कि आप इसे वैसा ही पाएंगे.

Popmotion
वेब पर एक मक्खन चिकनी एनीमेशन के लिए एक जावास्क्रिप्ट पुस्तकालय, “Popmotion” भौतिक विज्ञान नामक एक एपीआई प्रदान करता है जो आपको निकट वास्तविक जीवन एनीमेशन प्रभावों के साथ बनाने की अनुमति देता है। यह अनोपिनी है; बस पुस्तकालय कॉन्फ़िगरेशन के विशिष्ट सेट के आधार पर आउटपुट मान. यह आपको उन आउटपुट को CSS, SVG, Three.js और यहां तक कि React.js सहित किसी भी माध्यम को चेतन करने की अनुमति देता है.

Driver.js
एक जावास्क्रिप्ट पुस्तकालय जो आपको अनुमति देता है “चलाना” उपयोगकर्ता एक पृष्ठ पर ध्यान केंद्रित करता है. यह विशेष रूप से उपयोगी है यदि आप विशिष्ट सुविधाओं को पेश करना चाहते हैं या उन्हें पृष्ठ पर विशिष्ट कार्यों के लिए मार्गदर्शन करना चाहते हैं। Driver.js बस है 4 KB आकार में, अनुकूलन योग्य और कीबोर्ड के अनुकूल है.

एनिमेटेड GIF को वीडियो से बदलें
हर जगह शानदार वापसी करने के बाद GIF हर जगह है। लेकिन GIF के बारे में समस्या यह है कि यह आमतौर पर बहुत बड़ा है। यह बैंडविड्थ की बर्बादी है, फिर भी ग्राफिक गुणवत्ता अक्सर भयानक होती है। इस Google की गाइडलाइन से पता चलता है कि कैसे “वीडियो” एनिमेटेड ग्राफिक्स दिखाने के लिए GIF की जगह ले सकते हैं.

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

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

VueNut
Vue.js और Vuex के साथ एक वेब एप्लिकेशन बनाते समय एक विकास साथी, VueNut इसे बनाता है संग्रहीत डेटा स्थिति का पता लगाना आसान है और आप आसानी से विकास के दौरान डेटा में हेरफेर करने की अनुमति देता है। सुन्दर सामान!

FoundationDB
हाल ही में Apple ने गितुब में FoundationDB खुला स्रोत बनाया। यह है की-वैल्यू पेयर डेटाबेस सिस्टम यह स्केलेबिलिटी और प्रदर्शन का वादा करता है। यह बड़ी टेक कंपनियों को अपने कुछ उत्पादों को खोलने के लिए समर्पित करने के लिए शुरू करने के लिए अच्छा है.

कहानी की पुस्तकें
StoryBooks एक उपकरण है अलगाव में एक प्रतिक्रिया घटक का निर्माण. यह ब्राउज़र पर एक यूआई प्रदान करता है जिससे आप प्रत्येक घटक के विभिन्न राज्यों को देख सकते हैं घटकों का परीक्षण करें.

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

COALA
कोला एक है सीएलआई उपयोग किए गए भाषाओं की परवाह किए बिना कोडिंग और फिक्सिंग कोड के लिए एक इंटरफ़ेस प्रदान करता है. आप एक कोड संपादक के भीतर कोअला का उपयोग कर सकते हैं, इसे एक CI (निरंतर एकीकरण) के साथ एकीकृत कर सकते हैं, और इसमें एक विन्यास वाक्य विन्यास के साथ इसे अनुकूलित कर सकते हैं .coafile
. कोअला कई भाषाओं जैसे सीएसएस, जावास्क्रिप्ट, पीएचपी का समर्थन करता है, और आप इस निर्देशिका में अधिक पा सकते हैं.

ReactStrap
ReactStrap बूटस्ट्रैप 4 घटकों का एक संग्रह है जो पुन: प्रयोज्य प्रतिक्रिया घटकों में बदल जाता है। यदि आप अपनी पुरानी बूटस्ट्रैप-आधारित वेबसाइट का आधुनिकीकरण करना चाहते हैं, तो यह पुस्तकालय कुछ ऐसा है जिसे आप देखना चाहते हैं.

Reacto
एक अन्य रिएक्ट से संबंधित उपकरण, रिएक्टो एक है IDE इलेक्ट्रॉन के ऊपर बनाया गया है और ReactJS के साथ वेब एप्लिकेशन विकसित करने के लिए डिज़ाइन किया गया है. यह वास्तव में आसान लगता है यदि आपका विकास प्राथमिक ReactJS के चारों ओर घूमता है.

PicoJS
एक जावास्क्रिप्ट पुस्तकालय कि चेहरे का पता लगाने में सक्षम बनाता है. यह स्टिल फोटो के साथ या इंटीग्रेटेड कैमरा से काम करता है। यह वास्तव में आकर्षक है कि वेब प्रौद्योगिकी पिछले कुछ वर्षों में कैसे विकसित हुई है.
