Web-Dev-For-Beginners/translations/hi/AGENTS.md

AGENTS.md

परियोजना अवलोकन

यह शुरुआती लोगों को वेब विकास के मूल तत्व सिखाने के लिए एक शैक्षिक पाठ्यक्रम रिपॉजिटरी है। यह पाठ्यक्रम एक संपूर्ण 12-सप्ताह का कोर्स है जिसे Microsoft क्लाउड एडवोकेट्स द्वारा विकसित किया गया है, जिसमें JavaScript, CSS, और HTML को कवर करने वाले 24 व्यावहारिक पाठ होते हैं।

प्रमुख घटक

• शैक्षिक सामग्री: परियोजना-आधारित मॉड्यूल में व्यवस्थित 24 संरचित पाठ
• व्यावहारिक परियोजनाएँ: टेररियम, टाइपिंग गेम, ब्राउज़र एक्सटेंशन, स्पेस गेम, बैंकिंग ऐप, कोड संपादक, और एआई चैट असिस्टेंट
• इंटरएक्टिव क्विज़: 48 क्विज़, प्रत्येक में 3 प्रश्न (पाठ से पहले और बाद में मूल्यांकन)
• बहु-भाषा समर्थन: GitHub Actions के माध्यम से 50+ भाषाओं के लिए स्वचालित अनुवाद
• प्रौद्योगिकियाँ: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (एआई परियोजनाओं के लिए)

वास्तुकला

• शैक्षिक रिपॉजिटरी जो पाठ-आधारित संरचना पर आधारित है
• प्रत्येक पाठ फोल्डर में README, कोड उदाहरण, और समाधान हैं
• स्वायत्त परियोजनाएँ अलग-अलग निर्देशिकाओं में (quiz-app, विभिन्न पाठ परियोजनाएँ)
• GitHub Actions (co-op-translator) का उपयोग करते हुए अनुवाद प्रणाली
• डॉक्सिफाई के माध्यम से प्रलेखन और PDF के रूप में उपलब्ध

सेटअप कमांड

यह रिपॉजिटरी मुख्य रूप से शैक्षिक सामग्री उपभोग के लिए है। विशिष्ट परियोजनाओं के साथ काम करने के लिए:

मुख्य रिपॉजिटरी सेटअप

git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners

क्विज़ ऐप सेटअप (Vue 3 + Vite)

cd quiz-app
npm install
npm run dev        # विकास सर्वर शुरू करें
npm run build      # प्रोडक्शन के लिए निर्माण करें
npm run lint       # ESLint चलाएं

बैंक प्रोजेक्ट API (Node.js + Express)

cd 7-bank-project/api
npm install
npm start          # एपीआई सर्वर शुरू करें
npm run lint       # ESLint चलाएं
npm run format     # Prettier के साथ फॉर्मेट करें

ब्राउज़र एक्सटेंशन परियोजनाएँ

cd 5-browser-extension/solution
npm install
# ब्राउज़र-विशिष्ट एक्सटेंशन लोडिंग निर्देशों का पालन करें

स्पेस गेम परियोजनाएँ

cd 6-space-game/solution
npm install
# index.html को ब्राउज़र में खोलें या लाइव सर्वर का उपयोग करें

चैट प्रोजेक्ट (Python Backend)

cd 9-chat-project/solution/backend/python
pip install openai
# GITHUB_TOKEN पर्यावरण चर सेट करें
python api.py

विकास कार्यप्रवाह

सामग्री योगदानकर्ताओं के लिए

1. अपने GitHub खाते में रिपॉजिटरी को फोर्क करें
2. अपने फोर्क को स्थानीय रूप से क्लोन करें
3. अपने परिवर्तनों के लिए एक नई शाखा बनाएं
4. पाठ सामग्री या कोड उदाहरणों में परिवर्तन करें
5. संबंधित परियोजना निर्देशिकाओं में कोड परिवर्तन का परीक्षण करें
6. योगदान दिशानिर्देशों का पालन करते हुए पुल अनुरोध जमा करें

शिक्षार्थियों के लिए

1. रिपॉजिटरी को फोर्क या क्लोन करें
2. पाठ निर्देशिकाओं में क्रमबद्ध रूप से नेविगेट करें
3. प्रत्येक पाठ के README फ़ाइलें पढ़ें
4. प्री-लर्निंग क्विज़ को https://ff-quizzes.netlify.app/web/ पर पूरा करें
5. पाठ फ़ोल्डरों में कोड उदाहरणों पर काम करें
6. असाइनमेंट और चुनौतियाँ पूरी करें
7. पोस्ट-लर्निंग क्विज़ लें

लाइव विकास

• प्रलेखन: रूट में docsify serve चलाएं (पोर्ट 3000)
• क्विज़ ऐप: क्विज़-ऐप निर्देशिका में npm run dev चलाएं
• परियोजनाएँ: HTML परियोजनाओं के लिए VS कोड लाइव सर्वर एक्सटेंशन का उपयोग करें
• API परियोजनाएँ: संबंधित API निर्देशिकाओं में npm start चलाएं

परीक्षण निर्देश

क्विज़ ऐप परीक्षण

cd quiz-app
npm run lint       # कोड शैली की समस्याओं की जांच करें
npm run build      # सुनिश्चित करें कि निर्माण सफल हो जाता है

बैंक API परीक्षण

cd 7-bank-project/api
npm run lint       # कोड शैली मुद्दों की जांच करें
node server.js     # यह सत्यापित करें कि सर्वर बिना त्रुटियों के शुरू होता है

सामान्य परीक्षण दृष्टिकोण

• यह एक शैक्षिक रिपॉजिटरी है जिसमें व्यापक स्वचालित परीक्षण नहीं हैं
• मैनुअल परीक्षण पर केंद्रित:
  • कोड उदाहरण बिना त्रुटि के चलते हैं
  • दस्तावेज़ीकरण के लिंक सही कार्य करते हैं
  • परियोजना बिल्ड सफलतापूर्वक पूरी होती है
  • उदाहरण सर्वोत्तम प्रथाओं का पालन करते हैं

सबमिशन से पहले जांच

• package.json वाले निर्देशिकाओं में npm run lint चलाएं
• मार्कडाउन लिंक मान्य हैं यह पुष्टि करें
• ब्राउज़र या Node.js में कोड उदाहरणों का परीक्षण करें
• जांचें कि अनुवाद उचित संरचना बनाए रखते हैं

कोड स्टाइल दिशानिर्देश

जावास्क्रिप्ट

• आधुनिक ES6+ सिंटैक्स का उपयोग करें
• परियोजनाओं में दिए गए मानक ESLint कॉन्फ़िगरेशन का पालन करें
• शिक्षार्थियों के लिए समझने योग्य वैरिएबल और फंक्शन नामों का उपयोग करें
• अवधारणाओं की व्याख्या करने वाले टिप्पणियाँ जोड़ें
• जहाँ कॉन्फ़िगर हो, Prettier का उपयोग कर स्वरूपित करें

HTML/CSS

• सेमांटिक HTML5 तत्व
• रिस्पॉन्सिव डिज़ाइन सिद्धांत
• स्पष्ट क्लास नामकरण कन्वेंशंस
• CSS तकनीकों की व्याख्या करने वाली टिप्पणियाँ

पायथन

• PEP 8 शैली दिशानिर्देश
• साफ, शैक्षिक कोड उदाहरण
• सीखने में मदद करने के लिए प्रकार संकेत

मार्कडाउन दस्तावेज़ीकरण

• स्पष्ट हेडिंग पदानुक्रम
• भाषा निर्दिष्ट कोड ब्लॉक
• अतिरिक्त संसाधनों के लिंक
• images/ निर्देशिकाओं में स्क्रीनशॉट्स और चित्र
• पहुँच के लिए छवियों के लिए alt टेक्स्ट

फ़ाइल संगठन

• पाठ क्रम से क्रमांकित (1-getting-started-lessons, 2-js-basics, आदि)
• प्रत्येक परियोजना में solution/ और अक्सर start/ या your-work/ निर्देशिकाएँ होती हैं
• पाठ-विशिष्ट images/ फ़ोल्डरों में चित्र संग्रहीत
• अनुवाद translations/{language-code}/ संरचना में

निर्माण और तैनाती

क्विज़ ऐप तैनाती (Azure Static Web Apps)

क्विज़-ऐप Azure Static Web Apps तैनाती के लिए कॉन्फ़िगर किया गया है:

cd quiz-app
npm run build      # dist/ फ़ोल्डर बनाता है
# मुख्य पर पुश करने पर GitHub Actions वर्कफ़्लो के माध्यम से डिप्लॉय करता है

Azure Static Web Apps कॉन्फ़िगरेशन:

• ऐप स्थान: /quiz-app
• आउटपुट स्थान: dist
• वर्कफ़्लो: .github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml

प्रलेखन PDF निर्माण

npm install                    # docsify-to-pdf स्थापित करें
npm run convert               # docs से PDF उत्पन्न करें

डॉक्सिफाई प्रलेखन

npm install -g docsify-cli    # Docsify को वैश्विक रूप से स्थापित करें
docsify serve                 # localhost:3000 पर सेवा दें

परियोजना-विशिष्ट निर्माण

प्रत्येक परियोजना निर्देशिका में अपना निर्माण प्रक्रिया हो सकती है:

• Vue परियोजनाएँ: npm run build प्रोडक्शन बंडल बनाता है
• स्थैतिक परियोजनाएँ: कोई निर्माण चरण नहीं, सीधे फ़ाइलें सेवा दें

पुल अनुरोध दिशानिर्देश

शीर्षक प्रारूप

स्पष्ट, वर्णनात्मक शीर्षक का उपयोग करें जो परिवर्तन क्षेत्र को दर्शाता हो:

• [Quiz-app] पाठ X के लिए नया क्विज़ जोड़ें
• [Lesson-3] टेररियम परियोजना में वर्तनी सुधारें
• [Translation] पाठ 5 के लिए स्पेनिश अनुवाद जोड़ें
• [Docs] सेटअप निर्देश अपडेट करें

आवश्यक जांच

PR सबमिट करने से पहले:

1. कोड गुणवत्ता:

   • प्रभावित परियोजना निर्देशिकाओं में npm run lint चलाएं
   • सभी linting त्रुटियों और चेतावनियों को ठीक करें

2. निर्माण सत्यापन:

   • जहां लागू हो, npm run build चलाएं
   • सुनिश्चित करें कि कोई निर्माण त्रुटि न हो

3. लिंक सत्यापन:

   • सभी मार्कडाउन लिंक का परीक्षण करें
   • छवि संदर्भ काम करें यह जांचें

4. सामग्री समीक्षा:

   • वर्तनी और व्याकरण की जांच करें
   • सुनिश्चित करें कि कोड उदाहरण सही और शैक्षिक हैं
   • अनुवाद मूल अर्थ को बनाए रखें

योगदान आवश्यकताएँ

• Microsoft CLA (पहले PR पर स्वचालित जांच) से सहमत हों
• Microsoft Open Source Code of Conduct का पालन करें
• विस्तृत दिशानिर्देशों के लिए CONTRIBUTING.md देखें
• यदि लागू हो, तो PR विवरण में मुद्दा संख्या का संदर्भ दें

समीक्षा प्रक्रिया

• PRs मेंटेनर्स और समुदाय द्वारा समीक्षा किए जाते हैं
• शैक्षिक स्पष्टता को प्राथमिकता दी जाती है
• कोड उदाहरणों को वर्तमान सर्वोत्तम प्रथाओं का पालन करना चाहिए
• अनुवादों को सटीकता और सांस्कृतिक उपयुक्तता के लिए समीक्षा किया जाता है

अनुवाद प्रणाली

स्वचालित अनुवाद

• GitHub Actions के साथ co-op-translator वर्कफ़्लो का उपयोग करता है
• 50+ भाषाओं में स्वचालित रूप से अनुवाद करता है
• स्रोत फाइलें मुख्य निर्देशिकाओं में होती हैं
• अनुवादित फाइलें translations/{language-code}/ निर्देशिकाओं में होती हैं

मैनुअल अनुवाद सुधार जोड़ना

1. translations/{language-code}/ में फ़ाइल का पता लगाएं
2. संरचना बनाए रखते हुए सुधार करें
3. सुनिश्चित करें कि कोड उदाहरण कार्यशील बने रहें
4. स्थानीयकृत क्विज़ सामग्री का परीक्षण करें

अनुवाद मेटाडेटा

अनुवादित फ़ाइलों में मेटाडेटा हेडर शामिल होता है:

<!--
CO_OP_TRANSLATOR_METADATA:
{
  "original_hash": "...",
  "translation_date": "...",
  "source_file": "...",
  "language_code": "..."
}
-->

डिबगिंग और समस्या निवारण

सामान्य समस्याएँ

क्विज़ ऐप शुरू नहीं होता:

• Node.js संस्करण जांचें (v14+ अनुशंसित)
• node_modules और package-lock.json हटाएं, फिर npm install चलाएं
• पोर्ट संघर्ष जांचें (डिफ़ॉल्ट: Vite पोर्ट 5173 उपयोग करता है)

API सर्वर शुरू नहीं होता:

• Node.js संस्करण न्यूनतम (node >=10) होना चाहिए
• जांचें कि पोर्ट पहले से उपयोग में तो नहीं है
• सुनिश्चित करें कि सभी निर्भरताएं npm install से स्थापित हैं

ब्राउज़र एक्सटेंशन लोड नहीं होता:

• manifest.json सही फ़ॉर्मेट में है यह जांचें
• ब्राउज़र कंसोल में त्रुटियाँ देखें
• ब्राउज़र-विशिष्ट एक्सटेंशन इंस्टॉलेशन निर्देशों का पालन करें

पायथन चैट प्रोजेक्ट समस्याएँ:

• OpenAI पैकेज स्थापित है: pip install openai
• सुनिश्चित करें कि GITHUB_TOKEN पर्यावरण चर सेट है
• GitHub मॉडल पहुँच अनुमतियाँ जांचें

डॉक्सिफाई दस्तावेज़ सेवा नहीं करता:

• docsify-cli ग्लोबली स्थापित करें: npm install -g docsify-cli
• रिपॉजिटरी रूट निर्देशिका से चलाएं
• जांचें कि docs/_sidebar.md मौजूद है

विकास पर्यावरण सुझाव

• HTML परियोजनाओं के लिए VS Code में लाइव सर्वर एक्सटेंशन का उपयोग करें
• सुसंगत फॉर्मेटिंग के लिए ESLint और Prettier एक्सटेंशन इंस्टॉल करें
• JavaScript डिबगिंग के लिए ब्राउज़र DevTools का उपयोग करें
• Vue परियोजनाओं के लिए Vue DevTools ब्राउज़र एक्सटेंशन इंस्टॉल करें

प्रदर्शन विचार

• अनुवादित फ़ाइलों की बड़ी संख्या (50+ भाषाएँ) के कारण पूर्ण क्लोन बड़े होते हैं
• केवल सामग्री पर काम करने के लिए शैलो क्लोन का उपयोग करें: git clone --depth 1
• अंग्रेज़ी सामग्री पर काम करते समय अनुवाद खोजों से बाहर करें
• बिल्ड प्रक्रियाएँ पहली बार धीमी हो सकती हैं (npm install, Vite build)

सुरक्षा विचार

पर्यावरण चर

• API कुंजी को कभी रिपॉजिटरी में कमिट न करें
• .env फ़ाइलें उपयोग करें (पहले से .gitignore में हैं)
• आवश्यक पर्यावरण चर परियोजना READMEs में दस्तावेजीकृत करें

पायथन परियोजनाएँ

• वर्चुअल एनवायरनमेंट का उपयोग करें: python -m venv venv
• निर्भरताओं को अपडेट रखें
• GitHub टोकन के पास न्यूनतम आवश्यक अनुमतियाँ होनी चाहिए

GitHub मॉडल्स एक्सेस

• GitHub मॉडल्स के लिए व्यक्तिगत एक्सेस टोकन (PAT) आवश्यक हैं
• टोकन को पर्यावरण चरों के रूप में सहेजें
• टोकन या क्रेडेंशियल्स को कभी कमिट न करें

अतिरिक्त नोट्स

लक्षित दर्शक

• वेब विकास के पूर्ण शुरुआती
• छात्र और स्वयं-अधिगमकर्ता
• कक्षाओं में पाठ्यक्रम का उपयोग करने वाले शिक्षक
• सामग्री सुलभता और धीरे-धीरे कौशल निर्माण के लिए डिज़ाइन की गई है

शैक्षिक दर्शन

• परियोजना-आधारित सीखने का दृष्टिकोण
• बार-बार ज्ञान जांच (क्विज़)
• व्यावहारिक कोडिंग अभ्यास
• वास्तविक विश्व अनुप्रयोग उदाहरण
• फ्रेमवर्क से पहले मूल बातें पर फोकस

रिपॉजिटरी रखरखाव

• शिक्षार्थियों और योगदानकर्ताओं की सक्रिय समुदाय
• निर्भरताओं और सामग्री के नियमित अपडेट
• मेंटेनर्स द्वारा मुद्दों और चर्चाओं की निगरानी
• GitHub Actions के जरिए अनुवाद अपडेट स्वचालित

संबंधित संसाधन

• Microsoft Learn मॉड्यूल
• स्टूडेंट हब संसाधन
• शिक्षार्थियों के लिए अनुशंसित: GitHub Copilot
• अतिरिक्त पाठ्यक्रम: जनरेटिव एआई, डेटा साइंस, एमएल, आईओटी पाठ्यक्रम उपलब्ध

विशिष्ट परियोजनाओं के साथ कार्य करना

व्यक्तिगत परियोजनाओं के विस्तृत निर्देशों के लिए, README फ़ाइलें देखें:

• quiz-app/README.md - Vue 3 क्विज़ एप्लिकेशन
• 7-bank-project/README.md - प्रमाणीकरण के साथ बैंकिंग एप्लिकेशन
• 5-browser-extension/README.md - ब्राउज़र एक्सटेंशन विकास
• 6-space-game/README.md - कैनवास-आधारित गेम डेवलपमेंट
• 9-chat-project/README.md - एआई चैट असिस्टेंट प्रोजेक्ट

मोनोरिपॉ संरचना

हालांकि यह पारंपरिक मोनोरिपॉ नहीं है, इस रिपॉजिटरी में कई स्वतंत्र परियोजनाएँ हैं:

• प्रत्येक पाठ स्वतंत्र है
• परियोजनाएँ निर्भरताओं को साझा नहीं करती हैं
• अन्य परियोजनाओं को प्रभावित किए बिना व्यक्तिगत परियोजनाओं पर काम करें
• पूर्ण पाठ्यक्रम अनुभव के लिए पूरी रिपॉजिटरी क्लोन करें

---

अस्वीकृति:
यह दस्तावेज़ AI अनुवाद सेवा Co-op Translator का उपयोग करके अनूदित किया गया है। जबकि हम सटीकता के लिए प्रयासरत हैं, कृपया ध्यान दें कि स्वचालित अनुवादों में त्रुटियाँ या गलतियाँ हो सकती हैं। मूल दस्तावेज़ अपनी मूल भाषा में प्राधिकृत स्रोत माना जाना चाहिए। महत्वपूर्ण जानकारी के लिए पेशेवर मानव अनुवाद की सलाह दी जाती है। इस अनुवाद के उपयोग से उत्पन्न किसी भी गलतफहमी या गलत व्याख्या के लिए हम उत्तरदायी नहीं हैं।