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

AGENTS.md

प्रकल्पाचा आढावा

हा प्रकल्प वेब विकासाच्या मूलभूत तत्त्वांचे शिक्षण घेणाऱ्या नवशिक्यांसाठी शैक्षणिक अभ्यासक्रमाचा साठा आहे. हा अभ्यासक्रम Microsoft Cloud Advocates यांनी विकसित केलेला 12 आठवड्यांचा सखोल कोर्स आहे, ज्यामध्ये JavaScript, CSS, आणि HTML या विषयांवर आधारित 24 व्यावहारिक धडे आहेत.

मुख्य घटक

• शैक्षणिक सामग्री: प्रकल्प-आधारित मॉड्यूलमध्ये संघटित 24 रचनात्मक धडे
• व्यावहारिक प्रकल्प: Terrarium, Typing Game, Browser Extension, Space Game, Banking App, Code Editor, आणि AI Chat Assistant
• परस्परसंवादी क्विझ: प्रत्येका 3 प्रश्नांसह 48 क्विझ (पाठांच्या आधी/नंतर चाचण्या)
• बहुभाषिक समर्थन: GitHub Actions द्वारे 50+ भाषांसाठी स्वयंचलित भाषांतर
• तंत्रज्ञान: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI प्रकल्पांसाठी)

आर्किटेक्चर

• शैक्षणिक साठा ज्यामध्ये धड्यानुसार रचना आहे
• प्रत्येका धड्याच्या फोल्डरमध्ये README, कोडचे उदाहरण, आणि समाधान आहे
• स्वतंत्र प्रकल्प स्वतंत्र निर्देशिकांमध्ये (quiz-app, विविध धड्यांचे प्रकल्प)
• GitHub Actions वापरून भाषांतर प्रणाली (co-op-translator)
• Docsify द्वारे दस्तऐवजीकरण आणि 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          # API सर्व्हर सुरू करा
npm run lint       # ESLint चालवा
npm run format     # Prettier ने फॉरमॅट करा

ब्राउझर एक्स्टेंशन प्रकल्प

cd 5-browser-extension/solution
npm install
# ब्राउझर-विशिष्ट विस्तार लोडिंग सूचना पाळा

स्पेस गेम प्रकल्प

cd 6-space-game/solution
npm install
# ब्राउझरमध्ये index.html उघडा किंवा Live Server वापरा

चॅट प्रकल्प (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)
• क्विझ अॅप: quiz-app निर्देशिकेत npm run dev चालवा
• प्रकल्प: HTML प्रकल्पांसाठी VS Code Live Server विस्तार वापरा
• 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 चालवा
• Markdown लिंक वैध आहेत का तपासा
• ब्राउझर किंवा Node.js मध्ये कोड उदाहरणे तपासा
• भाषांतरे थोडक्यात सुसंगत आहेत का तपासा

कोड शैली मार्गदर्शक

JavaScript

• आधुनिक ES6+ सिंटॅक्स वापरा
• प्रकल्पांमध्ये दिलेल्या ESLint कॉन्फिगरेशनचे पालन करा
• शैक्षणिक स्पष्टतेसाठी अर्थपूर्ण व्हेरिएबल आणि फंक्शन नावे वापरा
• शिकणाऱ्यांसाठी संकल्पना स्पष्ट करणारे टिपण्णी जोडा
• जिथे कॉन्फिगर आहे तिथे Prettier वापरा

HTML/CSS

• सिमॅन्टिक HTML5 घटक वापरा
• प्रतिसादात्मक डिझाईन तत्त्वे
• स्पष्ट क्लास नावे वापरा
• CSS तंत्रे स्पष्ट करणाऱ्या टिपण्णी

Python

• PEP 8 शैली मार्गदर्शने
• स्पष्ट, शैक्षणिक कोड उदाहरणे
• शिकण्यासाठी उपयुक्त तिथे प्रकार इशारे

Markdown दस्तऐवजीकरण

• स्पष्ट हेडिंग अनुक्रम
• भाषा निर्दिष्ट केलेले कोड ब्लॉक
• अतिरिक्त संसाधनांची लिंक
• 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/ फोल्डर तयार करतो
# मुख्य शाखेवर push केल्यावर GitHub Actions workflow द्वारे तैनात करतो

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

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

दस्तऐवज PDF निर्मिती

npm install                    # docsify-to-pdf प्रतिष्ठापित करा
npm run convert               # docs मधून PDF तयार करा

Docsify दस्तऐवजीकरण

npm install -g docsify-cli    # Docsify ग्लोबली इंस्टॉल करा
docsify serve                 # localhost:3000 वर सर्व्ह करा

प्रकल्पानुसार बिल्ड

प्रत्येक प्रकल्प निर्देशिकेकडे स्वतःचा बिल्ड प्रक्रिया असू शकते:

• Vue प्रकल्प: npm run build द्वारे प्रोडक्शन बंडल तयार करणे
• स्टॅटिक प्रकल्प: बिल्ड टप्पा नाही, फाईल्स थेट सर्व्ह करा

पुल विनंती मार्गदर्शक

शीर्षक स्वरूप

परिवर्तन क्षेत्र स्पष्ट करणारी शीर्षक वापरा:

• [Quiz-app] धडा X साठी नवीन क्विझ जोडा
• [Lesson-3] Terrarium प्रकल्पातील टायपो दुरुस्त करा
• [Translation] धडा 5 साठी स्पॅनिश भाषांतर जोडा
• [Docs] सेटअप सूचना अद्यतनित करा

आवश्यक तपासणी

PR सादर करण्यापूर्वी:

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

   • प्रभावित प्रकल्प निर्देशिकांमध्ये npm run lint चालवा
   • सर्व लिंटिंग त्रुटी आणि इशारे दुरुस्त करा

2. बिल्ड पडताळणी:

   • लागू असल्यास npm run build चालवा
   • कोणतीही बिल्ड त्रुटी नसल्याची खात्री करा

3. लिंक वैधता:

   • सर्व Markdown लिंक तपासा
   • प्रतिमा संदर्भ कार्यरत आहेत का याची पुष्टी करा

4. सामग्री पुनरावलोकन:

   • शब्दलेखन आणि व्याकरण तपासा
   • कोड उदाहरणे योग्य आणि शैक्षणिक आहेत याची खात्री करा
   • भाषांतर मूळ अर्थ राखत आहे याची खात्री करा

योगदानाची अटी

• Microsoft CLA सह सहमती (प्रथम PR वर स्वयंचलित तपासणी)
• Microsoft Open Source Code of Conduct चे पालन करा
• तपशीलवार मार्गदर्शनासाठी CONTRIBUTING.md पहा
• PR वर्णनात प्रश्न क्रमांक उल्लेखित करा (असल्यास)

पुनरावलोकन प्रक्रिया

• PR मध्ये मेंटेनर आणि समुदायाकडून पुनरावलोकन
• शैक्षणिक स्पष्टतेस प्राधान्य
• कोड उदाहरणे सद्य सर्वोत्तम पद्धतींचे अनुसरण करावीत
• भाषांतर अचूकता आणि सांस्कृतिक योग्यतेसाठी पाहणी

भाषांतर प्रणाली

स्वयंचलित भाषांतर

• 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 योग्यरित्या फॉरमॅट केले आहे का तपासा
• ब्राउझर कन्सोलमध्ये त्रुटी तपासा
• ब्राउझरसाठी एक्स्टेंशन इन्स्टॉलेशन सूचनांचे पालन करा

Python चॅट प्रकल्प समस्या:

• OpenAI पॅकेज इन्स्टॉल आहे का: pip install openai
• GITHUB_TOKEN पर्यावरण चल सेट आहे का तपासा
• GitHub Models प्रवेश परवानग्या तपासा

Docsify सेवा करत नाही:

• docsify-cli जागतिकपणे इन्स्टॉल करा: npm install -g docsify-cli
• साठ्याच्या रूट निर्देशिकेतून चालवा
• docs/_sidebar.md अस्तित्वात आहे का तपासा

विकास पर्यावरण टिपा

• HTML प्रकल्पांसाठी VS Code मध्ये Live Server विस्तार वापरा
• एकसारखा स्वरूपनासाठी ESLint आणि Prettier विस्तार इन्स्टॉल करा
• JavaScript डिबगिंगसाठी ब्राउझर डेव्हटूल्स वापरा
• Vue प्रकल्पांसाठी Vue DevTools ब्राउझर विस्तार इन्स्टॉल करा

कार्यक्षमता विचार

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

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

पर्यावरण चल

• API की कधीही साठ्यात कमिट करू नका
• .env फाईल्स वापरा (आधीच .gitignore मध्ये आहे)
• प्रकल्पाच्या README मध्ये आवश्यक पर्यावरण चलांचे दस्तऐवजीकरण करा

Python प्रकल्प

• व्हर्चुअल एन्व्हायर्नमेंट वापरा: python -m venv venv
• अवलंबन अद्ययावत ठेवा
• GitHub टोकन्स कमीतकमी आवश्यक परवानग्यांसह असावेत

GitHub Models प्रवेश

• GitHub Models साठी Personal Access Tokens (PAT) आवश्यक
• टोकन पर्यावरण चलांमध्ये संग्रहित करा
• कधीही टोकन्स किंवा प्रमाणपत्रे कमिट करू नका

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

लक्षित प्रेक्षक

• वेब विकासासाठी पूर्ण नवशिके
• विद्यार्थी आणि स्वअभ्यासक
• वर्गांमध्ये या अभ्यासक्रमाचा वापर करणारे शिक्षक
• सामग्री प्रवेशयोग्यता आणि हळूहळू कौशल्य वाढीसाठी डिझाइन केलेली

शैक्षणिक तत्वज्ञान

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

साठा देखभाल

• शिकणारे आणि योगदानकर्त्यांची सक्रिय समुदाय
• अवलंबन आणि सामग्री नियमित अद्यतने
• तक्रारी आणि चर्चांची देखरेख मेंटेनर्सद्वारे
• भाषांतर अद्यतने GitHub Actions द्वारे स्वयंचलित

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

• Microsoft Learn modules
• Student Hub resources
• GitHub Copilot शिकणाऱ्यांसाठी शिफारस
• अतिरिक्त कोर्सेस: Generative AI, Data Science, ML, IoT अभ्यासक्रम उपलब्ध

विशिष्ट प्रकल्पांसोबत काम

विवरणात्मक सूचना साठी प्रत्येक प्रकल्पाच्या 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 चॅट सहाय्यक प्रकल्प

मोनोरेपो रचना

पारंपरिक मोनोरेपो नसले तरी, हा साठा अनेक स्वतंत्र प्रकल्पांचा समावेश करतो:

• प्रत्येका धडा स्वतंत्र आहे
• प्रकल्प अवलंबन शेअर करत नाहीत
• स्वतंत्र प्रकल्पांवर काम करा; एकमेकांवर परिणाम न करता
• पूर्ण अभ्यासक्रमाचा अनुभव घेण्यासाठी संपूर्ण साठा क्लोन करा

---

संपर्क सूचना: हा दस्तऐवज AI भाषांतर सेवा Co-op Translator वापरून भाषांतरित केला आहे. आम्ही अचूकतेसाठी प्रयत्नशील आहोत, परंतु कृपया लक्षात ठेवा की स्वयंचलित भाषांतरांमध्ये त्रुटी किंवा अचूकतेच्या चुका असू शकतात. मूळ दस्तऐवज त्याच्या स्थानिक भाषेत अधिकृत स्रोत मानला जावा. महत्त्वाच्या माहितीसाठी व्यावसायिक मानवी भाषांतर शिफारस केली जाते. या भाषांतराच्या वापरामुळे उद्भवलेल्या कोणत्याही गैरसमजुती किंवा चुकीच्या अर्थलागीसंबंधी आम्ही जबाबदार नाही.