Addyosmani Skills

WCAG 2.2 दिशानिर्देशों का पालन करते हुए वेब पहुंच का ऑडिट और सुधार करें। इसका उपयोग तब करें जब "पहुंच में सुधार करें", "a11y ऑडिट", "WCAG अनुपालन", "स्क्रीन रीडर समर्थन", "कीबोर्ड नेविगेशन", या "सुलभ बनाएं" के लिए कहा जाए।

Guides stable API and interface design. Use when designing APIs, module boundaries, or any public interface. Use when creating REST or GraphQL endpoints, defining type contracts between modules, or establishing boundaries between frontend and backend.

आधुनिक वेब विकास की सर्वोत्तम प्रथाओं को सुरक्षा, अनुकूलता और कोड गुणवत्ता के लिए लागू करें। जब "सर्वोत्तम प्रथाएँ लागू करें", "सुरक्षा ऑडिट", "कोड को आधुनिक बनाएँ", "कोड गुणवत्ता समीक्षा" या "कमजोरियों की जाँच करें" के लिए कहा जाए तो इसका उपयोग करें।

वास्तविक ब्राउज़रों में Chrome DevTools MCP के माध्यम से परीक्षण करता है। ब्राउज़र में चलने वाली किसी भी चीज़ को बनाते या डीबग करते समय उपयोग करें। जब आपको DOM का निरीक्षण करना, कंसोल त्रुटियों को कैप्चर करना, नेटवर्क अनुरोधों का विश्लेषण करना, प्रदर्शन प्रोफाइल करना, या वास्तविक रनटाइम डेटा के साथ दृश्य आउटपुट सत्यापित करना हो, तब उपयोग करें। chrome-devtools MCP सर्वर को कॉन्फ़िगर करना आवश्यक है।

CI/CD पाइपलाइन सेटअप को स्वचालित करता है। बिल्ड और डिप्लॉयमेंट पाइपलाइन सेट करते या संशोधित करते समय उपयोग करें। जब आपको क्वालिटी गेट्स को स्वचालित करना हो, CI में टेस्ट रनर कॉन्फ़िगर करना हो, या डिप्लॉयमेंट रणनीतियाँ स्थापित करनी हों, तब उपयोग करें।

बहु-आयामी कोड समीक्षा करता है। किसी भी बदलाव को मर्ज करने से पहले उपयोग करें। अपने, किसी अन्य एजेंट या मानव द्वारा लिखे गए कोड की समीक्षा करते समय उपयोग करें। जब आपको मुख्य शाखा में प्रवेश करने से पहले कई आयामों पर कोड गुणवत्ता का आकलन करने की आवश्यकता हो, तब उपयोग करें।

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

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

बेहतर पेज अनुभव और सर्च रैंकिंग के लिए कोर वेब वाइटल्स (LCP, INP, CLS) को ऑप्टिमाइज़ करें। जब "कोर वेब वाइटल्स सुधारें", "LCP ठीक करें", "CLS कम करें", "INP ऑप्टिमाइज़ करें", "पेज अनुभव ऑप्टिमाइज़ेशन", या "लेआउट शिफ्ट ठीक करें" के लिए कहा जाए तब उपयोग करें।

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

पदावनति और प्रवासन का प्रबंधन करता है। पुराने सिस्टम, API या सुविधाओं को हटाते समय उपयोग करें। उपयोगकर्ताओं को एक कार्यान्वयन से दूसरे में स्थानांतरित करते समय उपयोग करें। मौजूदा कोड को बनाए रखने या बंद करने का निर्णय लेते समय उपयोग करें।

निर्णयों और दस्तावेज़ीकरण को रिकॉर्ड करता है। इसका उपयोग तब करें जब आर्किटेक्चरल निर्णय लिए जा रहे हों, सार्वजनिक API बदले जा रहे हों, सुविधाएँ शिप की जा रही हों, या जब ऐसे संदर्भ को रिकॉर्ड करने की आवश्यकता हो जो भविष्य के इंजीनियरों और एजेंटों को कोडबेस समझने के लिए चाहिए।

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

उत्पादन-गुणवत्ता वाले, सुलभ, उत्तरदायी उपयोगकर्ता-मुखी UI बनाता है। इसका उपयोग तब करें जब इंटरफेस और पेज बनाने या संशोधित करने, कंपोनेंट बनाने, लेआउट लागू करने, WCAG पहुंच आवश्यकताओं को पूरा करने, स्थिति प्रबंधित करने, या जब आउटपुट को AI-जनित के बजाय उत्पादन-गुणवत्ता वाला दिखना और महसूस होना चाहिए।

गिट वर्कफ़्लो प्रथाओं को संरचित करता है। किसी भी कोड परिवर्तन करते समय उपयोग करें। कमिट करते समय, ब्रांचिंग करते समय, विरोधों को हल करते समय, या जब आपको कई समानांतर स्ट्रीम में कार्य को व्यवस्थित करने की आवश्यकता हो, तब उपयोग करें। रिलीज़ काटते समय, सिमैंटिक वर्जन बंप चुनते समय, टैग करते समय, या चेंजलॉग लिखते समय उपयोग करें।

कच्चे विचारों को संरचित विचलन और अभिसरण चिंतन के माध्यम से स्पष्ट, कार्रवाई योग्य अवधारणाओं में परिष्कृत करता है। इसका उपयोग तब करें जब कोई विचार अभी भी अस्पष्ट हो, जब आपको किसी योजना पर प्रतिबद्ध होने से पहले धारणाओं का तनाव-परीक्षण करने की आवश्यकता हो, या जब आप किसी एक पर अभिसरण करने से पहले विकल्पों का विस्तार करना चाहते हों। "ideate", "refine this idea", या "stress-test my plan" पर ट्रिगर होता है।

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

Extracts what the user actually wants instead of what they think they should want. Achieves this through one-question-at-a-time interview until ~95% confidence about the underlying intent. Use when an ask is underspecified ("build me X" without "for whom" or "why now"), when the user explicitly invokes ("interview me", "grill me", "are we sure?", "stress-test my thinking"), or when you catch yourself silently filling in ambiguous requirements before any plan, spec, or code exists.

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

वेब प्रदर्शन को तेज़ लोडिंग और बेहतर उपयोगकर्ता अनुभव के लिए अनुकूलित करें। इसका उपयोग तब करें जब "मेरी साइट की गति बढ़ाएं", "प्रदर्शन अनुकूलित करें", "लोड समय कम करें", "धीमी लोडिंग ठीक करें", "पेज स्पीड सुधारें", या "प्रदर्शन ऑडिट" के लिए कहा जाए।

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

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

कोड को कमजोरियों से सुरक्षित करता है। उपयोगकर्ता इनपुट, प्रमाणीकरण, डेटा भंडारण या बाहरी एकीकरण को संभालते समय उपयोग करें। किसी भी ऐसी सुविधा का निर्माण करते समय उपयोग करें जो अविश्वसनीय डेटा स्वीकार करती है, उपयोगकर्ता सत्र प्रबंधित करती है, या तृतीय-पक्ष सेवाओं के साथ इंटरैक्ट करती है।

सर्च इंजन दृश्यता और रैंकिंग के लिए अनुकूलित करें। जब "SEO सुधारें", "सर्च के लिए अनुकूलित करें", "मेटा टैग ठीक करें", "स्ट्रक्चर्ड डेटा जोड़ें", "साइटमैप अनुकूलन", या "सर्च इंजन अनुकूलन" के लिए कहा जाए तो उपयोग करें।

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

हर कार्यान्वयन निर्णय को आधिकारिक दस्तावेज़ीकरण पर आधारित करता है। इसका उपयोग तब करें जब आप पुराने पैटर्न से मुक्त, आधिकारिक स्रोत-उद्धृत कोड चाहते हैं। इसका उपयोग किसी भी फ्रेमवर्क या लाइब्रेरी के साथ निर्माण करते समय करें जहाँ सटीकता मायने रखती है।

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

परीक्षणों के साथ विकास को संचालित करता है। किसी भी तर्क को लागू करते समय, किसी भी बग को ठीक करते समय, या किसी भी व्यवहार को बदलते समय उपयोग करें। जब आपको यह साबित करने की आवश्यकता हो कि कोड काम करता है, जब कोई बग रिपोर्ट आती है, या जब आप मौजूदा कार्यक्षमता को संशोधित करने वाले हों, तब उपयोग करें।

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

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