40 KiB

Raw Blame History

इन संसाधनों का उपयोग शुरू करने के लिए निम्नलिखित चरणों का पालन करें:

रेपो को फोर्क करें: क्लिक करें
रेपो को क्लोन करें: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
Azure AI Foundry Discord से जुड़ें और विशेषज्ञों और अन्य डेवलपर्स से मिलें

शुरुआती लोगों के लिए वेब डेवलपमेंट - एक पाठ्यक्रम

Microsoft Cloud Advocates द्वारा तैयार किए गए 12-सप्ताह के व्यापक कोर्स के साथ वेब डेवलपमेंट की मूल बातें सीखें। 24 पाठों में JavaScript, CSS, और HTML को प्रोजेक्ट्स जैसे टेरारियम, ब्राउज़र एक्सटेंशन, और स्पेस गेम्स के माध्यम से समझाया गया है। क्विज़, चर्चाओं और व्यावहारिक असाइनमेंट्स के साथ जुड़ें। अपनी स्किल्स को बेहतर बनाएं और प्रोजेक्ट-आधारित शिक्षण पद्धति के साथ अपने ज्ञान को अधिकतम करें। आज ही अपनी कोडिंग यात्रा शुरू करें!

🧑‍🎓 क्या आप एक छात्र हैं?

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

📣 घोषणा - नया पाठ्यक्रम JavaScript के लिए जनरेटिव AI पर जारी किया गया है

हमारे नए जनरेटिव 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 बनाएगा।

!Codespace./images/createcodespace.png)

अपने कंप्यूटर पर स्थानीय रूप से पाठ्यक्रम चलाना

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

हमारी अनुशंसा है कि आप Visual Studio Code का उपयोग करें, जिसमें एक अंतर्निहित टर्मिनल भी है। आप यहां से Visual Studio Code डाउनलोड कर सकते हैं।

अपने रेपो को अपने कंप्यूटर पर क्लोन करें। आप Code बटन पर क्लिक करके और URL कॉपी करके ऐसा कर सकते हैं:

!CodeSpace

फिर, Visual Studio Code में टर्मिनल खोलें और निम्नलिखित कमांड चलाएं, <your-repository-url> को उस URL से बदलें जिसे आपने अभी कॉपी किया है:
```
git clone <your-repository-url>
```
Visual Studio Code में फ़ोल्डर खोलें। आप File > Open Folder पर क्लिक करके और उस फ़ोल्डर का चयन करके ऐसा कर सकते हैं जिसे आपने अभी क्लोन किया है।

अनुशंसित Visual Studio Code एक्सटेंशन:

Live Server - HTML पेजों को Visual Studio Code के भीतर प्रीव्यू करने के लिए

Copilot - कोड को तेजी से लिखने में मदद करने के लिए

📂 प्रत्येक पाठ में शामिल हैं:

वैकल्पिक स्केच नोट
वैकल्पिक पूरक वीडियो
प्री-लेसन वार्मअप क्विज़
लिखित पाठ
प्रोजेक्ट-आधारित पाठों के लिए, प्रोजेक्ट बनाने के लिए चरण-दर-चरण गाइड
ज्ञान जांच
एक चुनौती
पूरक पढ़ाई
असाइनमेंट
पोस्ट-लेसन क्विज़

क्विज़ के बारे में एक नोट: सभी क्विज़ Quiz-app फ़ोल्डर में हैं, कुल 48 क्विज़, प्रत्येक में तीन प्रश्न। वे यहां उपलब्ध हैं। Quiz-app को स्थानीय रूप से चलाया जा सकता है या Azure पर डिप्लॉय किया जा सकता है; quiz-app फ़ोल्डर में दिए गए निर्देशों का पालन करें।

🗃️ पाठ

	प्रोजेक्ट का नाम	सिखाए गए अवधारणाएं	सीखने के उद्देश्य	लिंक किया गया पाठ	लेखक
01	शुरुआत करना	प्रोग्रामिंग और टूल्स का परिचय	अधिकांश प्रोग्रामिंग भाषाओं के पीछे की मूल बातें और पेशेवर डेवलपर्स को उनके काम में मदद करने वाले सॉफ़्टवेयर के बारे में जानें	प्रोग्रामिंग भाषाओं और टूल्स का परिचय	Jasmine
02	शुरुआत करना	GitHub की मूल बातें, टीम के साथ काम करना	अपने प्रोजेक्ट में GitHub का उपयोग कैसे करें, कोड बेस पर दूसरों के साथ सहयोग कैसे करें	GitHub का परिचय	Floor
03	शुरुआत करना	एक्सेसिबिलिटी	वेब एक्सेसिबिलिटी की मूल बातें सीखें	एक्सेसिबिलिटी के मूल सिद्धांत	Christopher
04	JS की मूल बातें	JavaScript डेटा प्रकार	JavaScript डेटा प्रकारों की मूल बातें	डेटा प्रकार	Jasmine
05	JS की मूल बातें	फंक्शन्स और मेथड्स	एप्लिकेशन के लॉजिक फ्लो को प्रबंधित करने के लिए फंक्शन्स और मेथड्स के बारे में जानें	फंक्शन्स और मेथड्स	Jasmine और Christopher
06	JS की मूल बातें	JS के साथ निर्णय लेना	निर्णय लेने के तरीकों का उपयोग करके अपने कोड में शर्तें कैसे बनाएं	निर्णय लेना	Jasmine
07	JS की मूल बातें	Arrays और Loops	JavaScript में डेटा के साथ काम करने के लिए Arrays और Loops का उपयोग करें	Arrays और Loops	Jasmine
08	Terrarium	HTML का अभ्यास	ऑनलाइन टेरारियम बनाने के लिए HTML बनाएं, लेआउट बनाने पर ध्यान केंद्रित करें	HTML का परिचय	Jen
09	Terrarium	CSS का अभ्यास	ऑनलाइन टेरारियम को स्टाइल करने के लिए CSS बनाएं, CSS की मूल बातें सहित पेज को उत्तरदायी बनाने पर ध्यान केंद्रित करें	CSS का परिचय	Jen
10	Terrarium	जावास्क्रिप्ट क्लोज़र्स, DOM मैनिपुलेशन	जावास्क्रिप्ट को इस तरह से बनाएं कि टेरारियम ड्रैग/ड्रॉप इंटरफेस के रूप में काम करे, जिसमें क्लोज़र्स और DOM मैनिपुलेशन पर ध्यान केंद्रित हो	जावास्क्रिप्ट क्लोज़र्स, DOM मैनिपुलेशन	Jen
11	Typing Game	टाइपिंग गेम बनाएं	जानें कि कीबोर्ड इवेंट्स का उपयोग करके अपने जावास्क्रिप्ट ऐप की लॉजिक को कैसे चलाएं	इवेंट-ड्रिवन प्रोग्रामिंग	Christopher
12	Green Browser Extension	ब्राउज़र के साथ काम करना	जानें कि ब्राउज़र कैसे काम करते हैं, उनका इतिहास, और ब्राउज़र एक्सटेंशन के पहले तत्वों को कैसे तैयार करें	ब्राउज़र के बारे में	Jen
13	Green Browser Extension	फॉर्म बनाना, API कॉल करना और लोकल स्टोरेज में वेरिएबल्स स्टोर करना	अपने ब्राउज़र एक्सटेंशन के जावास्क्रिप्ट तत्वों को बनाएं ताकि लोकल स्टोरेज में स्टोर किए गए वेरिएबल्स का उपयोग करके API कॉल किया जा सके	APIs, फॉर्म्स, और लोकल स्टोरेज	Jen
14	Green Browser Extension	ब्राउज़र में बैकग्राउंड प्रोसेस, वेब प्रदर्शन	ब्राउज़र के बैकग्राउंड प्रोसेस का उपयोग करके एक्सटेंशन के आइकन को प्रबंधित करें; वेब प्रदर्शन और कुछ ऑप्टिमाइजेशन के बारे में जानें	बैकग्राउंड टास्क्स और प्रदर्शन	Jen
15	Space Game	जावास्क्रिप्ट के साथ अधिक उन्नत गेम डेवलपमेंट	क्लासेस और कंपोज़िशन का उपयोग करके इनहेरिटेंस और पब/सब पैटर्न के बारे में जानें, गेम बनाने की तैयारी में	उन्नत गेम डेवलपमेंट का परिचय	Chris
16	Space Game	कैनवास पर ड्रॉ करना	कैनवास API के बारे में जानें, जिसका उपयोग स्क्रीन पर तत्वों को ड्रॉ करने के लिए किया जाता है	कैनवास पर ड्रॉ करना	Chris
17	Space Game	स्क्रीन पर तत्वों को घुमाना	जानें कि कैसे तत्वों को कार्टेशियन कोऑर्डिनेट्स और कैनवास API का उपयोग करके गति दी जा सकती है	तत्वों को स्क्रीन पर घुमाना	Chris
18	Space Game	टकराव का पता लगाना	तत्वों को एक-दूसरे से टकराने और प्रतिक्रिया देने के लिए बनाएं, कीप्रेस का उपयोग करें और गेम के प्रदर्शन को सुनिश्चित करने के लिए कूलडाउन फंक्शन प्रदान करें	टकराव का पता लगाना	Chris
19	Space Game	स्कोर रखना	गेम की स्थिति और प्रदर्शन के आधार पर गणितीय गणना करें	स्कोर रखना	Chris
20	Space Game	गेम को समाप्त करना और पुनः शुरू करना	गेम को समाप्त करने और पुनः शुरू करने के बारे में जानें, जिसमें एसेट्स को साफ करना और वेरिएबल्स के मानों को रीसेट करना शामिल है	समाप्ति की स्थिति	Chris
21	Banking App	HTML टेम्पलेट्स और वेब ऐप में रूट्स	जानें कि मल्टीपेज वेबसाइट की आर्किटेक्चर को रूटिंग और HTML टेम्पलेट्स का उपयोग करके कैसे तैयार करें	HTML टेम्पलेट्स और रूट्स	Yohan
22	Banking App	लॉगिन और रजिस्ट्रेशन फॉर्म बनाएं	फॉर्म्स बनाने और वैलिडेशन रूटीन को संभालने के बारे में जानें	फॉर्म्स	Yohan
23	Banking App	डेटा को प्राप्त करने और उपयोग करने के तरीके	जानें कि आपका ऐप डेटा को कैसे प्रवाहित करता है, प्राप्त करता है, स्टोर करता है, और उसे डिस्पोज़ करता है	डेटा	Yohan
24	Banking App	स्टेट मैनेजमेंट की अवधारणाएं	जानें कि आपका ऐप स्टेट को कैसे बनाए रखता है और इसे प्रोग्रामेटिक रूप से कैसे प्रबंधित करें	स्टेट मैनेजमेंट	Yohan

🏫 शिक्षण पद्धति

हमारे पाठ्यक्रम को दो प्रमुख शिक्षण सिद्धांतों को ध्यान में रखकर डिज़ाइन किया गया है:

प्रोजेक्ट-आधारित शिक्षा
बार-बार क्विज़

यह कार्यक्रम जावास्क्रिप्ट, HTML, और CSS की मूलभूत बातें सिखाता है, साथ ही आज के वेब डेवलपर्स द्वारा उपयोग किए जाने वाले नवीनतम टूल और तकनीकों को भी। छात्रों को टाइपिंग गेम, वर्चुअल टेरारियम, पर्यावरण-अनुकूल ब्राउज़र एक्सटेंशन, स्पेस-इनवेडर-स्टाइल गेम, और व्यवसायों के लिए बैंकिंग ऐप बनाकर व्यावहारिक अनुभव प्राप्त करने का अवसर मिलेगा। श्रृंखला के अंत तक, छात्रों को वेब डेवलपमेंट की ठोस समझ प्राप्त हो जाएगी।

🎓 आप इस पाठ्यक्रम के पहले कुछ पाठ Learn Path पर 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

सभी पाठों का PDF यहां पाया जा सकता है।

🎒 अन्य पाठ्यक्रम

हमारी टीम अन्य पाठ्यक्रम भी बनाती है! देखें:

लाइसेंस

यह रिपॉजिटरी MIT लाइसेंस के तहत लाइसेंस प्राप्त है। अधिक जानकारी के लिए LICENSE फ़ाइल देखें।

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

40 KiB Raw Blame History