हे नवशिक्यांना वेब विकासाच्या मूलभूत गोष्टी शिकवण्यासाठी शैक्षणिक अभ्यासक्रमाचे रिपॉझिटरी आहे. हा अभ्यासक्रम Microsoft Cloud Advocates द्वारे विकसित केलेला 12 आठवड्यांचा व्यापक कोर्स आहे, ज्यामध्ये JavaScript, CSS आणि HTML कव्हर करणारे 24 प्रॅक्टिकल धडे आहेत.
हा शिकण्याचा अभ्यासक्रम संचाहि आहे जो नवशिक्यांना वेब विकासाच्या मूलभूत गोष्टी शिकवण्यासाठी तयार करण्यात आला आहे. हा अभ्यासक्रम Microsoft Cloud Advocates यांनी विकसित केलेला १२ आठवड्यांचा सखोल अभ्यासक्रम आहे, ज्यामध्ये JavaScript, CSS आणि HTML या विषयांसाठी २४ हाताळणी आधारित धडे समाविष्ट आहेत.
### मुख्य घटक
- **शैक्षणिक सामग्री**: प्रकल्प-आधारित मॉड्यूलमध्ये आयोजित केलेले 24 संरचित धडे
- **प्रॅक्टिकल प्रकल्प**: Terrarium, Typing Game, Browser Extension, Space Game, Banking App, Code Editor, आणि AI Chat Assistant
- **इंटरॅक्टिव्ह क्विझेस**: प्रत्येक धड्याच्या आधी/नंतर 3 प्रश्नांसह 48 क्विझेस
- `5-browser-extension/README.md` - ब्राउझर एक्सटेन्शन विकास
- `6-space-game/README.md` - कॅनव्हास-आधारित गेम विकास
- `9-chat-project/README.md` - AI चॅट असिस्टंट प्रकल्प
- `9-chat-project/README.md` - AI चॅट सहाय्यक प्रकल्प
### मोनोरिपो संरचना
### मोनोरेपो रचना
पारंपरिक मोनोरिपो नसले तरी, या रिपॉझिटरीमध्ये अनेक स्वतंत्र प्रकल्प आहेत:
- प्रत्येक धडा स्वतंत्र आहे
- प्रकल्प अवलंबित्व सामायिक करत नाहीत
- इतरांवर परिणाम न करता स्वतंत्र प्रकल्पांवर काम करा
- संपूर्ण अभ्यासक्रम अनुभवासाठी संपूर्ण रिपॉझिटरी क्लोन करा
हा पारंपरिक मोनोरेपो नाही, पण हा संच अनेक स्वतंत्र प्रकल्पांचा समावेश करतो:
- प्रत्येक धडा स्वतंत्र
- प्रकल्पांमध्ये अवलंबित्वे शेअर होत नाहीत
- स्वतंत्र प्रकल्पांवर काम करा, एकमेकांवर परिणाम न करता
- पूर्ण अभ्यासक्रमासाठी संपूर्ण संच क्लोन करा
---
**अस्वीकरण**:
हा दस्तऐवज AI भाषांतर सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) वापरून भाषांतरित करण्यात आला आहे. आम्ही अचूकतेसाठी प्रयत्नशील असलो तरी, कृपया लक्षात ठेवा की स्वयंचलित भाषांतरांमध्ये त्रुटी किंवा अचूकतेचा अभाव असू शकतो. मूळ भाषेतील दस्तऐवज हा अधिकृत स्रोत मानला जावा. महत्त्वाच्या माहितीसाठी, व्यावसायिक मानवी भाषांतराची शिफारस केली जाते. या भाषांतराचा वापर करून उद्भवलेल्या कोणत्याही गैरसमज किंवा चुकीच्या अर्थासाठी आम्ही जबाबदार राहणार नाही.
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**सूचना**:
हा दस्तऐवज AI भाषांतर सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) वापरून भाषांतरित केला आहे. आम्ही अचूकतेसाठी प्रयत्न करीत असलो तरी, कृपया लक्षात घ्या की स्वयंचलित भाषांतरे त्रुटी किंवा चुकीची असू शकतात. मूळ भाषा असलेला दस्तऐवज ही अधिकृत स्रोत मानली पाहिजे. महत्त्वपूर्ण माहिती साठी व्यावसायिक मानवी भाषांतर शिफारस केली जाते. या भाषांतराचा वापर करून झालेल्या कोणत्याही गैरसमज किंवा चुकीच्या अर्थग्रहणासाठी आम्ही जबाबदार नाही.
Microsoft क्लाउड अॅडव्होकेट्सद्वारे दिलेला 12 आठवड्यांचा व्यापक अभ्यासक्रम घेऊन वेब विकासाच्या मूलतत्त्वांचा अभ्यास करा. 24 धड्यांपैकी प्रत्येक धडा JavaScript, CSS आणि HTML मध्ये तंत्रज्ञानी प्रकल्पांद्वारे उदाहरणार्थ टेरारियम्स, ब्राउझर एक्सटेंशन्स, आणि स्पेस गेम्स यामधून समजावून घेतो. क्विझ, चर्चा, आणि व्यावहारिक असाइनमेंट्समध्ये सहभाग घ्या. आमच्या प्रभावी प्रकल्पाधारित शिकवणीच्या माध्यमातून आपले कौशल्य वाढवा आणि ज्ञान टिकवून ठेवा. आजच आपली कोडिंग यात्रा सुरू करा!
मायक्रोसॉफ्ट क्लाउड अॅडव्होकेट्सद्वारे आम्ही सादर केलेल्या १२ आठवड्यांच्या सविस्तर कोर्ससह वेब विकासाच्या मूलभूत गोष्टी शिका. २४ धड्यांपैकी प्रत्येक धडा JavaScript, CSS आणि HTML मध्ये करता येणाऱ्या प्रकल्पांद्वारे जसे की टेररियम, ब्राउझर एक्सटेन्शन्स, आणि स्पेस गेम्स यांचा अभ्यास करतो. क्विझ, चर्चा आणि व्यावहारिक असाइनमेंटसह गुंतून रहा. आमच्या परिणामकारक प्रोजेक्ट-आधारित शिक्षण पद्धतीने तुमची कौशल्ये वाढवा आणि ज्ञान टिकवून ठेवा. आजच तुमची कोडिंग यात्रा सुरू करा!
> या रेकॉजिटरीमध्ये ५०+ भाषा अनुवाद आहेत जे डाउनलोड आकार मोठा करतात. अनुवादांशिवाय क्लोन करायच्यासाठी sparse checkout वापरा:
> या रिपॉझिटरीमध्ये ५०+ भाषांच्या अनुवादांचा समावेश आहे ज्यामुळे डाउनलोडचा आकार लक्षणीयपणे वाढतो. अनुवादांशिवाय क्लोन करण्यासाठी sparse checkout वापरा:
> git sparse-checkout set --no-cone '/*' '!translations' '!translated_images'
> ```
> हे तुम्हाला या अभ्यासक्रमासाठी आवश्यक सर्व काही लवकर डाउनलोड करण्यास मदत करते.
> हे तुम्हाला कोर्स पूर्ण करण्यासाठी सर्व ते देते आणि डाउनलोड अधिक जलद होते.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**जर तुम्हाला अतिरिक्त भाषांच्या अनुवादांची गरज असल्यास, त्या इथे [यादीबद्ध केलेल्या](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md) आहेत**
**अधिक भाषांमध्ये अनुवाद हवा असल्यास, [येथे](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md) सूचीबद्ध केलेले भाषासमर्थन पहा**
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑🎓 _तू विद्यार्थी आहेस का?_
#### 🧑🎓 _तुम्ही विद्यार्थी आहात का?_
[**सुटंट हब पेजला भेट द्या**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) जिथे तुम्हाला नवशिक्यांसाठी साधने, विद्यार्थी पॅक आणि अगदी मोफत प्रमाणपत्र कूपन मिळण्याचे मार्गही सापडतील. हा पृष्ठ तुम्हाला आवडल्यास त्याला बुकमार्क करा आणि वेळोवेळी तपासा कारण आम्ही दरमहा संसाधने बदलतो.
[**Student Hub page**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) येथे भेट द्या जिथे तुम्हाला नवशिक्यांसाठी संसाधने, विद्यार्थ्यांसाठी पॅक्स आणि अगदी मोफत प्रमाणपत्र कूपन मिळवण्याचे मार्गही सापडतील. ही पान तुम्हाला बुकमार्क करायला हवे आणि दर महिन्याला नव्या सामग्रीसाठी तपासायला हवे.
### 📣 घोषणा - नवीन GitHub Copilot Agent मोड आव्हाने पूर्ण करा!
नवीन आव्हान जोडले आहे, बहुतेक अध्यायांमध्ये "GitHub Copilot Agent Challenge 🚀" पहा. हे तुम्हाला GitHub Copilot आणि Agent मोड वापरून पूर्ण करण्यासाठी नविन आव्हान आहे. जर तुम्ही Agent मोड कधी वापरला नसेल, तर हा फक्त मजकूर निर्माण करत नाही तर फायली तयार करणं, संपादित करणं, कमांड चालवणं आणि बरेच काही करू शकतो.
नवीन आव्हान जोडले गेले आहे, बहुतेक अध्यायांत "GitHub Copilot Agent Challenge 🚀" शोधा. हे GitHub Copilot आणि Agent मोड वापरून पूर्ण करण्यासाठी एक नवीन आव्हान आहे. जर तुम्ही Agent मोड पूर्वी वापरला नसेल तर हे फक्त मजकूर निर्माण करत नाही तर फाइल्स तयार आणि संपादित करू शकते, आज्ञा चालवू शकते आणि बरंच काही.
### 📣 घोषणा - _मराठीमध्ये Generative AI वापरून नवीन प्रकल्प_
### 📣 घोषणा - _नवीन प्रोजेक्ट Generative AI वापरून बनविण्यासाठी_
नवीन AI सहाय्यक प्रकल्प नुकताच जोडले आहे, येथे पहा [प्रकल्प](./9-chat-project/README.md)
नवीन AI सहाय्यक प्रोजेक्ट नुकताच जोडला आहे, पहा [project](./9-chat-project/README.md)
### 📣 घोषणा - _Generative AI साठी नवीन अभ्यासक्रम_ JavaScript वर नुकताच प्रदर्शित
### 📣 घोषणा - _Generative AI साठी नवीन अभ्यासक्रम JavaScript मध्ये नुकताच रिलीज झाला आहे_
आमचा नवीन Generative AI अभ्यासक्रम मिस करू नका!
आमचा नवीन Generative AI अभ्यासक्रम चुकवू नका!
सुरू करण्यासाठी भेट द्या [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)
शिकायला सुरूवात करण्यासाठी भेट द्या [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)!
प्रत्येक धड्यात पूर्ण करण्यासाठी असाइनमेंट, ज्ञान तपासणी व आव्हान यांचा समावेश आहे ज्यामध्ये पुढील विषय शिकवले जातात:
- प्रॉम्प्टिंग आणि प्रॉम्प्ट अभियांत्रिकी
- मजकूर आणि प्रतिमा अॅप निर्मिती
- शोध अॅप्स
प्रत्येक धड्यात असाइनमेंट पूर्ण करणे, ज्ञान तपासणी आणि आव्हानाचा समावेश आहे ज्यामुळे तुम्हाला पुढील विषयांवर मार्गदर्शन मिळते:
- प्रॉम्प्टिंग आणि प्रॉम्प्ट इंजिनीयरिंग
- मजकूर आणि इमेज अॅप जनरेशन
- शोध अॅप्स
सुरू करण्यासाठी भेट द्या [https://aka.ms/genai-js-course](../../[https:/aka.ms/genai-js-course)
शिकायला सुरुवात करण्यासाठी भेट द्या [https://aka.ms/genai-js-course](../../[https:/aka.ms/genai-js-course)!
## 🌱 सुरूवात
> **शिक्षकांनो**, आम्ही [शिकण्याचे काही सल्ले](for-teachers.md) दिले आहेत जे या अभ्यासक्रमामध्ये वापरता येतील. तुमचे अभिप्राय आम्हाला [आमच्या चर्चा मंचावर](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner) वाचायला आवडतील!
**[शिकणारे](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, प्रत्येक धड्यासाठी, प्राक्तन व्याख्यानाच्या क्विझने सुरू करा आणि मग व्याख्यानाची सामग्री वाचा, विविध उपक्रम पूर्ण करा आणि नंतरच्या क्विझद्वारे तुमचे समजून घेणे तपासा.
## 🌱 प्रारंभ करा
तुमच्या शिकण्याच्या अनुभवास वृद्धिंगत करण्यासाठी, सहकाऱ्यांसोबत प्रकल्पांवर एकत्र काम करा! चर्चा आमच्या [चर्चा मंचावर](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) प्रोत्साहित केली जाते जिथे आमच्या टीमचे मॉडरेटर तुमच्या प्रश्नांची उत्तरे देतील.
> **शिक्षकहो**, आम्ही [या अभ्यासक्रमासाठी काही सूचना](for-teachers.md) समाविष्ट केल्या आहेत. कृपया [आमच्या चर्चा मंचावर](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner) तुमचा अभिप्राय द्या!
अधिक शिक्षणासाठी, आम्ही तुम्हाला [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) मध्ये अतिरिक्त अभ्यास साहित्य पाहण्याचा सल्ला देतो.
**[शिकणारे](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, प्रत्येक धड्यासाठी प्री-लेक्चर क्विझसह प्रारंभ करा, नंतर व्याख्यान साहित्य वाचा, विविध क्रियाकलाप पूर्ण करा आणि पोस्ट-लेक्चर क्विझने तुमचे समज तपासा.
शिकण्याचा अनुभव सुधारण्यासाठी, सहकारी विद्यार्थ्यांशी संपर्क करा आणि प्रोजेक्टवर एकत्र काम करा! चर्चांची शिफारस आम्ही आमच्या [चर्चा फोरम](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) मध्ये करतो जिथे आमचा मॉडरेटर टीम तुमच्या प्रश्नांची उत्तरे देईल.
शिक्षणाला पुढे नेण्यासाठी, आम्ही अत्यंत शिफारस करतो की तुम्ही [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) वर अतिरिक्त अभ्यास साहित्य पहा.
### 📋 तुमचे वातावरण सेट करा
हा अभ्यासक्रम एक विकसन वातावरण तयार करून दिला आहे! सुरुवात करताना तुम्ही [Codespace](https://github.com/features/codespaces/) मध्ये हे चालवू शकता (_ब्राउझर-आधारित, कोणतेही इंस्टॉलेशन नको असलेले वातावरण_), किंवा तुमच्या संगणकावर स्थानिकरीत्या [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) सारखा टेक्स्ट एडिटर वापरून चालवू शकता.
हा अभ्यासक्रम एका विकसित वातावरणासह तयार आहे! सुरू करताना तुम्ही हा अभ्यासक्रम [Codespace](https://github.com/features/codespaces/) मध्ये (ब्राऊझर-आधारित, इंस्टॉलेशन्स नको असलेले वातावरण) चालवू शकता किंवा तुमच्या संगणकावर स्थानिकरित्या [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) सारख्या टेक्ट्स एडिटरचा वापर करून चालवू शकता.
#### तुमची रेकॉजिटरी तयार करा
तुमचे काम सहज जतन करण्यासाठी, स्वतःची रेकॉजिटरी तयार करणे शिफारसीय आहे. हे करण्यासाठी या पृष्ठावरील **Use this template** बटणावर क्लिक करा. हे तुमच्या GitHub खात्यात नवीन रेकॉजिटरी तयार करेल ज्यात अभ्यासक्रमाची प्रत असेल.
#### तुमची रिपॉझिटरी तयार करा
तुमचे काम सहज जतन करण्यासाठी, या रिपॉझिटरीची स्वतःची प्रत तयार करणे शिफारसीय आहे. ह्या पानाच्या वरच्या बाजूला असलेल्या **Use this template** बटणावर क्लिक करून हे करता येईल. यामुळे तुमच्या GitHub खात्यात एक नवीन रिपॉझिटरी तयार होईल ज्यात अभ्यासक्रमाची प्रत असेल.
हे टप्पे पार पडा:
1. **रेकॉजिटरी फोर्क करा**: या पृष्ठाच्या उजव्या वरच्या कोपऱ्यातील "Fork" बटणावर क्लिक करा.
तुमच्या तयार केलेल्या रेकॉजिटरी मध्ये, **Code** बटणावर क्लिक करा आणि **Open with Codespaces** निवडा. हे तुमच्यासाठी नवीन Codespace तयार करेल.
तुमच्या तयार केलेल्या या रिपॉझिटरीच्या कॉपीमध्ये, **Code** बटणावर क्लिक करा आणि **Open with Codespaces** निवडा. यामुळे तुमच्यासाठी नवीन Codespace तयार होईल.
#### तुमच्या संगणकावर स्थानिकरीत्या अभ्यासक्रम कसा चालवायचा
#### तुमच्या संगणकावर स्थानिकरित्या अभ्यासक्रम चालवणे
हा अभ्यासक्रम आपल्या संगणकावर स्थानिकरीत्या चालवण्यासाठी, तुम्हाला टेक्स्ट एडिटर, ब्राउझर आणि कमांड लाइन टूल लागेल. आमचा पहिला धडा [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages) तुम्हाला या टूल्ससाठी विविध पर्यायांची माहिती देईल जे तुम्हाला सर्वोत्कृष्ट कामासाठी निवडता येतील.
हा अभ्यासक्रम आपल्या संगणकावर चालवायचा असल्यास, तुम्हाला एक व्राहक संपादक, एक ब्राऊझर आणि एक कमांड लाइन टूल लागेल. आमचा पहिला धडा, [Programming Languages and Tools of the Trade परिचय](../../1-getting-started-lessons/1-intro-to-programming-languages), तुम्हाला प्रत्येक साधनासाठी विविध पर्यायांबद्दल मार्गदर्शन करेल ज्यातून तुम्ही तुमच्यासाठी योग्य ते निवडू शकता.
आमचा सल्ला आहे की तुम्ही [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) वापरा, ज्यामध्ये एक अंतर्निर्मित [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) देखील आहे. तुम्ही Visual Studio Code येथे डाउनलोड करू शकता [येथे](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
आमची शिफारस आहे की तुम्ही [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) या एडिटरचा वापर करा, ज्यामध्ये अंगभूत [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) देखील आहे. तुम्ही Visual Studio Code [इथे](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) डाउनलोड करू शकता.
1. तुमची रेकॉजिटरी तुमच्या संगणकावर क्लोन करा. हे करण्यासाठी, **Code** बटणावर क्लिक करा आणि URL कॉपी करा:
1. तुमची रिपॉझिटरी तुमच्या संगणकावर क्लोन करा. हे करण्यासाठी **Code** बटणावर क्लिक करा आणि URL कॉपी करा:
[CodeSpace](./images/createcodespace.png)
मग, [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) मध्ये [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) उघडा आणि खालील कमांड चालवा, `<your-repository-url>` या ठिकाणी तुम्ही नुकतीच कॉपी केलेली URL टाका:
मग, [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) मध्ये [टर्मिनल](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) उघडा आणि खालील आदेश चालवा, `<your-repository-url>` या ठिकाणी तुम्ही नुकताच कॉपी केलेला URL ठेवा:
```bash
git clone <your-repository-url>
```
2. Visual Studio Code मध्ये फोल्डर उघडा. तुम्ही हे **File** > **Open Folder** वर क्लिक करून आणि तुम्ही नुकताच क्लोन केलेला फोल्डर निवडून करू शकता.
2. Visual Studio Code मध्ये फोल्डर उघडा. तुम्ही हे **File** > **Open Folder** वर क्लिक करून आणि नुकताच क्लोन केलेला फोल्डर निवडून करू शकता.
> शिफारस केलेले Visual Studio Code विस्तार:
>
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - Visual Studio Code मध्ये HTML पृष्ठांचे पूर्वावलोकन करण्यासाठी
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - कोड पटकन लिहिण्यास मदत करण्यासाठी
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - कोड जलद लिहिण्यात मदत करण्यासाठी
## 📂 प्रत्येक धडा यामध्ये समाविष्ट आहे:
## 📂 प्रत्येक धडा मध्ये समाविष्ट आहे:
- ऐच्छिक स्केचनोट
- ऐच्छिक स्केचनोट
- ऐच्छिक पूरक व्हिडिओ
- धड्यापूर्वी गरम करणारा क्विझ
- लेखी धडा
- प्रकल्पाधारित धड्यांसाठी, प्रकल्प कसा तयार करायचा याबाबत टप्प्याटप्प्याने मार्गदर्शक
- ज्ञान तपासणी
- पूर्व-धडा वॉर्मअप क्विझ
- लिखित धडा
- प्रकल्प-आधारित धड्यांसाठी, प्रकल्प कसा तयार करायचा याचे टप्प्याटप्प्याने मार्गदर्शक
> **क्विझबद्दल एक नोंद**: सर्व क्विझ "Quiz-app" फोल्डरमध्ये आहेत, प्रत्येकात तीन प्रश्नांसह एकूण 48 क्विझ. ते [येथे](https://ff-quizzes.netlify.app/web/) उपलब्ध आहेत; क्विझ अॅप स्थानिक पद्धतीने चालवू शकता किंवा Azure वर तैनात करू शकता; `quiz-app` फोल्डरमधील सूचनांचे पालन करा.
> **क्विझ विषयी एक नोट**: सर्व क्विझ Quiz-app फोल्डरमध्ये आहेत, एकूण 48 क्विझ ज्यामध्ये प्रत्येकी तीन प्रश्न आहेत. ते [येथे](https://ff-quizzes.netlify.app/web/) उपलब्ध आहेत, क्विझ अॅप स्थानिकरीत्या चालवता येऊ शकतो किंवा Azure वर तैनात करता येतो; `quiz-app` फोल्डरमधील सूचनांचे पालन करा.
## 🗃️ धडे
| | प्रकल्पाचे नाव | शिकवले जाणारे संकल्पना | शिक्षण उद्दिष्टे | लिंक केलेला धडा | लेखक |
| | प्रकल्पाचे नाव | शिकवले जाणारे संकल्पना | शिका उद्दिष्टे | लिंक केलेला धडा | लेखक |
| 01 | सुरुवात करणे | प्रोग्रामिंग परिचय आणि व्यापारातील साधने | बहुतेक प्रोग्रामिंग भाषांमागील मूलभूत तत्त्वे आणि व्यावसायिक विकसक त्यांच्या कामासाठी वापरतात अशा सॉफ्टवेअरबद्दल जाणून घ्या | [प्रोग्रामिंग भाषांचे आणि व्यापारातील साधनांचे परिचय](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | सुरुवात करणे | GitHub चे मूलभूत तत्त्वे, संघासह काम करणे | तुमच्या प्रकल्पात GitHub कसा वापरायचा, कोड बेसवर इतरांसोबत कसा सहकार्य करायचा | [GitHub परिचय](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | सुरुवात करणे | प्रवेशयोग्यता | वेब प्रवेशयोग्यतेच्या मूलभूत गोष्टी शिका | [प्रवेशयोग्यता मूलतत्त्वे](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | JS मूलभूत | JavaScript डेटा प्रकार | JavaScript डेटा प्रकारांची मूलभूत माहिती | [डेटा प्रकार](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | JS मूलभूत | फंक्शन्स आणि मेथड्स | अॅप्लिकेशनच्या लॉजिक फ्लोचे व्यवस्थापन करण्यासाठी फंक्शन्स आणि मेथड्स शिका | [फंक्शन्स आणि मेथड्स](./2-js-basics/2-functions-methods/README.md) | Jasmine आणि Christopher |
| 06 | JS मूलभूत | JS सह निर्णय कसे घ्यायचे | निर्णय घेण्याच्या पद्धती वापरून तुमच्या कोडमध्ये अटी कसे तयार करायच्या हे शिका | [निर्णय घेणे](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS मूलभूत | अॅरे आणि लूप्स | JavaScript मध्ये अॅरे आणि लूप्स वापरून डेटा कसा हाताळायचा | [अॅरे आणि लूप्स](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML प्रत्यक्षात | ऑनलाइन टेरारियम तयार करण्यासाठी HTML तयार करा, लेआउट तयार करण्यावर लक्ष केंद्रित करा | [HTML परिचय](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS प्रत्यक्षात | ऑनलाइन टेरारियमसाठी CSS तयार करा, CSS च्या मूलभूत गोष्टी आणि पृष्ठ प्रतिसादक्षम पद्धतीवर लक्ष केंद्रित करा | [CSS परिचय](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript क्लोजर्स, DOM व्यवस्थापन | ड्रॅग/ड्रॉप इंटरफेस कार्य करण्यासाठी JavaScript तयार करा, क्लोजर्स आणि DOM व्यवस्थापनावर लक्ष केंद्रित करा | [JavaScript क्लोजर्स, DOM व्यवस्थापन](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [टायपिंग गेम](./4-typing-game/solution/README.md) | टायपिंग गेम तयार करा | कीबोर्ड इव्हेंट्सचा वापर करून तुमच्या JavaScript अॅपचा लॉजिक कसा नियंत्रित करायचा हे शिका | [इव्हेंट-चालित प्रोग्रामिंग](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [ग्रीन ब्राउझर विस्तार](./5-browser-extension/solution/README.md) | ब्राउझर सह काम करणे | ब्राउझर कसे कार्य करतात, त्यांचा इतिहास, आणि ब्राउझर विस्ताराचे पहिले घटक तयार करण्याविषयी शिका | [ब्राउझर बद्दल](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [ग्रीन ब्राउझर विस्तार](./5-browser-extension/solution/README.md) | फॉर्म तयार करणे, API कॉल करणे आणि स्थानिक संग्रहात चलन जतन करणे | JavaScript चा वापर करून ब्राउझर विस्ताराचा API कॉल करा आणि स्थानिक संग्रहातील चलनांचा वापर करा | [API, फॉर्म्स आणि स्थानिक संग्रह](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [ग्रीन ब्राउझर विस्तार](./5-browser-extension/solution/README.md) | ब्राउझरमधील पार्श्वभूमी प्रक्रिया, वेब कार्यक्षमता | विस्ताराच्या चिन्हाचे व्यवस्थापन करण्यासाठी ब्राउझरच्या पार्श्वभूमी प्रक्रिया वापरा; वेब कार्यक्षमता आणि काही ऑप्टिमायझेशन्स बद्दल शिका | [पार्श्वभूमी कार्य आणि कार्यक्षमता](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [स्पेस गेम](./6-space-game/solution/README.md) | JavaScript सह अधिक प्रगत गेम विकास | क्लासेस आणि कंपोझिशन वापरून वारसा घेणे आणि Pub/Sub पॅटर्नबद्दल शिका, गेम तयार करण्यासाठी तयारी करा | [प्रगत गेम विकास परिचय](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [स्पेस गेम](./6-space-game/solution/README.md) | कॅनव्हासवर रेखांकन | स्क्रीनवर घटक रेखाटण्यासाठी वापरल्या जाणार्या Canvas API बद्दल शिका | [कॅनव्हासवर रेखाटन](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [स्पेस गेम](./6-space-game/solution/README.md) | स्क्रीनवर घटक हलविणे | कर्टिझियन समन्वय आणि Canvas API वापरून घटकांना हालचाल कशी मिळते हे शोधा | [घटक हलविणे](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [स्पेस गेम](./6-space-game/solution/README.md) | टक्कर शोधणे | की प्रेस वापरून घटकांमध्ये टक्कर येणे आणि प्रतिसाद देणे तसेच गेमच्या कार्यक्षमतेसाठी कूलडाउन फंक्शन प्रदान करणे | [टक्कर शोधणे](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [स्पेस गेम](./6-space-game/solution/README.md) | गुणांक ठेवणे | गेमच्या स्थिती आणि कार्यक्षमतेवर आधारित गणिती गणना करा | [गुणांक ठेवणे](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [स्पेस गेम](./6-space-game/solution/README.md) | गेम संपविणे आणि पुन्हा सुरू करणे | गेम संपविणे आणि पुन्हा सुरू करण्याबाबत शिका, ज्यामध्ये संसाधने स्वच्छ करणे आणि चलन रीसेट करणे समाविष्ट आहे | [समाप्ती अट](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [बँकिंग अॅप](./7-bank-project/solution/README.md) | वेब अॅपमधील HTML टेम्पलेट्स आणि मार्गदर्शन | राऊटिंग आणि HTML टेम्पलेट्सचा वापर करून बहुपृष्ठ वेबसाइटचे वास्तुकला कसे तयार करायची हे शिका | [HTML टेम्पलेट्स आणि मार्ग](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [बँकिंग अॅप](./7-bank-project/solution/README.md) | लॉगिन आणि नोंदणी फॉर्म तयार करणे | फॉर्म तयार करणे आणि व्हॅलिडेशन रूटिन हाताळण्याबद्दल शिका | [फॉर्म्स](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [बँकिंग अॅप](./7-bank-project/solution/README.md) | डेटा आणण्याचे आणि वापरण्याचे पद्धती | तुमच्या अॅपमध्ये डेटा कसा येतो आणि जातो, कसा आणायचा, संग्रहित करायचा, आणि कसा दूर करायचा याबद्दल शिका | [डेटा](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [बँकिंग अॅप](./7-bank-project/solution/README.md) | राज्य व्यवस्थापन संकल्पना | तुमचा अॅप कसा राज्य धारण करतो आणि प्रोग्रामरद्वारे कसा व्यवस्थापित करायचा हे शिका | [राज्य व्यवस्थापन](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [ब्राउझर/VScode कोड](../../8-code-editor) | VScode सोबत काम करणे | कोड एडिटर कसा वापरायचा शिका| [VScode कोड एडिटर वापरा](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI सहाय्यक](./9-chat-project/README.md) | AI सह काम करणे | तुमचा स्वतःचा AI सहाय्यक कसा तयार करायचा शिका | [AI सहाय्यक प्रकल्प](./9-chat-project/README.md) | Chris |
## 🏫 अध्यापनशास्त्र
आमचा अभ्यासक्रम दोन मुख्य अध्यापनशास्त्रीय तत्त्वे लक्षात घेऊन तयार केला आहे:
* प्रकल्पाधारित शिक्षण
| 01 | Getting Started | प्रोग्रॅमिंगची ओळख आणि कामांच्या साधनांसाठी परिचय | जास्तीत जास्त प्रोग्रॅमिंग भाषांच्या मूलभूत तत्त्वांबद्दल आणि व्यावसायिक विकसकांना मदत करणाऱ्या सॉफ्टवेअरबद्दल शिका | [प्रोग्रॅमिंग भाषांची आणि कामांच्या साधनांची ओळख](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Getting Started | GitHub च्या मूलभूत गोष्टी, ज्यामध्ये टीमसह काम करणे | तुमच्या प्रकल्पात GitHub कसा वापरायचा, कोड बेसवर इतरांसोबत सहयोग कसा करायचा | [GitHub ची ओळख](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Getting Started | प्रवेशयोग्यता | वेब प्रवेशयोग्यतेच्या मूलभूत गोष्टी शिका | [प्रवेशयोग्यता मूलतत्त्वे](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | JS Basics | JavaScript डेटा प्रकार | JavaScript डेटा प्रकारांची मूलभूत माहिती | [डेटा प्रकार](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | JS Basics | फंक्शन्स आणि मेथड्स | अॅप्लिकेशनच्या लॉजिक फ्लोचे व्यवस्थापन करण्यासाठी फंक्शन्स आणि मेथडबद्दल शिका | [फंक्शन्स आणि मेथड्स](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher |
| 06 | JS Basics | JS सह निर्णय घेणे | निर्णय घेण्याच्या पद्धती वापरून तुमच्या कोडमध्ये अटी कशा तयार कराव्यात हे शिका | [निर्णय घेणे](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS Basics | अॅरे आणि लूप्स | JavaScript मध्ये अॅरे आणि लूप वापरून डेटा कसा हाताळायचा हे शिका | [अॅरे आणि लूप्स](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML चा व्यावहारिक उपयोग | ऑनलाइन टेरॅरियम तयार करण्यासाठी HTML तयार करा, लेआउट तयार करण्यावर लक्ष केंद्रित करा | [HTML मध्ये परिचय](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS चा व्यावहारिक उपयोग | ऑनलाइन टेरॅरियमला स्टाइल करण्यासाठी CSS तयार करा, CSS च्या मूलभूत गोष्टींसह पृष्ठ प्रतिक्रियाशील बनवणे यावर लक्ष केंद्रीत करा | [CSS मध्ये परिचय](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript क्लोजर्स, DOM हाताळणी | टेरॅरियमला ड्रॅग/ड्रॉप इंटरफेससारखे कार्य करण्यासाठी JavaScript तयार करा, क्लोजर्स आणि DOM हाताळणीवर लक्ष केंद्रित करा | [JavaScript क्लोजर्स, DOM हाताळणी](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [टायपिंग गेम](./4-typing-game/solution/README.md) | टायपिंग गेम तयार करा | कीबोर्ड इव्हेंट्सचा वापर करून तुमच्या JavaScript अॅपचा लॉजिक कसा चालवायचा हे शिका | [इव्हेंट-चालित प्रोग्रॅमिंग](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [ग्रीन ब्राउझर एक्सटेंशन](./5-browser-extension/solution/README.md) | ब्राउझर्सबरोबर काम करणे | ब्राउझर्स कसे कार्य करतात, त्यांचा इतिहास, आणि ब्राउझर एक्सटेंशनचे पहिले घटक कसे तयार करायचे हे शिका | [ब्राउझर विषयी](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [ग्रीन ब्राउझर एक्सटेंशन](./5-browser-extension/solution/README.md) | फॉर्म तयार करणे, API कॉल करणे आणि स्थानिक साठवणेमध्ये व्हेरिएबल संचयित करणे | API कॉल करण्यासाठी आणि स्थानिक साठवणेमध्ये व्हेरिएबल्स वापरण्यासाठी तुमच्या ब्राउझर एक्सटेंशनचे JavaScript घटक तयार करा | [APIs, फॉर्म्स, आणि स्थानिक साठवणूक](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [ग्रीन ब्राउझर एक्सटेंशन](./5-browser-extension/solution/README.md) | ब्राउझरमधील पार्श्वभूमी प्रक्रिये, वेब कार्यक्षमता | एक्सटेंशनच्या आयकॉनचे व्यवस्थापन करण्यासाठी ब्राउझरच्या पार्श्वभूमी प्रक्रियेचा वापर करा; वेब कार्यक्षमतेबद्दल आणि सुधारणा शिकाअ | [पार्श्वभूमी कार्ये आणि कार्यक्षमते](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [अंतराळ खेळ](./6-space-game/solution/README.md) | JavaScript सह अधिक प्रगत खेळ विकास | क्लासेस आणि कंपोजिशनचा वापर करून वारसा आणि Pub/Sub पॅटर्न बद्दल शिका, खेळ तयार करण्याची तयारी म्हणून | [प्रगत खेळ विकासाची ओळख](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [अंतराळ खेळ](./6-space-game/solution/README.md) | कॅनव्हासवर रेखाटणे | स्क्रीनवर घटक रेखाटण्यासाठी वापरल्या जाणाऱ्या Canvas API बद्दल शिका | [कॅनव्हासवर रेखाटणे](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [अंतराळ खेळ](./6-space-game/solution/README.md) | स्क्रीनवर घटक हलवणे | Cartesian स्थाननिर्देश आणि Canvas API वापरून घटकांना गती कशी मिळते ते जाणून घ्या | [घटक हलवणे](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [अंतराळ खेळ](./6-space-game/solution/README.md) | टक्कर अटींचे निरीक्षण | घटकांच्या टक्करेनंतर एकमेकांना प्रतिसाद द्यायला शिका, की-प्रेस वापरून आणि खेळाची कार्यक्षमता सुनिश्चित करण्यासाठी कूलडाउन फंक्शन प्रदान करा | [टक्कर निरीक्षण](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [अंतराळ खेळ](./6-space-game/solution/README.md) | स्कोअर राखणे | खेळाच्या स्थिती आणि कार्यक्षमतेवर आधारित गणिती गणना करा | [स्कोअर राखणे](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [अंतराळ खेळ](./6-space-game/solution/README.md) | खेळ समाप्त करणे आणि पुन्हा सुरू करणे | खेळ संपविणे आणि पुन्हा सुरू करताना, साधने साफ करणे आणि व्हेरिएबल मूल्ये रीसेट करण्याबद्दल शिका | [समाप्तीची अट](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [बँकिंग अॅप](./7-bank-project/solution/README.md) | वेब अॅपमध्ये HTML टेम्पलेट्स आणि रूट्स | मल्टीपेज वेबसाइटची रचना कशी तयार करावी (राउटिंग आणि HTML टेम्पलेटस वापरून) | [HTML टेम्पलेट्स आणि रूट्स](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [बँकिंग अॅप](./7-bank-project/solution/README.md) | लॉगिन आणि नोंदणी फॉर्म तयार करा | फॉर्म तयार करणे आणि व्हॅलिडेशन प्रक्रियांचे व्यवस्थापन याबद्दल शिका | [फॉर्म्स](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [बँकिंग अॅप](./7-bank-project/solution/README.md) | डेटा मिळविण्याच्या आणि वापरण्याच्या पद्धती | तुमच्या अॅपमध्ये डेटा कसा येतो आणि जातो, कसा मिळवायचा, जिथे ठेवायचा आणि टाकून द्यायचा हे शिका | [डेटा](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [बँकिंग अॅप](./7-bank-project/solution/README.md) | स्टेट मॅनेजमेंट संकल्पना | तुमच्या अॅपमध्ये स्टेट कसा टिकवायचा आणि प्रोग्रामच्या माध्यमातून कसा व्यवस्थापित करायचा हे शिका | [स्टेट मॅनेजमेंट](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [ब्राउझर/VSकोड कोड](../../8-code-editor) | VSकोड सोबत काम | कोड एडिटर कसा वापरायचा शिका| [VSकोड कोड एडिटर वापरा](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI सहाय्यक](./9-chat-project/README.md) | AI सोबत काम | स्वतःचा AI सहाय्यक कसा तयार करायचा ते शिका | [AI सहाय्यक प्रकल्प](./9-chat-project/README.md) | Chris |
## 🏫 शिक्षणशास्त्र
आमच्या अभ्यासक्रमाची रचना दोन महत्त्वाच्या शैक्षणिक तत्त्वांवर आधारित आहे:
* प्रकल्प-आधारित शिक्षण
* वारंवार क्विझ
हा कार्यक्रम JavaScript, HTML, आणि CSS च्या मूलभूत गोष्टी तसेच आजच्या वेब विकसकांनी वापरल्या जाणार्या नवीनतम साधने आणि तंत्र शिकवतो. विद्यार्थ्यांना टायपिंग गेम, आभासी टेररियम, पर्यावरणपूरक ब्राउझर विस्तार, स्पेस-इनवेडर-शैलीचा गेम, आणि व्यवसायिकांसाठी बँकिंग अॅप तयार करून प्रत्यक्ष अनुभव मिळविण्याची संधी मिळेल. या मालिकेच्या शेवटी, विद्यार्थ्यांना वेब विकासाचे मजबूत समज प्राप्त होईल.
हा कार्यक्रम JavaScript, HTML आणि CSS यांचे मूलभूत तत्त्व शिकवतो, तसेच आजकाल वेब विकासक वापरत असलेल्या नवीनतम साधने आणि तंत्रे शिकवतो. विद्यार्थी टायपिंग गेम, आभासी टेरॅरियम, पर्यावरण-अनुकूल ब्राउझर एक्सटेंशन, अंतराळ-आक्रमक प्रकारचा गेम, आणि व्यवसायांसाठी बँकिंग अॅप तयार करून हाताळणीचा अनुभव मिळवू शकतील. या मालिकेच्या अखेरीस, विद्यार्थ्यांना वेब विकासाचा सखोल आढावा मिळेल.
> 🎓 तुम्ही या अभ्यासक्रमातील पहिले काही धडे Microsoft Learn वर [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) म्हणून घेऊ शकता!
> 🎓 तुम्ही हा अभ्यासक्रम सुरूवातीचे काही धडे Microsoft Learn वर [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) म्हणून घेतू शकता!
प्रकल्पांसह सामग्री संरेखित करून, विद्यार्थ्यांसाठी मजेशीर आणि आकर्षक प्रक्रिया तयार केली जाते आणि संकल्पनांची जपणूक वाढवली जाते. आम्ही JavaScript मूलभूत गोष्टी समजावण्यासाठी काही प्रारंभिक धडे लिहिले आहेत, ज्यात "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" व्हिडिओ ट्युटोरियल मधील काही लेखकांनी योगदान दिले आहे.
प्रकल्पांसोबत मजकूर सुसंगत ठेवून, प्रक्रिया विद्यार्थ्यांसाठी अधिक मनोरंजक होते आणि संकल्पनांची धरपकड वाढते. आम्ही JavaScript चे मूलभूत तत्त्वे समजावण्यासाठी काही सुरुवातीचे धडे लिहिले तसेच "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" या व्हिडिओ ट्युटोरियल मालिकेतील एक व्हिडिओ जोडला, ज्याचे काही लेखक या अभ्यासक्रमात योगदान देतात.
शिवाय, वर्गापूर्वी कमी-दबावाचा क्विझ नोंदणीची तयारी तयार करतो, तर वर्गानंतरचा क्विझ अधिक टिकाऊपणा सुनिश्चित करतो. हा अभ्यासक्रम लवचिक आणि मजेदार असेल आणि संपूर्ण किंवा भागांमध्ये घेतला जाऊ शकतो. प्रकल्प सुरुवातीला लहान असतात आणि 12 आठवड्यांच्या चक्राच्या शेवटी हळूहळू जास्त गुंतागुंतीचे होतात.
याशिवाय, वर्गापूर्वी असलेला कमी-दबावाचा क्विझ विद्यार्थ्यांच्या लक्षात विषय शिकण्याची तयारी तयार करतो, तर वर्गानंतरचा दुसरा क्विझ अधिक चांगले टिकवणूक सुनिश्चित करतो. हा अभ्यासक्रम लवचीक आणि आनंददायी आहे आणि पूर्णपणे किंवा भागाने घेतला जाऊ शकतो. प्रकल्प सुरुवातीला लहान आणि १२ आठवड्यांच्या चक्राच्या शेवटी अधिक गुंतागुंतीचा होतो.
आम्ही जाणूनबुजून JavaScript फ्रेमवर्क परिचय टाळल्याने वेब विकसक म्हणून मूलभूत कौशल्यांवर लक्ष केंद्रित केले आहे, फ्रेमवर्क स्वीकारण्यापूर्वी; या अभ्यासक्रमाला पूर्ण करण्याचा चांगला पुढील टप्पा म्हणजे Node.js बद्दल दुसऱ्या व्हिडिओ संचाद्वारे शिकणे: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
आम्ही जावास्क्रिप्ट फ्रेमवर्क परिचय देण्याचे उद्दिष्ट टाळले जेणेकरून प्राथमिक वेब विकासक कौशल्यांवर लक्ष केंद्रित ठेवले जाऊ शकेल; हा अभ्यासक्रम पूर्ण केल्यानंतर पुढील चांगला टप्पा म्हणजे Node.js बद्दल शिकणे "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)" या व्हिडिओ मालिकेद्वारे.
> आमच्या [आचारसंहिता](CODE_OF_CONDUCT.md) आणि [योगदान](CONTRIBUTING.md) मार्गदर्शक तत्वे पाहा. तुमचे रचनात्मक अभिप्राय स्वागतार्ह आहे!
> आमच्या [व्यवहार संहिता](CODE_OF_CONDUCT.md) आणि [योगदान](CONTRIBUTING.md) मार्गदर्शक तत्त्वे पहा. तुमची रचनात्मक अभिप्रेते आम्ही स्वागत करतो!
## 🧭 ऑफलाइन प्रवेश
तुम्ही या दस्तऐवजाला ऑफलाइन [Docsify](https://docsify.js.org/#/) वापरून चालवू शकता. हा रेपो फोर्क करा, तुमच्या स्थानिक मशीनवर [Docsify स्थापित करा](https://docsify.js.org/#/quickstart), नंतर या रेपोच्या मूळ फोल्डरमध्ये `docsify serve` टाकून चालवा. वेबसाईट तुमच्या लोकलहोस्टवर पोर्ट 3000 वर सेवा देईल: `localhost:3000`.
तुम्ही [Docsify](https://docsify.js.org/#/) वापरून हा दस्तऐवज ऑफलाइन चालवू शकता. या रेपोचा फोर्क करा, तुमच्या स्थानिक संगणकावर [Docsify स्थापित करा](https://docsify.js.org/#/quickstart), आणि नंतर या रेपोच्या मुळ फोल्डरमध्ये `docsify serve` टाइप करा. वेबसाइट तुमच्या लोकलहोस्टवर पोर्ट 3000 वर सेवा देईल: `localhost:3000`.
## 📘 PDF
सर्व धड्यांचा PDF [येथे](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) उपलब्ध आहे.
सर्व धड्यांचे PDF [येथे](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) मिळू शकते.
## 🎒 इतर कोर्सेस
आमचे टीम इतर अभ्यासक्रम देखील तयार करते! येथे पाहा:
आमची टीम इतर कोर्सेस तयार करते! पाहा:
<!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain
[](https://aka.ms/langchain4j-for-beginners)
[](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin)
[](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin)
---
### Azure / Edge / MCP / Agents
@ -246,23 +249,23 @@ Azure AI Foundry Discord समुदायात सहभागी व्ह
जर तुम्हाला अडचण आल्यास किंवा AI अॅप्स विकसित करताना काही प्रश्न असतील. तर MCP बद्दलचे चर्चांमध्ये शिका आणि अनुभवी विकासकांसोबत सहभागी व्हा. ही एक सहायक समुदाय आहे जिथे प्रश्न विचारले जातात आणि ज्ञान मोकळेपणाने वाटले जाते.
जर तुम्हाला अडकले असेल किंवा AI अॅप्स तयार करताना काही प्रश्न असतील. MCP बद्दल चर्चांमध्ये सहकारी शिकणाऱ्यां आणि अनुभवी विकसकांमध्ये सामील व्हा. ही एक सहायक समुदाय आहे जिथे प्रश्न विचारणे स्वागतार्ह असते आणि ज्ञान मोकळेपणाने वाटले जाते.
हा रेपॉझिटरी MIT परवान्याअंतर्गत परवाना आहे. अधिक माहितीसाठी [LICENSE](../../LICENSE) फाइल पाहा.
हा रिपॉझिटरी MIT परवान्यांतर्गत परवानगी दिला गेला आहे. अधिक माहितीकरिता [LICENSE](../../LICENSE) फाइल पहा.
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**अस्वीकरण**:
हा दस्तऐवज AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) वापरून अनुवादित केलेला आहे. आम्ही नेहमीच अचूकतेसाठी प्रयत्न करतो, तरी कृपया लक्षात घ्या की स्वयंचलित अनुवादांमध्ये चुका किंवा असत्यता असू शकते. मूळ दस्तऐवज त्याच्या स्थानिक भाषेत अधिकृत स्रोत मानावा. महत्त्वाच्या माहितीसाठी व्यावसायिक मानवी अनुवादाची शिफारस केली जाते. या अनुवादाच्या वापरातून उद्भवणाऱ्या कोणत्याही गैरसमजुतीसाठी किंवा चुकीच्या अर्थनिर्देशासाठी आम्ही जबाबदार नाही.
**अस्वीकरण**:
हा दस्तऐवज AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) चा वापर करून अनुवादित करण्यात आला आहे. आम्ही अचूकतेसाठी प्रयत्न करतो, पण कृपया लक्षात ठेवा की स्वयंचलित अनुवादांमध्ये चुका किंवा अस्वस्थता असू शकते. मूळ दस्तऐवज त्याच्या स्थानिक भाषेत अधिकृत स्रोत मानला पाहिजे. महत्त्वाची माहिती असल्यास व्यावसायिक मानवी अनुवाद करविणे शिफारसीय आहे. या अनुवादाच्या वापरामुळे उद्भवलेल्या कोणत्याही गैरसमजुती किंवा चुकीच्या अर्थनिर्देशांसाठी आम्ही जबाबदार नाही.
यो वेब विकासको आधारभूत ज्ञान सिकाउनका लागि तयार गरिएको शैक्षिक पाठ्यक्रमको भण्डार हो। पाठ्यक्रम माइक्रोसफ्ट क्लाउड एड्भोकेट्सद्वारा विकसित गरिएको १२ हप्ताको व्यापक कोर्स हो, जसमा जाभास्क्रिप्ट, CSS, र HTML समेटिएका २४ व्यावहारिक पाठहरू छन्।
यसले वेब विकासको आधारभूत कुराहरू सिकाउने शैक्षिक पाठ्यक्रम भण्डार हो जुन शुरुवातीहरूको लागि तयार गरिएको छ। यस पाठ्यक्रमले Microsoft Cloud Advocates द्वारा विकास गरिएको १२ साताको पूर्ण पाठ्यक्रम समावेश गर्दछ, जसमा २४ व्यावहारिक पाठहरू छन् जुन JavaScript, CSS, र HTML समेट्छ।
### मुख्य घटकहरू
- **शैक्षिक सामग्री**: परियोजनामा आधारित मोड्युलहरूमा व्यवस्थित २४ संरचित पाठहरू
- **व्यावहारिक परियोजनाहरू**: टेरारियम, टाइपिङ गेम, ब्राउजर एक्सटेन्सन, स्पेस गेम, बैंकिङ एप, कोड एडिटर, र AI च्याट सहायक
- **इन्टरएक्टिभ क्विजहरू**: प्रत्येक पाठको लागि ३ प्रश्नसहित ४८ क्विजहरू (पाठ अघि/पछिको मूल्याङ्कन)
- **बहुभाषा समर्थन**: GitHub Actions मार्फत ५०+ भाषाहरूमा स्वचालित अनुवाद
- `5-browser-extension/README.md` - ब्राउजर एक्सटेन्सन विकास
- `6-space-game/README.md` - क्यानभास-आधारित गेम विकास
- `9-chat-project/README.md` - AI च्याट सहायक परियोजना
- `6-space-game/README.md` - क्यानभास-आधारित खेल विकास
- `9-chat-project/README.md` - AI चैट सहायक परियोजना
### मोनोरिपो संरचना
यद्यपि यो परम्परागत मोनोरिपो होइन, यो भण्डारमा धेरै स्वतन्त्र परियोजनाहरू समावेश छन्:
- प्रत्येक पाठ आत्म-निहित छ
- परियोजनाहरूले निर्भरता साझा गर्दैनन्
- व्यक्तिगत परियोजनाहरूमा काम गर्दा अरूमा असर गर्दैन
पारंपरिक मोनोरिपो नभए पनि यस भण्डारमा धेरै स्वतन्त्र परियोजनाहरू छन्:
- प्रत्येक पाठ स्वयंपूर्ण छ
- परियोजनाहरू निर्भरता साझा गर्दैनन्
- अन्य परियोजनाहरूलाई असर नगरी व्यक्तिगत परियोजनामा काम गर्न सकिन्छ
- पूर्ण पाठ्यक्रम अनुभवका लागि सम्पूर्ण भण्डार क्लोन गर्नुहोस्
---
**अस्वीकरण**:
यो दस्तावेज़ AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) प्रयोग गरी अनुवाद गरिएको हो। हामी यथासम्भव सटीकता सुनिश्चित गर्न प्रयास गर्छौं, तर कृपया ध्यान दिनुहोस् कि स्वचालित अनुवादहरूमा त्रुटिहरू वा अशुद्धताहरू हुन सक्छन्। यसको मूल भाषामा रहेको मूल दस्तावेज़लाई आधिकारिक स्रोत मानिनुपर्छ। महत्वपूर्ण जानकारीका लागि, व्यावसायिक मानव अनुवाद सिफारिस गरिन्छ। यस अनुवादको प्रयोगबाट उत्पन्न हुने कुनै पनि गलतफहमी वा गलत व्याख्याको लागि हामी जिम्मेवार हुने छैनौं।
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**अस्वीकरण**:
यो दस्तावेज AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) प्रयोग गरी अनुवाद गरिएको हो। हामी शुद्धताका लागि प्रयासरत छौं भने पनि, कृपया ध्यान दिनुहोस् कि स्वचालित अनुवादमा त्रुटि वा अस्फुटता हुनसक्छ। मूल दस्तावेज यसको मूल भाषामा अधिकृत स्रोत मानिनु पर्छ। महत्वपूर्ण जानकारीका लागि व्यावसायिक मानव अनुवाद सिफारिस गरिन्छ। यस अनुवादको प्रयोगबाट उत्पन्न कुनै पनि गलतफहमी वा गलत व्याख्याका लागि हामी जिम्मेवार નથી।
माइक्रोसफ्ट क्लाउड एड्भोकेट्स द्वारा प्रदान गरिएको हाम्रो १२ हप्ताको समग्र पाठ्यक्रमसँग वेब विकासका आधारभूत कुरा सिक्नुहोस्। २४ वटा पाठहरू प्रत्येकमा जाभास्क्रिप्ट, CSS, र HTML लाई प्रायोगात्मक परियोजनाहरू जस्तै टेरारियम, ब्राउजर एक्सटेन्शन, र अन्तरिक्ष खेलहरू मार्फत गहिराइमा अध्ययन गरिएको छ। क्विजहरू, छलफलहरू, र व्यावहारिक कार्यहरूमा संलग्न हुनुहोस्। हाम्रो प्रभावकारी परियोजना-आधारित शिक्षण विधिसँग तपाईंको सीप सुधार गर्नुहोस् र ज्ञानको अवधारणालाई अप्टिमाइज गर्नुहोस्। आजै आफ्नो कोडिङ यात्रा सुरु गर्नुहोस्!
Microsoft Cloud Advocates द्वारा तयार गरिएको हाम्रो १२ साता लामो व्यापक पाठ्यक्रम संग वेब विकासका आधारहरू सिक्नुहोस्। प्रत्येक २४ पाठहरूमा JavaScript, CSS, र HTML लाई प्रायोगात्मक परियोजनाहरू जस्तै टेरारियम, ब्राउजर एक्सटेन्सन, र अन्तरिक्ष खेलहरू मार्फत गहिराइमा जानिन्छ। क्विजहरू, कुराकानीहरू, र व्यावहारिक कर्तव्यहरूसँग संलग्न हुनुहोस्। हाम्रो प्रभावकारी परियोजना-आधारित शिक्षण विधि संग आफ्नो सीप बढाउनुहोस् र ज्ञानको सम्झना सुधार गर्नुहोस्। आजै आफ्नो कोडिङ यात्रा शुरू गर्नुहोस्!
Azure AI Foundry Discord समुदायमा सहभागिता जनाउनुहोस्
> git sparse-checkout set --no-cone '/*' '!translations' '!translated_images'
> ```
> यसले तपाईंलाई कोर्स पूरा गर्न आवश्यक सबै कुरा दिन्छ र छिटो डाउनलोड गरिन्छ।
> यसले तपाईँलाई पाठ्यक्रम पूरा गर्न सबै कुरा दिन्छ, र डाउनलोड धेरै छिटो हुन्छ।
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**यदि तपाईं थप अनुवाद भाषाहरू समर्थन गर्न चाहनुहुन्छ भने ती [यहाँ](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md) सूचीबद्ध छन्**
**अझै थप अनुवाद भाषाहरू चाहनुहुन्छ भने, [यहाँ](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md) मा सूचीबद्ध छन्**
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑🎓 _के तपाईं विद्यार्थी हुनुहुन्छ?_
[**स्टुडेन्ट हब पृष्ठमा जानुहोस्**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) जहाँ तपाईंले आरम्भकर्ताका लागि स्रोतहरू, विद्यार्थी प्याकहरू र निःशुल्क प्रमाणपत्र भाउचर प्राप्त गर्ने तरिकाहरू पाउनुहुनेछ। यो पृष्ठ तपाईंले पोस्ट गर्नुपर्ने र समय-समयमा जाँच गर्नु पर्ने पृष्ठ हो किनभने हामी हरेक महिनामा सामग्री परिवर्तन गर्दैछौं।
[**Student Hub पृष्ठ**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) भ्रमण गर्नुहोस् जहाँ तपाईँले शुरुवाती स्रोतहरू, विद्यार्थी प्याकहरू र निःशुल्क प्रमाणपत्र भाउचर प्राप्त गर्ने तरिकाहरू पाउनुहुनेछ। यो पृष्ठ तपाईँले बुकमार्क गर्नु पर्ने हो र नियमित रूपमा अनुप्रयोग बदल्दा जाँच गर्नुहोस्।
### 📣 घोषणा - नयाँ GitHub Copilot Agent मोड चुनौतीहरू पूरा गर्न!
### 📣 घोषणा - नयाँ GitHub Copilot Agent मोड चुनौतीहरू पूरा गर्नुहोस्!
नयाँ चुनौती थपिएको छ, धेरै अध्यायहरूमा "GitHub Copilot Agent चुनौती 🚀" हेर्नुहोस्। यो GitHub Copilot र Agent मोड प्रयोग गरेर तपाईंले पूरा गर्नुपर्ने नयाँ चुनौती हो। यदि तपाईंले पहिला Agent मोड प्रयोग गर्नुभएन भने यसको क्षमता केवल पाठ मात्र उत्पन्न गर्नु छैन, यसले फाइलहरू बनाउन र सम्पादन गर्न, कमाण्डहरू चलाउन र अन्य धेरै गर्न सक्छ।
नयाँ चुनौती थपिएको छ, अधिकतर अध्यायहरूमा "GitHub Copilot Agent Challenge 🚀" खोज्नुहोस्। यो GitHub Copilot र Agent मोड प्रयोग गरेर पूरा गर्ने नयाँ चुनौती हो। यदि तपाईंले पहिले Agent मोड प्रयोग गर्नुभएन भने, यो केवल पाठ सिर्जना गर्ने मात्र होइन, फाइलहरू बनाउन र सम्पादन गर्न, कमाण्डहरू चलाउन र अझ धेरै गर्न सक्षम छ।
### 📣 घोषणा - _नयाँ परियोजना जनरेटिभ AI प्रयोग गरी निर्माण गर्ने_
### 📣 घोषणा - _जनरेटिभ AI प्रयोग गरी नयाँ परियोजना_ निर्माण गर्न
नयाँ AI सहायक परियोजना भर्खरै थपिएको छ, यो परियोजना [यहाँ](./9-chat-project/README.md) जाँच गर्नुहोस्।
नयाँ AI सहायक परियोजना थपिएको छ, जाँच गर्नुहोस् [परियोजना](./9-chat-project/README.md)
### 📣 घोषणा - _नयाँ पाठ्यक्रम_ जनरेटिभ AI को लागि जाभास्क्रिप्टमा भर्खरै जारी गरिएको
### 📣 घोषणा - _जनरेटिभ AI को नयाँ पाठ्यक्रम_ JavaScript का लागि जारी गरिएको छ
हाम्रो नयाँ जनरेटिभ AI पाठ्यक्रम नछुट्नुहोस्!
हाम्रो नयाँ जनरेटिभ AI पाठ्यक्रम नछुटाउनुहोस्!
शुरू गर्न यहाँ जानुहोस् [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)!
शुरू गर्न भ्रमण गर्नुहोस् [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)!
प्रत्येक पाठमा पूरा गर्नुपर्ने एउटा असाइनमेन्ट, ज्ञान जाँच, र चुनौती समावेश छ, जसले तपाईंलाई यी विषयहरू सिक्न गाइड गर्छ:
- प्रॉम्प्टिङ र प्रॉम्प्ट ईन्जिनियरिङ
- पाठ र छवि एप उत्पादन
प्रत्येक पाठमा पूरा गर्न कर्तव्य, ज्ञान जाँच र चुनौती समावेश छ, सिकाइका विषयहरूलाई मार्गदर्शन गर्न:
- प्रॉम्प्टिङ र प्रॉम्प्ट इन्जिनियरिङ
- पाठ र छवि एप निर्माण
- खोज एपहरू
शुरु गर्न यहाँ जानुहोस् [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)
शुरू गर्न भ्रमण गर्नुहोस् [https://aka.ms/genai-js-course](../../[https:/aka.ms/genai-js-course)!
## 🌱 सुरु गर्ने तरिका
## 🌱 सुरु गर्दै
> **शिक्षकहरू**, हामीले [यस पाठ्यक्रमलाई कसरी प्रयोग गर्ने बारे केही सुझावहरू](for-teachers.md) समावेश गरेका छौं। हामी तपाईंको प्रतिक्रिया [हाम्रो छलफल फोरम](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner) मा पाउन इच्छुक छौं!
> **शिक्षकहरू**, हामीले [केहि सुझावहरू](for-teachers.md) समावेश गरेका छौं यो पाठ्यक्रम कसरी प्रयोग गर्ने भनेर। कृपया [हाम्रो चर्चा फोरममा](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner) तपाईँको प्रतिक्रिया दिनुहोस्!
**[अध्यार्थीहरू](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, प्रत्येक पाठको लागि, प्रि-लेक्चर क्विजबाट सुरु गर्नुहोस् र व्याख्यान सामग्री पढ्दै, विभिन्न गतिविधिहरू पूरा गर्दै र पोस्ट-लेक्चर क्विजसँग बुझाइ जाँच गर्दै अघि बढ्नुहोस्।
**[विद्यार्थीहरू](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, प्रत्येक पाठको लागि, प्रि-लेक्चर क्विजबाट सुरु गर्नुहोस् र त्यसपछि व्याख्यान सामग्री पढ्नुहोस्, विभिन्न गतिविधिहरू पूरा गर्नुहोस् र पोस्ट-लेक्चर क्विजमार्फत आफ्नो बुझाइ परीक्षण गर्नुहोस्।
तपाईंको सिकाइ अनुभव बढाउन, तपाईंका साथीहरूसँग परियोजनाहरूमा सँगै काम गर्न जडान हुनुहोस्! छलफलहरू हाम्रो [चर्चा फोरम](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) मा प्रोत्साहित गरिन्छ जहाँ हाम्रा मोडरेटर टोली तपाईंका प्रश्नहरूको उत्तर दिन उपलब्ध रहनेछ।
तपाईँको सिकाइ अनुभव बढाउन, आफ्नो सहपाठीहरूसँग जोडिनुहोस् र परियोजनाहरू सँगै काम गर्नुहोस्! कुराकानीहरूलाई हाम्रो [चर्चा फोरममा](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) प्रोत्साहित गरिएको छ जहाँ हाम्रो मध्यस्थहरूको टिम तपाईँका प्रश्नहरूको जवाफ दिन तयार हुनेछ।
अझै पनि तपाईंको शिक्षालाई अगाडि बढाउन, हामी प्रबल सुझाव दिन्छौं कि तपाईं [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) मा थप अध्ययन सामग्री अन्वेषण गर्नुहोस्।
आफ्नो शिक्षालाई अझ अगाडि बढाउन, हामी कडा मन पराउछौं कि तपाईँ [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) मा अन्य अध्ययन सामग्रीहरू अन्वेषण गर्नुहोस्।
### 📋 तपाईंको वातावरण सेटअप गर्ने
### 📋 आफ्नो वातावरण सेटअप गर्दै
यो पाठ्यक्रमसँग विकास वातावरण तयार छ! तपाईं सुरु गर्दा, तपाईंले पाठ्यक्रमलाई [Codespace](https://github.com/features/codespaces/) मा चलाउन रोज्न सक्नुहुन्छ (_ब्राउजर-आधारित, कुनै इन्स्टल आवश्यक छैन वातावरण_), वा आफ्नो कम्प्युटरमा [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) जस्तो टेक्स्ट एडिटर प्रयोग गरेर स्थानीय रूपमा चलाउन सक्नुहुन्छ।
यस पाठ्यक्रमसँग विकास वातावरण तयार छ! सुरु गर्दा तपाईँले पाठ्यक्रमलाई [Codespace](https://github.com/features/codespaces/) मा चलाउन सक्नुहुन्छ (_ब्राउजर-आधारित, कुनै स्थापना आवश्यक छैन_), या आफ्नो कम्प्युटरमा [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) जस्ता टेक्स्ट एडिटर प्रयोग गरेर पनि चलाउन सक्नुहुन्छ।
#### आफ्नो रेपोजिटरी सिर्जना गर्नुहोस्
आफ्नो काम सजिलै सुरक्षित गर्नको लागि, यो सुझाव दिइन्छ कि तपाईंले यस रेपोजिटरीको आफ्नै प्रतिलिपि सिर्जना गर्नुहोस्। तपाईं यो पृष्ठको माथि रहेको **Use this template** बटन क्लिक गरेर गर्न सक्नुहुन्छ। यसले तपाईंको GitHub खातामा पाठ्यक्रमको एक प्रतिलिपि सहित नयाँ रेपोजिटरी सिर्जना गर्नेछ।
#### आफ्नो रिपोजिटरी सिर्जना गर्नुहोस्
आफ्नो काम सजिलै सुरक्षित राख्न, आफ्नो प्रतिलिपि बनाएर यस रिपोजिटरीलाई क्लोन गर्ने सल्लाह दिइन्छ। यसका लागि पृष्ठको माथिपट्टि रहेको **Use this template** बटन क्लिक गर्नुहोस्। यसले तपाईँको GitHub खातामा पाठ्यक्रमको प्रतिलिपि सहित नयाँ रिपोजिटरी बनाउनेछ।
यी कदमहरू पालना गर्नुहोस्:
1. **रेपोजिटरी फरक गर्नुहोस्**: यो पृष्ठको माथि-दायाँ कुनामा रहेको "Fork" बटनमा क्लिक गर्नुहोस्।
तपाईंले सिर्जना गरेको यस रेपोजिटरीको प्रतिलिपिमा, **Code** बटन क्लिक गरी **Open with Codespaces** चयन गर्नुहोस्। यसले तपाईंको लागि नयाँ Codespace सिर्जना गर्नेछ।
तपाईंले सिर्जना गरेको यस रिपोजिटरीमा, **Code** बटनमा क्लिक गर्नुस् र **Open with Codespaces** चयन गर्नुस्। यसले तपाईँका लागि नयाँ Codespace बनाउनेछ।
#### आफ्नै कम्प्युटरमा पाठ्यक्रम स्थानीय रूपमा चलाउने
#### आफ्नो कम्प्युटरमा स्थानीय रूपमा पाठ्यक्रम चलाउनुहोस्
यो पाठ्यक्रम स्थानीय रूपमा चलाउन तपाईंलाई टेक्स्ट एडिटर, ब्राउजर र कमाण्ड लाइन उपकरण आवश्यक पर्छ। हाम्रो पहिलो पाठ, [परिचय: प्रोग्रामिङ भाषाहरू र उपकरणहरू](../../1-getting-started-lessons/1-intro-to-programming-languages) ले यी उपकरणहरूको विभिन्न विकल्पहरूमा तपाईंलाई मार्गदर्शन गर्नेछ ताकि तपाईंलाई सबैभन्दा राम्रो के हो छान्न सक्नुहोस्।
तपाईंको कम्प्युटरमा स्थानीय रूपमा यो पाठ्यक्रम चलाउन, तपाईंलाई टेक्स्ट एडिटर, ब्राउजर र कमाण्ड लाइन उपकरण आवश्यक पर्छ। हाम्रो पहिलो पाठ, [प्रोग्रामिङ भाषा र उपकरणहरूको परिचय](../../1-getting-started-lessons/1-intro-to-programming-languages), तपाईंलाई यी उपकरणहरूका विभिन्न विकल्पहरू मार्फत हिंड्नेछ जुन तपाईंका लागि सबै भन्दा उपयुक्त छान्न सक्नुहुनेछ।
हाम्रो सुझाव छ [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) प्रयोग गर्नुहोस्, जसमा निर्मित [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) पनि छ। तपाईं Visual Studio Code यहाँबाट डाउनलोड गर्न सक्नुहुन्छ: [यहाँ](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
हामी [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) लाई तपाईंको एडिटरका रूपमा प्रयोग गर्न सिफारिस गर्छौं, जसमा निर्मित [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) पनि छ। तपाईंले Visual Studio Code यहाँबाट डाउनलोड गर्न सक्नुहुन्छ: [यहाँ](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)।
1. आफ्नो रेपोजिटरी आफ्नो कम्प्युटरमा क्लोन गर्नुहोस्। तपाईं यो गर्न सक्नुहुन्छ **Code** बटन क्लिक गरी URL प्रतिलिपि गरेर:
1. आफ्नो रिपोजिटरी कम्प्युटरमा क्लोन गर्नुस्। यसका लागि **Code** बटनमा क्लिक गरी URL कपी गर्नुहोस्:
[CodeSpace](./images/createcodespace.png)
त्यसपछि, [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) भित्र [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) खोल्नुहोस् र तलको आदेश चलाउनुहोस्, जहाँ `<your-repository-url>`लाई तपाईँले भर्खरै कपी गरेको URL द्वारा प्रतिस्थापन गर्नुहोस्:
त्यसपछि, [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) भित्र [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) खोल्नुहोस् र तलको आदेश चलाउनुहोस्, जहाँ `<your-repository-url>`तपाईंले भर्खरै कपी गरेको URL सँग प्रतिस्थापन गर्नुहोस्:
```bash
git clone <your-repository-url>
```
2. Visual Studio Code मा फोल्डर खोल्नुहोस्। तपाईं यसो गर्न सक्नुहुन्छ **File** > **Open Folder** क्लिक गरेर र भर्खर क्लोन गरिएको फोल्डर चयन गरेर।
2. Visual Studio Code मा फोल्डर खोल्नुहोस्। तपाईंले **File** > **Open Folder** मा क्लिक गरेर र भर्खर क्लोन गरेको फोल्डर चयन गरेर यो गर्न सक्नुहुन्छ।
> सिफारिस गरिएको Visual Studio Code एक्सटेन्सनहरू:
> सिफारिस गरिएका Visual Studio Code एक्सटेन्सनहरू:
>
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - Visual Studio Code भित्र HTML पृष्ठहरूको पूर्वावलोकन गर्न
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - कोड छिटो लेख्न सहयोग गर्न
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - तपाईंलाई छिटो कोड लेख्न सहयोग गर्न
## 📂 प्रत्येक पाठमा समावेश छन्:
- वैकल्पिक स्केचनोट
- वैकल्पिक स्केचनोट
- वैकल्पिक पूरक भिडियो
- पाठअघि वार्मअप क्विज
- पाठ पूर्व तातो-तपाई क्विज
- लिखित पाठ
- प्रोजेक्ट-आधारित पाठहरूमा, प्रोजेक्ट कसरी निर्माण गर्ने भनेर कदम-दर-कदम गाइडहरू
- परियोजना-आधारित पाठहरूको लागि, परियोजना कसरी बनाउने चरण-द्वारा-चरण मार्गदर्शनहरू
> **क्विजहरू सम्बन्धी एउटा नोट**: सबै क्विजहरू Quiz-app फोल्डरमा राखिएका छन्, कुल ४८ क्विजहरू छन्, प्रत्येकमा तीन प्रश्नहरू छन्। तिनीहरू यहाँ उपलब्ध छन् [यहाँ](https://ff-quizzes.netlify.app/web/) क्विज एप्लिकेशनलाई स्थानीय रूपमा चलाउन सकिन्छ वा Azure मा तैनाथ गर्न सकिन्छ; `quiz-app` फोल्डरमा निर्देशनहरू पालना गर्नुहोस्।
> **क्विजहरू सम्बन्धी नोट**: सबै क्विजहरू Quiz-app फोल्डरमा सङ्ग्रहित छन्, तीन प्रश्नहरू सहित ४८ कुल क्विजहरू। तिनीहरू [यहाँ](https://ff-quizzes.netlify.app/web/) उपलब्ध छन्; क्विज एप स्थानीय रूपमा चलाउन सकिन्छ वा Azure मा डिप्लॉय गर्न सकिन्छ; `quiz-app` फोल्डरमा निर्देशनहरू पछ्याउनुहोस्।
## 🗃️ पाठहरू
| | प्रोजेक्ट नाम | सिकाइ अवधारणाहरू | सिकाइ उद्देश्यहरू | लिंक गरिएको पाठ | लेखक |
| | परियोजनाको नाम | सिकाइका अवधारणाहरू | सिकाइ उद्देश्यहरू | लिंक गरिएको पाठ | लेखक |
| 01 | सुरूवात गर्दै | प्रोग्रामिङ र उपकरणहरूको परिचय | प्रायः प्रोग्रामिङ भाषाहरूको आधारभूत अवधारणाहरू सिक्नुहोस् र पेशेवर विकासकर्ताहरूलाई सहयोग गर्ने सफ्टवेयरहरूको बारेमा जान्नुहोस् | [प्रोग्रामिङ भाषाहरू र उपकरणहरूको परिचय](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | सुरूवात गर्दै | GitHub का आधारभूत कुरा, टिमसँग काम गर्ने प्रक्रिया | तपाईंको प्रोजेक्टमा GitHub कसरी प्रयोग गर्ने, कसरी सहयोग गर्ने सिक्नुहोस् | [GitHub परिचय](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | सुरूवात गर्दै | पहुँचयोग्यता | वेब पहुँचयोग्यताको आधारभूत कुरा सिक्नुहोस् | [पहुँचयोग्यता आधारभूत कुरा](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 05 | JS आधारभूत | क्रियाहरू र मेथडहरू | एप्लिकेशनको लॉजिक फ्लो व्यवस्थापन गर्न क्रियाहरू र मेथडहरूको बारेमा जान्नुहोस् | [क्रियाहरू र मेथडहरू](./2-js-basics/2-functions-methods/README.md) | Jasmine र Christopher |
| 06 | JS आधारभूत | JS सँग निर्णय लिनु | आफ्नो कोडमा निर्णय-निर्माण विधिहरू प्रयोग गरेर सर्तहरू कसरी बनाउने जान्नुहोस् | [निर्णय लिनु](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS आधारभूत | एरेहरू र लूपहरू | JavaScript मा एरेहरू र लूपहरूको माध्यमबाट डाटा प्रशोधन गर्नुहोस् | [एरेहरू र लूपहरू](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML अभ्यासमा | अनलाइन टेरारियम सिर्जना गर्न HTML बनाउनुस्, लेआउट बनाउनेमा केन्द्रित | [HTML परिचय](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS अभ्यासमा | अनलाइन टेरारियमको शैली निर्धारण गर्न CSS बनाउनुहोस्, CSS का आधारभूत कुरा र पृष्ठ प्रतिक्रियाशील बनाउन केन्द्रित | [CSS परिचय](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript क्लोजरहरू, DOM ह्यान्डलिङ | ड्र्याग/ड्रप इन्टरफेसका लागि टेरारियम काम गर्ने JavaScript बनाउनुहोस्, क्लोजर र DOM ह्यान्डलिङमा केन्द्रित | [JavaScript क्लोजरहरू, DOM ह्यान्डलिङ](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [टाइपिङ खेल](./4-typing-game/solution/README.md) | टाइपिङ खेल बनाउनुहोस् | तपाईंको JavaScript एपको लॉजिक चलाउन किबोर्ड घटनाहरू कसरी प्रयोग गर्ने जान्नुहोस् | [इभेन्ट-ड्राइभन प्रोग्रामिङ](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [हरियो ब्राउजर एक्सटेन्सन](./5-browser-extension/solution/README.md) | ब्राउजरसँग काम गर्दै | ब्राउजरहरू कसरी काम गर्छन्, तिनीहरूको इतिहास र पहिलो एक्सटेन्सन तत्वहरू कसरी तयार गर्ने जान्नुहोस् | [ब्राउजरहरूबारे](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [हरियो ब्राउजर एक्सटेन्सन](./5-browser-extension/solution/README.md) | फारम बनाउने, API कल गर्ने र स्थानीय स्टोरेजमा भेरिएबलहरू भण्डारण गर्ने | API कल गर्न स्थानीय स्टोरेजमा भण्डारण गरिएको भेरिएबलहरू प्रयोग गरेर तपाईंको ब्राउजर एक्सटेन्सनका JavaScript तत्वहरू बनाउनुहोस् | [API, फारम, र स्थानीय स्टोरेज](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [हरियो ब्राउजर एक्सटेन्सन](./5-browser-extension/solution/README.md) | ब्राउजरको पृष्ठभूमि प्रक्रियाहरू, वेब प्रदर्शन | एक्सटेन्सनको आइकन व्यवस्थापन गर्न ब्राउजरको पृष्ठभूमि प्रक्रियाहरू प्रयोग गर्नुहोस्; वेब प्रदर्शन र केही अनुकूलनहरूबारे जान्नुहोस् | [पृष्ठभूमि कार्यहरू र प्रदर्शन](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [स्पेस खेल](./6-space-game/solution/README.md) | JavaScript सँग थप उन्नत खेल विकास | कक्षाहरू र संयोजन दुवै प्रयोग गरेर इनहेरिटेन्स र Pub/Sub ढाँचाका बारेमा जान्नुहोस्, खेल विकासको तयारीमा | [उन्नत खेल विकासको परिचय](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [स्पेस खेल](./6-space-game/solution/README.md) | क्यानभासमा रेखाचित्र खिच्ने | स्क्रिनमा तत्वहरू खिच्न क्यानभास API का बारेमा जान्नुहोस् | [क्यानभासमा रेखाचित्र](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [स्पेस खेल](./6-space-game/solution/README.md) | स्क्रिन वरिपरि तत्वहरू सराउने | कसरि तत्वहरू कर्टेसियन निर्देशांक र क्यानभास API प्रयोग गरेर चलाउन सकिन्छ पत्ता लगाउनुहोस् | [तत्वहरू सराउने](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [स्पेस खेल](./6-space-game/solution/README.md) | ठक्कर पत्ता लगाउने | तत्वहरूलाई ठक्कर लाग्ने र एक अर्कामा प्रतिक्रिया जनाउने बनाउनुहोस् कि बटन थिचेपछि र खेलको प्रदर्शन सुनिश्चित गर्न कूलडाउन क्षमता दिनुहोस् | [ठक्कर पत्ता लगाउने](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [स्पेस खेल](./6-space-game/solution/README.md) | स्कोर राख्ने | खेलको स्थिति र प्रदर्शन आधारमा गणितीय गणना प्रदर्शन गर्नुहोस् | [स्कोर राख्ने](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [स्पेस खेल](./6-space-game/solution/README.md) | खेल समाप्त र पुनः सुरु गर्ने | खेल समाप्त गर्ने र पुनः सुरु गर्ने बारे जान्नुहोस्, जसमा स्रोतहरू सफा पार्ने र भेरिएबल मानहरू रिसेट गर्ने समावेश छ | [अन्त्य सर्त](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [बैंकिङ एप](./7-bank-project/solution/README.md) | वेब एपमा HTML टेम्प्लेट र रूटहरू | बहुपृष्ठ वेबसाइटको रचना गर्न राउटिङ र HTML टेम्प्लेटहरू कसरी बनाउने सिक्नुहोस् | [HTML टेम्प्लेट र रूटहरू](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [बैंकिङ एप](./7-bank-project/solution/README.md) | लगइन र दर्ता फारम बनाउने | फारम बनाउने र प्रमाणीकरण प्रक्रिया ह्यान्डल गर्ने सिक्नुहोस् | [फारमहरू](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [बैंकिङ एप](./7-bank-project/solution/README.md) | डाटा ल्याउने र प्रयोग गर्ने तरिका | तपाईंको एपमा डाटा कसरी आउँछ र जान्छ, कसरी ल्याउने, भण्डारण गर्ने र नष्ट गर्ने जान्नुहोस् | [डाटा](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [बैंकिङ एप](./7-bank-project/solution/README.md) | राज्य व्यवस्थापनका अवधारणाहरू | तपाईंको एपले राज्यलाई कसरी राख्छ र यसलाई प्रोग्रामिङ्गमार्फत कसरी व्यवस्थापन गर्ने जान्नुहोस् | [राज्य व्यवस्थापन](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [ब्राउजर/VScode कोड](../../8-code-editor) | VScode सँग काम गर्दै | कोड सम्पादक प्रयोग गर्ने विधि सिक्नुहोस्| [VScode कोड सम्पादक उपयोग](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI सहायकहरू](./9-chat-project/README.md) | AI सँग काम गर्दै | आफ्नो AI सहायक कसरी बनाउने सिक्नुहोस् | [AI सहायक प्रोजेक्ट](./9-chat-project/README.md) | Chris |
## 🏫 पिडागोजी
हाम्रो पाठ्यक्रम दुई प्रमुख शिक्षाशास्त्रीय सिद्धान्तहरूसँग डिजाइन गरिएको छ:
| 01 | सुरूवात गर्दै | प्रोग्रामिङ र उपकरणहरूको परिचय | धेरै प्रोग्रामिङ भाषाहरूको आधारभूत सिद्धान्तहरू र व्यावसायिक विकासकर्ताहरूलाई सहयोग गर्ने सफ्टवेयरहरू सिक्नुहोस् | [प्रोग्रामिङ भाषाहरू र उपकरणहरूको परिचय](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | सुरूवात गर्दै | GitHub को आधारभूत ज्ञान, टिम सँग काम गर्ने तरिका | तपाईंको परियोजनामा GitHub प्रयोग गर्ने तरिका, कोड आधारमा अरू सँग कसरी सहकार्य गर्ने | [GitHub परिचय](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | सुरूवात गर्दै | पहुँचयोग्यता | वेब पहुँचयोग्यताको आधारभूत कुरा सिक्नुहोस् | [पहुँचयोग्यता आधारभूत](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 05 | JS आधारहरू | फङ्क्शन र मेथडहरू | अनुप्रयोगको तर्क प्रवाह व्यवस्थापन गर्न फङ्क्शन र मेथडहरूको बारेमा सिक्नुहोस् | [फङ्क्शन र मेथडहरू](./2-js-basics/2-functions-methods/README.md) | Jasmine र Christopher |
| 06 | JS आधारहरू | JS सँग निर्णय बनाउने | निर्णय-निर्माण विधिहरू प्रयोग गरेर तपाईंको कोडमा सर्तहरू कसरी बनाउन सिक्नुहोस् | [निर्णय बनाउने](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS आधारहरू | एर्रे र लूपहरू | JavaScript मा एर्रे र लूपहरू प्रयोग गरेर डाटासँग काम गर्नुहोस् | [एर्रे र लूपहरू](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [टेरारियम](./3-terrarium/solution/README.md) | HTML अभ्यासमा | अनलाइन टेरारियम बनाउन HTML सिर्जना गर्नुहोस्, लेआउट निर्माणमा ध्यान दिँदै | [HTML परिचय](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [टेरारियम](./3-terrarium/solution/README.md) | CSS अभ्यासमा | अनलाइन टेरारियमको लागि CSS शैली बनाउनुहोस्, CSS का आधारहरू र पृष्ठलाई प्रतिक्रियाशील बनाउने तरिकामा केन्द्रित | [CSS परिचय](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [टेरारियम](./3-terrarium/solution/README.md) | JavaScript क्लोजरहरू, DOM व्यवस्थापन | टेरारियमलाई ड्र्याग/ड्रप इन्टरफेस बनाउन JavaScript लेख्नुहोस्, क्लोजरहरू र DOM व्यवस्थापनमा केन्द्रित | [JavaScript क्लोजरहरू, DOM व्यवस्थापन](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [टाइपिंग गेम](./4-typing-game/solution/README.md) | टाइपिंग गेम बनाउने | तपाईंको JavaScript एपको तर्क चलाउने कीबोर्ड घटना कसरी प्रयोग गर्ने सिक्नुहोस् | [इभेन्ट-ड्राइभन प्रोग्रामिङ](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [ग्रीन ब्राउजर एक्सटेन्सन](./5-browser-extension/solution/README.md) | ब्राउजरसँग काम गर्ने | ब्राउजरहरू कसरी काम गर्छन्, तिनीहरूको इतिहास, र पहिलो ब्राउजर एक्सटेन्सनका तत्वहरू कसरी स्क्याफोल्ड गर्ने सिक्नुहोस् | [ब्राउजरका बारेमा](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [ग्रीन ब्राउजर एक्सटेन्सन](./5-browser-extension/solution/README.md) | फर्म बनाउने, API कल गर्ने र स्थानीय स्टोरेजमा भेरिएबलहरू भण्डारण गर्ने | API कल गर्न र स्थानीय स्टोरेजमा स्टोर गरिएका भेरिएबलहरू प्रयोग गरेर तपाईंको ब्राउजर एक्सटेन्सनका JavaScript तत्वहरू बनाउनुहोस् | [API, फर्महरू, र स्थानीय स्टोरेज](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [ग्रीन ब्राउजर एक्सटेन्सन](./5-browser-extension/solution/README.md) | ब्राउजरमा पृष्ठभूमि प्रक्रियाहरू, वेब प्रदर्शन | एक्सटेन्सनको आइकन व्यवस्थापन गर्न ब्राउजरका पृष्ठभूमि प्रक्रियाहरू प्रयोग गर्नुहोस्; वेब प्रदर्शन र केही अप्टिमाइजेशनहरूबारे जान्नुहोस् | [पृष्ठभूमि कार्य र प्रदर्शन](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [स्पेस गेम](./6-space-game/solution/README.md) | JavaScript सँग थप उन्नत गेम विकास | इनहेरेन्टेन्स, क्लास र कम्पोजिसन दुवै प्रयोग गरेर, र Pub/Sub ढाँचाको बारेमा सिक्नुहोस्, गेम बनाउन तयारीका लागि | [उन्नत गेम विकास परिचय](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [स्पेस गेम](./6-space-game/solution/README.md) | क्यानभासमा चित्रांकन | क्यानभास API को बारेमा जान्नुहोस्, जसले स्क्रिनमा तत्वहरू चित्रित गर्न प्रयोग हुन्छ | [क्यानभासमा चित्रण](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [स्पेस गेम](./6-space-game/solution/README.md) | स्क्रिनमा तत्वहरू सर्नु | कर्टिसियन निर्देशांक र क्यानभास API प्रयोग गरेर तत्वहरूलाई गतिशील बनाउन सिक्नुहोस् | [तत्वहरू सार्ने](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [स्पेस गेम](./6-space-game/solution/README.md) | ठक्कर पहिचान | कीप्रेस प्रयोग गरेर तत्वहरूलाई ठोक्किन र अनुरूप प्रतिक्रिया दिनुहोस्; खेलको प्रदर्शन सुनिश्चित गर्न कूलडाउन कार्य दिनुहोस् | [ठक्कर पहिचान](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [स्पेस गेम](./6-space-game/solution/README.md) | स्कोर राख्नु | खेलको स्थिति र प्रदर्शनमा आधारित गणितीय गणना गर्नुहोस् | [स्कोर राख्ने](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [स्पेस गेम](./6-space-game/solution/README.md) | खेल अन्त्य र पुनः सुरु गर्ने | खेल अन्त्य गर्ने र पुनः सुरु गर्ने तरिका, सम्पत्ति सफा गर्ने र भेरिएबल मानहरू रिसेट गर्ने सिक्नुहोस् | [अन्त्य अवस्था](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [बैंकिङ एप](./7-bank-project/solution/README.md) | वेब एपमा HTML टेम्प्लेट र रुट्स | मल्टिपेज वेबसाइटको संरचना रुटिङ र HTML टेम्प्लेटहरू प्रयोग गरेर कसरी बनाउने सिक्नुहोस् | [HTML टेम्प्लेट र रुट्स](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [बैंकिङ एप](./7-bank-project/solution/README.md) | लगइन र दर्ता फर्म बनाउने | फर्महरू बनाउने र भ्यालिडेसन प्रक्रिया कसरी संचालन गर्ने सिक्नुहोस् | [फर्महरू](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [बैंकिङ एप](./7-bank-project/solution/README.md) | डाटा ल्याउने र प्रयोग गर्ने विधिहरू | तपाईंको एपमा डाटा कसरी आउँछ र जान्छ, कसरी ल्याउने, भण्डारण गर्ने र नष्ट गर्ने | [डाटा](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [बैंकिङ एप](./7-bank-project/solution/README.md) | स्टेट म्यानेजमेन्टका अवधारणाहरू | तपाईंको एपले कसरी स्टेटलाई राख्छ र प्रोग्रामिङबाट कसरी व्यवस्थापन गर्ने सिक्नुहोस् | [स्टेट म्यानेजमेन्ट](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [ब्राउजर/VScode कोड](../../8-code-editor) | VScode सँग काम गर्ने | कोड सम्पादक कसरी प्रयोग गर्ने जान्नुहोस् | [VScode कोड सम्पादक प्रयोग गर्दै](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI सहायकहरू](./9-chat-project/README.md) | AI सँग काम गर्ने | आफ्नै AI सहायक कसरी बनाउने जान्नुहोस् | [AI सहायक परियोजना](./9-chat-project/README.md) | Chris |
## 🏫 पेडागोजी
हाम्रो पाठ्यक्रम दुई प्रमुख शैक्षिक सिद्धान्तहरूका साथ डिजाइन गरिएको छ:
* परियोजना-आधारित सिकाइ
* बारम्बार क्विजहरू
कार्यक्रमले JavaScript, HTML, र CSS का आधारभूत कुरा सिकाउँछ, साथै आजका वेब विकासकर्ताहरूले प्रयोग गर्ने नवीनतम उपकरण र प्रविधिहरू पनि। विद्यार्थीहरूलाई टाइपिङ खेल, भर्चुअल टेरारियम, वातावरणमैत्री ब्राउजर एक्सटेन्सन, अन्तरिक्ष-आक्रमण शैलीको खेल, र व्यवसायका लागि बैंकिङ एप निर्माण गरेर व्यावहारिक अनुभव विकसित गर्ने अवसर प्राप्त हुन्छ। श्रृंखलाको अन्त्यसम्म, विद्यार्थीहरूले वेब विकासको गहिरो समझ प्राप्त गर्नेछन्।
कार्यक्रमले JavaScript, HTML, र CSS का आधारभूत कुरा सिकाउँछ, साथै आजको वेब विकासकर्ताहरूले प्रयोग गर्ने नयाँ उपकरण र प्रविधिहरू पनि सिकाउँछ। विद्यार्थीहरूले टाइपिङ खेल, भर्चुअल टेरारियम, इको-मैत्री ब्राउजर एक्सटेन्सन, स्पेस-इनभेडर शैलीको खेल, र व्यवसायका लागि बैंकिङ एप निर्माण गरेर व्यावहारिक अनुभव प्राप्त गर्ने मौका पाउँछन्। श्रृंखलाको अन्त्यसम्म विद्यार्थीहरूले वेब विकासमा बलियो बुझाइ हासिल गर्नेछन्।
> 🎓 तपाईं Microsoft Learn मा [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) को रूपमा यस पाठ्यक्रमका पहिलो केही पाठहरू लिन सक्नुहुन्छ!
> 🎓 तपाईं Microsoft Learn मा यो पाठ्यक्रमका पहिलो केही पाठहरूलाई [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) को रूपमा लिन सक्नुहुन्छ!
सामग्री परियोजनासँग सुसंगत हुनाले प्रक्रिया विद्यार्थीहरूको लागि रमाईलो र अवधारणाहरूको सम्झना अझ मजबुत बनाउने हुन्छ। हामीले JavaScript आधारभूत कुराहरू सिकाउने प्रारम्भिक पाठहरू पनि लेखेका छौं, जसमा "[Beginner Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" भिडियो ट्युटोरियलको एउटा भिडियो रहेको छ, जसका केही लेखकहरूले यो पाठ्यक्रममा योगदान दिएका छन्।
सुनिश्चित गर्दै कि सामग्री परियोजनाहरू संग मेल खान्छ, प्रक्रिया विद्यार्थीहरूका लागि अधिक रमाईलो बन्छ र अवधारणाहरूको सम्झना बढ्छ। हामीले केही शुरूवाती पाठहरू JavaScript आधारहरूमा लेखेका छौं जसले अवधारणाहरू परिचय गराउँछ, एक भिडियो "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" सँग जोडिएको, जसका केही लेखकहरूले यस पाठ्यक्रममा योगदान दिएका छन्।
थप रूपमा, कक्षाबाट अघि सक्ने एक क्विजले विद्यार्थीलाई सिकाइ दिशामा तयार पार्छ, भने कक्षापछि दोस्रो क्विजले अवधारणाको थप सम्झना सुनिश्चित गर्छ। यो पाठ्यक्रम लचिलो र रमाईलो रूपमा डिजाइन गरिएको छ र यो पूरै वा अंशमा लिन सकिन्छ। परियोजनाहरू सानोबाट सुरु भएर १२ हप्ते अवधिसम्म जटिल बन्दै जान्छन्।
थप रूपमा, कक्षाको पहिलेको कम-जोखिम क्विजले विद्यार्थीलाई विषय सिक्नको लक्ष्य निर्धारण गर्छ, र कक्षापछि दोस्रो क्विजले थप सम्झना सुनिश्चित गर्छ। यो पाठ्यक्रम लचकदार र रमाईलो हुने गरी डिजाइन गरिएको छ र पूर्ण वा आंशिक रूपमा लिन सकिन्छ। परियोजनाहरू साना सुरु हुँदै १२ हप्ता अवधिको अन्त्यमा क्रमशः जटिल बन्छन्।
हामीले जानबूजेर JavaScript फ्रेमवर्कहरू नसमेटी वेब विकासकर्ता बन्नका लागि आवश्यक आधारभूत सीपहरूमा केन्द्रित छौँ, फ्रेमवर्क सिक्नुअघि। राम्रो अर्को कदम यस पाठ्यक्रम पूरा गर्न Node.js सिक्नु हो, भिडियोहरूको अर्को संग्रहको माध्यमबाट: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
हामीले जानबुझेर JavaScript फ्रेमवर्कहरू परित्याग गरेका छौं ताकि आधारभूत कौशलहरूमा ध्यान दिन सकियोस्, तर यस पाठ्यक्रम पूरा गर्ने अर्को राम्रो कदम भनेको Node.js को बारेमा सिक्नु हो, अर्को भिडियो संग्रह "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)" मार्फत।
> हाम्रो [Code of Conduct](CODE_OF_CONDUCT.md) र [Contributing](CONTRIBUTING.md) निर्देशनहरू अवलोकन गर्नुहोस्। हामी तपाईंको रचनात्मक प्रतिक्रिया स्वागत गर्दछौँ!
> हाम्रो [अचारसंहिता](CODE_OF_CONDUCT.md) र [योगदान](CONTRIBUTING.md) दिशानिर्देशहरू हेर्नुहोस्। हामी तपाईंको सकारात्मक प्रतिक्रिया स्वागत गर्दछौं!
## 🧭 अफलाइन पहुँच
तपाईं [Docsify](https://docsify.js.org/#/) प्रयोग गरेर यो दस्तावेजलाई अफलाइन पनि चलाउन सक्नुहुन्छ। यस रिपोजिटोरीलाई फोर्क गर्नुहोस्, आफ्नो स्थानीय मेसिनमा [Docsify स्थापना गर्नुहोस्](https://docsify.js.org/#/quickstart), र त्यसपछि यस रिपोजिटोरीको मूल फोल्डरमा `docsify serve` टाइप गर्नुहोस्। वेबसाइट स्थानीयहोस्ट: `localhost:3000` को पोर्ट ३००० मा सेवा हुनेछ।
तपाईं [Docsify](https://docsify.js.org/#/) प्रयोग गरेर यो कागजात अफलाइन चलाउन सक्नुहुन्छ। यो रिपो फोर्क गर्नुहोस्, [Docsify स्थापना गर्नुहोस्](https://docsify.js.org/#/quickstart) आफ्नो स्थानीय मेसिनमा, अनि यो रिपोको मूल फोल्डरमा `docsify serve` टाइप गर्नुहोस्। वेबसाइट तपाईंको लोकलहोस्टमा पोर्ट 3000 मा सेवा हुनेछ: `localhost:3000`।
## 📘 PDF
सबै पाठहरूको PDF यहाँ फेला पार्न सकिन्छ [यहाँ](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf)।
सबै पाठहरूको PDF [यहाँ](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) फेला पार्न सकिन्छ।
## 🎒 अन्य कोर्सहरू
हाम्रो टोलीले अन्य कोर्सहरू उत्पादन गर्दछ! जाँच गर्नुहोस्:
हाम्रो टिम अन्य पाठ्यक्रमहरू उत्पादन गर्दछ! जाँच गर्नुहोस्:
<!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain
[](https://aka.ms/langchain4j-for-beginners)
[](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin)
[](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin)
यदि तपाईं अड्कनुहुन्छ वा AI अनुप्रयोगहरू निर्माण गर्दा कुनै प्रश्नहरू छन् भने, MCP सम्बन्धी छलफलहरूमा साथी सिक्नेहरू र अनुभवी विकासकर्ताहरूसँग जडान हुनुहोस्। यो एक सहयोगात्मक समुदाय हो जहाँ प्रश्नहरू स्वागत छन् र ज्ञान स्वतन्त्र रूपमा साझा गरिन्छ।
यदि तपाईं अड्किनुभयो वा AI एपहरू निर्माण गर्ने बारेमा कुनै प्रश्नहरू छन् भने। अन्य सिक्नेहरू र अनुभवी विकासकर्ताहरूसँग MCP सम्बन्धी छलफलहरूमा सहभागी हुनुहोस्। यो एउटा सहयोगी समुदाय हो जहाँ प्रश्नहरू स्वागतयोग्य छन् र ज्ञान स्वतन्त्र रूपमा साझा गरिन्छ।
यो रिपोजिटोरी MIT अनुमति अन्तर्गत लाइसेन्स प्राप्त छ। थप जानकारीका लागि [LICENSE](../../LICENSE) फाइल हेर्नुहोस्।
यो रिपोजिटरी MIT लाइसेन्स अन्तर्गत लाइसेन्स गरिएको छ। थप जानकारीका लागि [LICENSE](../../LICENSE) फाइल हेर्नुहोस्।
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**अपवाद**:
यो दस्तावेज़ AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) को प्रयोग गरी अनुवाद गरिएको हो। हामी शुद्धताको प्रयास गर्दछौं, तर कृपया ध्यान दिनुहोस् कि स्वचालित अनुवादहरूमा त्रुटिहरू वा असत्यताहरू हुन सक्छन्। मूल दस्तावेज़ यसको मूल भाषामा आधिकारिक स्रोतको रूपमा मानिनुपर्छ। महत्वपूर्ण जानकारीका लागि व्यावसायिक मानव अनुवाद सिफारिस गरिन्छ। यस अनुवादको प्रयोगबाट उत्पन्न कुनै पनि गलतफहमी वा गलत व्याख्याका लागि हामी जिम्मेवार छैनौं।
**अस्वीकरण**:
यो दस्तावेज AI अनुवाद सेवा [Co-op Translator](https://github.com/Azure/co-op-translator) को प्रयोग गरी अनुवाद गरिएको हो। हामी शुद्धताको लागि प्रयासरत छौं भने पनि कृत्रिम अनुवादमा त्रुटिहरू वा अशुद्धिहरू हुन सक्नेछ। मूल दस्तावेज यसको आफ्नै भाषामा आधिकारिक स्रोत मानिनुपर्छ। महत्वपूर्ण जानकारीको लागि व्यावसायिक मानव अनुवाद सिफारिस गरिन्छ। यस अनुवादको प्रयोगबाट उत्पन्न कुनै पनि भ्रम वा गलत अर्थ लगाउने कुराहरूका लागि हामी जिम्मेवार छैनौं।
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
ਸਭ ਪਾਠਾਂ ਦੀ PDF [ਇੱਥੇ](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) ਮਿਲ ਸਕਦੀ ਹੈ।
ਸਾਰੇ ਪਾਠਾਂ ਦੀ PDF ਫਾਈਲ ਇੱਥੇ ਮਿਲ ਸਕਦੀ ਹੈ: [ਇੱਥੇ](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf)।
## 🎒 ਹੋਰ ਕੋਰਸ
ਸਾਡੀ ਟੀਮ ਹੋਰ ਕੋਰਸ ਬਣਾਉਂਦੀ ਹੈ! ਦੇਖੋ:
## 🎒 ਹੋਰ ਕੋਰਸز
ਸਾਡੀ ਟੀਮ ਹੋਰ ਕੋਰਸز ਤਿਆਰ ਕਰਦੀ ਹੈ! ਜ਼ਰੂਰ ਦੇਖੋ:
<!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain
[](https://aka.ms/langchain4j-for-beginners)
[](https://aka.ms/langchainjs-for-beginners?WT.mc_id=m365-94501-dwahlin)
[](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin)