|
|
2 months ago | |
|---|---|---|
| .. | ||
| 1-getting-started-lessons | 2 months ago | |
| 2-js-basics | 2 months ago | |
| 3-terrarium | 2 months ago | |
| 4-typing-game | 3 months ago | |
| 5-browser-extension | 2 months ago | |
| 6-space-game | 3 months ago | |
| 7-bank-project | 2 months ago | |
| 8-code-editor/1-using-a-code-editor | 2 months ago | |
| 9-chat-project | 3 months ago | |
| Git-Basics | 2 months ago | |
| docs | ||
| lesson-template | ||
| memory-game | 2 months ago | |
| quiz-app | ||
| AGENTS.md | 2 months ago | |
| CODE_OF_CONDUCT.md | ||
| CONTRIBUTING.md | ||
| README.md | 2 months ago | |
| SECURITY.md | ||
| SUPPORT.md | ||
| _404.md | ||
| for-teachers.md | 2 months ago | |
README.md
शुरुआती लोगों के लिए वेब डेवलपमेंट - एक पाठ्यक्रम
Microsoft Cloud Advocates द्वारा तैयार किए गए हमारे 12-सप्ताह के व्यापक कोर्स के साथ वेब डेवलपमेंट की मूल बातें सीखें। प्रत्येक 24 पाठों में JavaScript, CSS और HTML को प्रोजेक्ट्स जैसे टेरारियम, ब्राउज़र एक्सटेंशन और स्पेस गेम्स के माध्यम से समझाया गया है। क्विज़, चर्चाओं और व्यावहारिक असाइनमेंट्स के साथ जुड़ें। अपनी स्किल्स को बेहतर बनाएं और प्रोजेक्ट-आधारित शिक्षण पद्धति के साथ अपने ज्ञान को अधिकतम करें। आज ही अपनी कोडिंग यात्रा शुरू करें!
Azure AI Foundry Discord समुदाय में शामिल हों
इन संसाधनों का उपयोग शुरू करने के लिए निम्नलिखित चरणों का पालन करें:
- रेपो को फोर्क करें: क्लिक करें
- रेपो को क्लोन करें:
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git - Azure AI Foundry Discord में शामिल हों और विशेषज्ञों और अन्य डेवलपर्स से मिलें
🌐 बहु-भाषा समर्थन
GitHub Action के माध्यम से समर्थित (स्वचालित और हमेशा अपडेटेड)
French | Spanish | German | Russian | Arabic | Persian (Farsi) | Urdu | Chinese (Simplified) | Chinese (Traditional, Macau) | Chinese (Traditional, Hong Kong) | Chinese (Traditional, Taiwan) | Japanese | Korean | Hindi | Bengali | Marathi | Nepali | Punjabi (Gurmukhi) | Portuguese (Portugal) | Portuguese (Brazil) | Italian | Polish | Turkish | Greek | Thai | Swedish | Danish | Norwegian | Finnish | Dutch | Hebrew | Vietnamese | Indonesian | Malay | Tagalog (Filipino) | Swahili | Hungarian | Czech | Slovak | Romanian | Bulgarian | Serbian (Cyrillic) | Croatian | Slovenian | Ukrainian | Burmese (Myanmar)
यदि आप अतिरिक्त भाषाओं में अनुवाद चाहते हैं, तो समर्थित भाषाओं की सूची यहां उपलब्ध है।
🧑🎓 क्या आप छात्र हैं?
Student Hub पेज पर जाएं, जहां आपको शुरुआती संसाधन, छात्र पैक और यहां तक कि मुफ्त प्रमाणपत्र वाउचर प्राप्त करने के तरीके मिलेंगे। यह वह पेज है जिसे आप बुकमार्क करना चाहेंगे और समय-समय पर जांचना चाहेंगे क्योंकि हम मासिक रूप से सामग्री बदलते हैं।
📣 घोषणा - जेनरेटिव AI का उपयोग करके नया प्रोजेक्ट बनाएं
नया AI सहायक प्रोजेक्ट अभी जोड़ा गया है, इसे देखें प्रोजेक्ट
📣 घोषणा - जेनरेटिव AI पर नया पाठ्यक्रम JavaScript के लिए अभी जारी किया गया है
हमारा नया जेनरेटिव AI पाठ्यक्रम देखना न भूलें!
शुरू करने के लिए https://aka.ms/genai-js-course पर जाएं!
- पाठ जो मूल बातें से लेकर RAG तक सब कुछ कवर करते हैं।
- GenAI और हमारे साथी ऐप का उपयोग करके ऐतिहासिक पात्रों के साथ बातचीत करें।
- मजेदार और आकर्षक कहानी, आप समय यात्रा करेंगे!
प्रत्येक पाठ में शामिल हैं:
- प्रॉम्प्टिंग और प्रॉम्प्ट इंजीनियरिंग
- टेक्स्ट और इमेज ऐप जनरेशन
- सर्च ऐप्स
शुरू करने के लिए https://aka.ms/genai-js-course पर जाएं!
🌱 शुरुआत करना
शिक्षकों, हमने इस पाठ्यक्रम का उपयोग करने के लिए कुछ सुझाव शामिल किए हैं। हमें आपके फीडबैक की आवश्यकता है हमारे चर्चा मंच में!
सीखने वाले, प्रत्येक पाठ के लिए, प्री-लेक्चर क्विज़ से शुरू करें और लेक्चर सामग्री पढ़ने, विभिन्न गतिविधियों को पूरा करने और पोस्ट-लेक्चर क्विज़ के साथ अपनी समझ की जांच करने के साथ आगे बढ़ें।
अपने सीखने के अनुभव को बढ़ाने के लिए, अपने साथियों के साथ प्रोजेक्ट्स पर काम करें! चर्चाओं को हमारे चर्चा मंच में प्रोत्साहित किया जाता है, जहां हमारे मॉडरेटर आपकी सवालों का जवाब देने के लिए उपलब्ध होंगे।
अपनी शिक्षा को आगे बढ़ाने के लिए, हम Microsoft Learn का पता लगाने की अत्यधिक अनुशंसा करते हैं, जहां अतिरिक्त अध्ययन सामग्री उपलब्ध है।
📋 अपने वातावरण को सेट करना
यह पाठ्यक्रम एक तैयार विकास वातावरण के साथ आता है! जब आप शुरू करते हैं, तो आप इस पाठ्यक्रम को Codespace (एक ब्राउज़र-आधारित, बिना इंस्टॉल की आवश्यकता वाला वातावरण) में या अपने कंप्यूटर पर स्थानीय रूप से एक टेक्स्ट एडिटर जैसे Visual Studio Code का उपयोग करके चला सकते हैं।
अपना रेपो बनाएं
अपने काम को आसानी से सहेजने के लिए, यह अनुशंसा की जाती है कि आप इस रेपो की अपनी कॉपी बनाएं। आप पेज के शीर्ष पर Use this template बटन पर क्लिक करके ऐसा कर सकते हैं। यह आपके GitHub खाते में पाठ्यक्रम की एक कॉपी के साथ एक नया रेपो बनाएगा।
इन चरणों का पालन करें:
- रेपो को फोर्क करें: इस पेज के शीर्ष-दाएं कोने में "Fork" बटन पर क्लिक करें।
- रेपो को क्लोन करें:
git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
Codespace में पाठ्यक्रम चलाना
इस रेपो की अपनी कॉपी में, जिसे आपने बनाया है, Code बटन पर क्लिक करें और Open with Codespaces चुनें। यह आपके काम करने के लिए एक नया Codespace बनाएगा।
अपने कंप्यूटर पर स्थानीय रूप से पाठ्यक्रम चलाना
इस पाठ्यक्रम को अपने कंप्यूटर पर स्थानीय रूप से चलाने के लिए, आपको एक टेक्स्ट एडिटर, एक ब्राउज़र और एक कमांड लाइन टूल की आवश्यकता होगी। हमारा पहला पाठ, प्रोग्रामिंग भाषाओं और टूल्स का परिचय, आपको इन टूल्स के विभिन्न विकल्पों के माध्यम से मार्गदर्शन करेगा ताकि आप अपने लिए सबसे अच्छा विकल्प चुन सकें।
हमारी अनुशंसा है कि आप Visual Studio Code का उपयोग करें, जिसमें एक अंतर्निहित टर्मिनल भी है। आप यहां से Visual Studio Code डाउनलोड कर सकते हैं।
-
अपने रेपो को अपने कंप्यूटर पर क्लोन करें। आप Code बटन पर क्लिक करके और URL कॉपी करके ऐसा कर सकते हैं:
फिर, Visual Studio Code में टर्मिनल खोलें और निम्नलिखित कमांड चलाएं,
<your-repository-url>को उस URL से बदलें जिसे आपने अभी कॉपी किया है:git clone <your-repository-url> -
Visual Studio Code में फोल्डर खोलें। आप File > Open Folder पर क्लिक करके और उस फोल्डर को चुनकर ऐसा कर सकते हैं जिसे आपने अभी क्लोन किया है।
अनुशंसित Visual Studio Code एक्सटेंशन:
- Live Server - Visual Studio Code के भीतर HTML पेजों का पूर्वावलोकन करने के लिए
- Copilot - कोड को तेजी से लिखने में मदद करने के लिए
📂 प्रत्येक पाठ में शामिल हैं:
- वैकल्पिक स्केच नोट
- वैकल्पिक पूरक वीडियो
- प्री-लेसन वार्मअप क्विज़
- लिखित पाठ
- प्रोजेक्ट-आधारित पाठों के लिए, प्रोजेक्ट बनाने के लिए चरण-दर-चरण गाइड
- ज्ञान जांच
- एक चुनौती
- पूरक पढ़ाई
- असाइनमेंट
- पोस्ट-लेसन क्विज़
क्विज़ के बारे में एक नोट: सभी क्विज़
Quiz-appफ़ोल्डर में हैं, कुल 48 क्विज़ हैं, प्रत्येक में तीन प्रश्न। ये यहां उपलब्ध हैं। क्विज़ ऐप को लोकल पर चलाया जा सकता है या Azure पर डिप्लॉय किया जा सकता है;quiz-appफ़ोल्डर में दिए गए निर्देशों का पालन करें।
🗃️ पाठ
| प्रोजेक्ट का नाम | सिखाए जाने वाले कॉन्सेप्ट्स | सीखने के उद्देश्य | लिंक्ड पाठ | लेखक | |
|---|---|---|---|---|---|
| 01 | शुरुआत करें | प्रोग्रामिंग और टूल्स का परिचय | अधिकांश प्रोग्रामिंग भाषाओं के पीछे के मूल सिद्धांतों और उस सॉफ़्टवेयर के बारे में जानें जो पेशेवर डेवलपर्स को उनके काम में मदद करता है | प्रोग्रामिंग भाषाओं और टूल्स का परिचय | जैस्मिन |
| 02 | शुरुआत करें | GitHub की मूल बातें, टीम के साथ काम करना | अपने प्रोजेक्ट में GitHub का उपयोग कैसे करें, कोड बेस पर दूसरों के साथ सहयोग कैसे करें | GitHub का परिचय | फ्लोर |
| 03 | शुरुआत करें | एक्सेसिबिलिटी | वेब एक्सेसिबिलिटी की मूल बातें जानें | एक्सेसिबिलिटी फंडामेंटल्स | क्रिस्टोफर |
| 04 | JS बेसिक्स | जावास्क्रिप्ट डेटा प्रकार | जावास्क्रिप्ट डेटा प्रकार की मूल बातें | डेटा प्रकार | जैस्मिन |
| 05 | JS बेसिक्स | फंक्शन्स और मेथड्स | एप्लिकेशन के लॉजिक फ्लो को प्रबंधित करने के लिए फंक्शन्स और मेथड्स के बारे में जानें | फंक्शन्स और मेथड्स | जैस्मिन और क्रिस्टोफर |
| 06 | JS बेसिक्स | जावास्क्रिप्ट के साथ निर्णय लेना | निर्णय लेने के तरीकों का उपयोग करके अपने कोड में कंडीशन्स कैसे बनाएं | निर्णय लेना | जैस्मिन |
| 07 | JS बेसिक्स | एरेज़ और लूप्स | जावास्क्रिप्ट में एरेज़ और लूप्स का उपयोग करके डेटा के साथ काम करें | एरेज़ और लूप्स | जैस्मिन |
| 08 | टेरारियम | HTML का अभ्यास | ऑनलाइन टेरारियम बनाने के लिए HTML बनाएं, लेआउट बनाने पर ध्यान केंद्रित करें | HTML का परिचय | जेन |
| 09 | टेरारियम | CSS का अभ्यास | ऑनलाइन टेरारियम को स्टाइल करने के लिए CSS बनाएं, CSS की मूल बातें सहित पेज को रिस्पॉन्सिव बनाना | CSS का परिचय | जेन |
| 10 | टेरारियम | जावास्क्रिप्ट क्लोज़र्स, DOM मैनिपुलेशन | टेरारियम को ड्रैग/ड्रॉप इंटरफेस के रूप में कार्य करने के लिए जावास्क्रिप्ट बनाएं, क्लोज़र्स और DOM मैनिपुलेशन पर ध्यान केंद्रित करें | जावास्क्रिप्ट क्लोज़र्स, DOM मैनिपुलेशन | जेन |
| 11 | टाइपिंग गेम | टाइपिंग गेम बनाएं | अपने जावास्क्रिप्ट ऐप के लॉजिक को चलाने के लिए कीबोर्ड इवेंट्स का उपयोग करना सीखें | इवेंट-ड्रिवन प्रोग्रामिंग | क्रिस्टोफर |
| 12 | ग्रीन ब्राउज़र एक्सटेंशन | ब्राउज़र्स के साथ काम करना | जानें कि ब्राउज़र कैसे काम करते हैं, उनका इतिहास, और ब्राउज़र एक्सटेंशन के पहले तत्वों को कैसे स्कैफोल्ड करें | ब्राउज़र्स के बारे में | जेन |
| 13 | ग्रीन ब्राउज़र एक्सटेंशन | फॉर्म बनाना, API कॉल करना और लोकल स्टोरेज में वेरिएबल्स स्टोर करना | अपने ब्राउज़र एक्सटेंशन के जावास्क्रिप्ट तत्वों को लोकल स्टोरेज में स्टोर किए गए वेरिएबल्स का उपयोग करके API कॉल करने के लिए बनाएं | APIs, फॉर्म्स, और लोकल स्टोरेज | जेन |
| 14 | ग्रीन ब्राउज़र एक्सटेंशन | ब्राउज़र में बैकग्राउंड प्रोसेस, वेब परफॉर्मेंस | ब्राउज़र के बैकग्राउंड प्रोसेस का उपयोग करके एक्सटेंशन के आइकन को प्रबंधित करें; वेब परफॉर्मेंस और कुछ ऑप्टिमाइजेशन के बारे में जानें | बैकग्राउंड टास्क्स और परफॉर्मेंस | जेन |
| 15 | स्पेस गेम | जावास्क्रिप्ट के साथ अधिक उन्नत गेम डेवलपमेंट | क्लासेस और कंपोज़िशन का उपयोग करके इनहेरिटेंस और पब/सब पैटर्न के बारे में जानें, गेम बनाने की तैयारी में | उन्नत गेम डेवलपमेंट का परिचय | क्रिस |
| 16 | स्पेस गेम | कैनवास पर ड्रॉ करना | कैनवास API के बारे में जानें, जिसका उपयोग स्क्रीन पर तत्वों को ड्रॉ करने के लिए किया जाता है | कैनवास पर ड्रॉ करना | क्रिस |
| 17 | स्पेस गेम | स्क्रीन पर तत्वों को मूव करना | जानें कि कैसे तत्वों को कार्टेशियन कोऑर्डिनेट्स और कैनवास API का उपयोग करके गति दी जा सकती है | तत्वों को मूव करना | क्रिस |
| 18 | स्पेस गेम | टकराव का पता लगाना | तत्वों को एक-दूसरे से टकराने और प्रतिक्रिया देने के लिए बनाएं, कीप्रेस का उपयोग करें और गेम के प्रदर्शन को सुनिश्चित करने के लिए कूलडाउन फंक्शन प्रदान करें | टकराव का पता लगाना | क्रिस |
| 19 | स्पेस गेम | स्कोर रखना | गेम की स्थिति और प्रदर्शन के आधार पर गणितीय गणना करें | स्कोर रखना | क्रिस |
| 20 | स्पेस गेम | गेम को समाप्त करना और पुनः शुरू करना | गेम को समाप्त करने और पुनः शुरू करने के बारे में जानें, जिसमें एसेट्स को साफ करना और वेरिएबल वैल्यूज़ को रीसेट करना शामिल है | एंडिंग कंडीशन | क्रिस |
| 21 | बैंकिंग ऐप | वेब ऐप में HTML टेम्पलेट्स और रूट्स | रूटिंग और HTML टेम्पलेट्स का उपयोग करके मल्टीपेज वेबसाइट की आर्किटेक्चर का स्कैफोल्ड बनाना सीखें | HTML टेम्पलेट्स और रूट्स | योहान |
| 22 | बैंकिंग ऐप | लॉगिन और रजिस्ट्रेशन फॉर्म बनाएं | फॉर्म्स बनाने और वेलिडेशन रूटीन को संभालने के बारे में जानें | फॉर्म्स | योहान |
| 23 | बैंकिंग ऐप | डेटा को फेच और उपयोग करने के तरीके | आपके ऐप में डेटा कैसे प्रवाहित होता है, इसे कैसे फेच करें, स्टोर करें, और डिस्पोज करें | डेटा | योहान |
| 24 | बैंकिंग ऐप | स्टेट मैनेजमेंट के कॉन्सेप्ट्स | जानें कि आपका ऐप स्टेट को कैसे बनाए रखता है और इसे प्रोग्रामेटिक रूप से कैसे प्रबंधित करें | स्टेट मैनेजमेंट | योहान |
| 25 | ब्राउज़र/VScode कोड | VScode के साथ काम करना | कोड एडिटर का उपयोग करना सीखें | VScode कोड एडिटर का उपयोग करें | क्रिस |
| 26 | AI असिस्टेंट्स | AI के साथ काम करना | अपना खुद का AI असिस्टेंट बनाना सीखें | AI असिस्टेंट प्रोजेक्ट | क्रिस |
🏫 शिक्षण पद्धति
हमारा पाठ्यक्रम दो प्रमुख शिक्षण सिद्धांतों पर आधारित है:
- प्रोजेक्ट-आधारित शिक्षा
- बार-बार क्विज़
यह प्रोग्राम जावास्क्रिप्ट, HTML, और CSS के मूलभूत सिद्धांतों के साथ-साथ आज के वेब डेवलपर्स द्वारा उपयोग किए जाने वाले नवीनतम टूल्स और तकनीकों को सिखाता है। छात्रों को टाइपिंग गेम, वर्चुअल टेरारियम, इको-फ्रेंडली ब्राउज़र एक्सटेंशन, स्पेस-इनवेडर-स्टाइल गेम, और व्यवसायों के लिए बैंकिंग ऐप बनाकर व्यावहारिक अनुभव प्राप्त करने का अवसर मिलेगा। इस श्रृंखला के अंत तक, छात्रों को वेब डेवलपमेंट की ठोस समझ प्राप्त हो जाएगी।
🎓 आप इस पाठ्यक्रम के पहले कुछ पाठ Microsoft Learn पर एक लर्न पाथ के रूप में ले सकते हैं!
सुनिश्चित करके कि सामग्री प्रोजेक्ट्स के साथ मेल खाती है, प्रक्रिया छात्रों के लिए अधिक आकर्षक बन जाती है और अवधारणाओं की समझ को बढ़ावा मिलता है। हमने जावास्क्रिप्ट बेसिक्स में कई शुरुआती पाठ भी लिखे हैं, जिन्हें "Beginners Series to: JavaScript" वीडियो ट्यूटोरियल्स के संग्रह के साथ जोड़ा गया है, जिनमें से कुछ लेखकों ने इस पाठ्यक्रम में योगदान दिया है।
इसके अलावा, कक्षा से पहले एक लो-स्टेक्स क्विज़ छात्र को विषय सीखने के इरादे की ओर ले जाता है, जबकि कक्षा के बाद दूसरा क्विज़ आगे की अवधारणाओं को बनाए रखने में मदद करता है। यह पाठ्यक्रम लचीला और मजेदार बनाया गया है और इसे पूरे या आंशिक रूप से लिया जा सकता है। प्रोजेक्ट्स छोटे से शुरू होते हैं और 12-सप्ताह के चक्र के अंत तक धीरे-धीरे जटिल हो जाते हैं।
हालांकि हमने जानबूझकर जावास्क्रिप्ट फ्रेमवर्क्स को पेश करने से बचा है ताकि वेब डेवलपर के रूप में फ्रेमवर्क अपनाने से पहले आवश्यक बुनियादी कौशल पर ध्यान केंद्रित किया जा सके, इस पाठ्यक्रम को पूरा करने के बाद एक अच्छा अगला कदम Node.js के बारे में सीखना होगा, जो वीडियो के एक अन्य संग्रह में उपलब्ध है: "Beginner Series to: Node.js"।
हमारे Code of Conduct और Contributing दिशानिर्देशों पर जाएं। हम आपकी रचनात्मक प्रतिक्रिया का स्वागत करते हैं!
🧭 ऑफलाइन एक्सेस
आप इस डॉक्यूमेंटेशन को Docsify का उपयोग करके ऑफलाइन चला सकते हैं। इस रिपॉजिटरी को फोर्क करें, Docsify इंस्टॉल करें अपने लोकल मशीन पर, और फिर इस रिपॉजिटरी के रूट फ़ोल्डर में docsify serve टाइप करें। वेबसाइट आपके लोकलहोस्ट पर पोर्ट 3000 पर सर्व की जाएगी: localhost:3000।
सभी पाठों का PDF यहां पाया जा सकता है।
🎒 अन्य पाठ्यक्रम
हमारी टीम अन्य पाठ्यक्रम भी तैयार करती है! देखें:
- MCP for Beginners
- Edge AI for Beginners
- AI Agents for Beginners
- Generative AI for Beginners .NET
- Generative AI with JavaScript
- Generative AI with Java
- AI for Beginners
- Data Science for Beginners
- ML for Beginners
- Cybersecurity for Beginners
- Web Dev for Beginners
- IoT for Beginners
- XR Development for Beginners
- Mastering GitHub Copilot for Agentic use
- C#/.NET डेवलपर्स के लिए GitHub Copilot में महारत हासिल करें
- अपना खुद का Copilot एडवेंचर चुनें
सहायता प्राप्त करना
यदि आप अटक जाते हैं या AI ऐप्स बनाने के बारे में कोई सवाल है, तो शामिल हों:
यदि आपको उत्पाद पर प्रतिक्रिया देनी है या निर्माण के दौरान कोई त्रुटि आती है, तो यहां जाएं:
लाइसेंस
यह रिपॉजिटरी MIT लाइसेंस के तहत लाइसेंस प्राप्त है। अधिक जानकारी के लिए LICENSE फ़ाइल देखें।
अस्वीकरण:
यह दस्तावेज़ AI अनुवाद सेवा Co-op Translator का उपयोग करके अनुवादित किया गया है। जबकि हम सटीकता के लिए प्रयासरत हैं, कृपया ध्यान दें कि स्वचालित अनुवाद में त्रुटियां या अशुद्धियां हो सकती हैं। मूल दस्तावेज़, जो इसकी मूल भाषा में है, को प्रामाणिक स्रोत माना जाना चाहिए। महत्वपूर्ण जानकारी के लिए, पेशेवर मानव अनुवाद की सिफारिश की जाती है। इस अनुवाद के उपयोग से उत्पन्न किसी भी गलतफहमी या गलत व्याख्या के लिए हम उत्तरदायी नहीं हैं।


