|
|
3 months ago | |
|---|---|---|
| .. | ||
| 1-getting-started-lessons | 3 months ago | |
| 2-js-basics | 3 months ago | |
| 3-terrarium | 3 months ago | |
| 4-typing-game | 3 months ago | |
| 5-browser-extension | 3 months ago | |
| 6-space-game | 3 months ago | |
| 7-bank-project | 3 months ago | |
| 8-code-editor/1-using-a-code-editor | 3 months ago | |
| docs | 3 months ago | |
| lesson-template | 3 months ago | |
| quiz-app | 3 months ago | |
| CODE_OF_CONDUCT.md | 3 months ago | |
| CONTRIBUTING.md | 3 months ago | |
| README.md | 3 months ago | |
| SECURITY.md | 3 months ago | |
| SUPPORT.md | 3 months ago | |
| _404.md | 3 months ago | |
| for-teachers.md | 3 months ago | |
README.md
शुरुवातका लागि वेब विकास - पाठ्यक्रम
माइक्रोसफ्ट क्लाउड एड्भोकेट्सद्वारा तयार गरिएको १२ हप्ताको व्यापक पाठ्यक्रममार्फत वेब विकासको आधारभूत कुराहरू सिक्नुहोस्। प्रत्येक २४ पाठले जाभास्क्रिप्ट, CSS, र HTML मा ध्यान केन्द्रित गर्दै परियोजनाहरू जस्तै टेरारियम, ब्राउजर एक्सटेन्सन, र स्पेस गेमहरू मार्फत सिकाउँछ। क्विज, छलफल, र व्यावहारिक असाइनमेन्टहरूमा संलग्न हुनुहोस्। परियोजना-आधारित शिक्षण विधिको प्रभावकारी प्रयोगले तपाईंको सीपलाई सुधार गर्न र ज्ञानलाई दीर्घकालीन बनाउन मद्दत गर्दछ। आजै आफ्नो कोडिङ यात्रा सुरु गर्नुहोस्!
🧑🎓 के तपाईं विद्यार्थी हुनुहुन्छ?
विद्यार्थी हब पृष्ठ मा जानुहोस् जहाँ तपाईंले शुरुवातका स्रोतहरू, विद्यार्थी प्याकहरू, र नि:शुल्क प्रमाणपत्र भौचर प्राप्त गर्ने तरिकाहरू पाउन सक्नुहुन्छ। यो पृष्ठलाई बुकमार्क गर्नुहोस् र समय-समयमा जाँच गर्नुहोस् किनभने हामी मासिक रूपमा सामग्री परिवर्तन गर्छौं।
📣 घोषणा - नयाँ पाठ्यक्रम जेनरेटिभ AI को लागि जाभास्क्रिप्टमा हालै जारी भएको छ
हाम्रो नयाँ जेनरेटिभ AI पाठ्यक्रम नछुटाउनुहोस्!
https://aka.ms/genai-js-course मा जानुहोस् र सुरु गर्नुहोस्!
- आधारभूतदेखि RAG सम्मका पाठहरू।
- जेनरेटिभ AI र हाम्रो सहायक एप प्रयोग गरेर ऐतिहासिक पात्रहरूसँग अन्तरक्रिया गर्नुहोस्।
- रमाइलो र आकर्षक कथा, तपाईं समय यात्रा गर्दै हुनुहुनेछ!
प्रत्येक पाठमा समावेश छ:
- असाइनमेन्ट पूरा गर्नुहोस्।
- ज्ञान जाँच।
- चुनौतीहरू।
- विषयहरू जस्तै:
- प्रम्प्टिङ र प्रम्प्ट इन्जिनियरिङ।
- टेक्स्ट र इमेज एप निर्माण।
- सर्च एपहरू।
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 प्रयोग गर्नु हो, जसमा Terminal पनि समावेश छ। तपाईं यहाँ बाट Visual Studio Code डाउनलोड गर्न सक्नुहुन्छ।
-
आफ्नो रिपोजिटरीलाई आफ्नो कम्प्युटरमा क्लोन गर्नुहोस्। तपाईं यो Code बटन क्लिक गरेर र URL प्रतिलिपि गरेर गर्न सक्नुहुन्छ:
त्यसपछि, Visual Studio Code भित्र Terminal खोल्नुहोस् र तलको कमाण्ड चलाउनुहोस्,
<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 फोल्डरमा समावेश छन्, प्रत्येकमा तीन प्रश्न सहित ४८ क्विजहरू। ती पाठहरूबाट लिंक गरिएका छन्। क्विज एपलाई स्थानीय रूपमा चलाउन वा 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 | Green Browser Extension | ब्राउजरसँग काम गर्ने | ब्राउजर कसरी काम गर्छ, यसको इतिहास, र ब्राउजर एक्सटेन्सनको पहिलो तत्वहरू कसरी बनाउने सिक्नुहोस् | About Browsers | Jen |
| 13 | Green Browser Extension | फारम बनाउने, API कल गर्ने र स्थानीय स्टोरेजमा भेरिएबलहरू राख्ने | स्थानीय स्टोरेजमा राखिएका भेरिएबलहरू प्रयोग गरेर API कल गर्नको लागि आफ्नो ब्राउजर एक्सटेन्सनको JavaScript तत्वहरू बनाउनुहोस् | APIs, Forms, and Local Storage | Jen |
| 14 | Green Browser Extension | ब्राउजरको पृष्ठभूमि प्रक्रिया, वेब प्रदर्शन | एक्सटेन्सनको आइकन व्यवस्थापन गर्न ब्राउजरको पृष्ठभूमि प्रक्रिया प्रयोग गर्नुहोस्; वेब प्रदर्शन र केही सुधारहरूबारे जान्नुहोस् | Background Tasks and Performance | Jen |
| 15 | Space Game | JavaScript प्रयोग गरेर उन्नत गेम विकास | गेम निर्माणको तयारीमा कक्षाहरू र कम्पोजिसन प्रयोग गरेर इनहेरिटेन्स र Pub/Sub ढाँचाबारे जान्नुहोस् | Introduction to Advanced Game Development | Chris |
| 16 | Space Game | क्यानभासमा चित्र बनाउने | क्यानभास API को बारेमा जान्नुहोस्, जसले स्क्रिनमा तत्वहरू चित्र बनाउन प्रयोग गरिन्छ | Drawing to Canvas | Chris |
| 17 | Space Game | स्क्रिनमा तत्वहरू सार्ने | तत्वहरूलाई गति दिनको लागि Cartesian समन्वय र क्यानभास API कसरी प्रयोग गर्न सकिन्छ भनेर पत्ता लगाउनुहोस् | Moving Elements Around | Chris |
| 18 | Space Game | टक्कर पत्ता लगाउने | तत्वहरूलाई एकअर्कासँग टक्कर गर्न र प्रतिक्रिया दिन बनाउनुहोस्, कीप्रेस प्रयोग गरेर; गेमको प्रदर्शन सुनिश्चित गर्न कूलडाउन फंक्शन प्रदान गर्नुहोस् | Collision Detection | Chris |
| 19 | Space Game | स्कोर राख्ने | गेमको स्थिति र प्रदर्शनको आधारमा गणितीय गणना गर्नुहोस् | Keeping Score | Chris |
| 20 | Space Game | गेम समाप्त गर्ने र पुनः सुरु गर्ने | गेम समाप्त गर्ने र पुनः सुरु गर्ने बारेमा जान्नुहोस्, जसमा सम्पत्ति सफा गर्ने र भेरिएबल मानहरू पुनः सेट गर्ने समावेश छ | The Ending Condition | Chris |
| 21 | Banking App | वेब एपमा HTML टेम्प्लेट र रुटहरू | रुटिङ र HTML टेम्प्लेट प्रयोग गरेर बहुपृष्ठ वेबसाइटको संरचना कसरी बनाउने सिक्नुहोस् | HTML Templates and Routes | Yohan |
| 22 | Banking App | लगइन र दर्ता फारम बनाउने | फारम बनाउने र मान्यकरण प्रक्रियाहरू ह्यान्डल गर्ने बारेमा जान्नुहोस् | Forms | Yohan |
| 23 | Banking App | डेटा प्राप्त गर्ने र प्रयोग गर्ने विधिहरू | तपाईंको एपमा डेटा कसरी प्रवाह हुन्छ, कसरी प्राप्त गर्ने, भण्डारण गर्ने, र हटाउने बारेमा जान्नुहोस् | Data | Yohan |
| 24 | Banking App | राज्य व्यवस्थापनको अवधारणा | तपाईंको एपले राज्य कसरी कायम राख्छ र यसलाई प्रोग्रामिङ्ग रूपमा कसरी व्यवस्थापन गर्ने बारेमा जान्नुहोस् | State Management | Yohan |
🏫 शिक्षण विधि
हाम्रो पाठ्यक्रम दुई प्रमुख शिक्षण सिद्धान्तहरूमा आधारित छ:
- परियोजना-आधारित शिक्षण
- बारम्बार क्विजहरू
कार्यक्रमले JavaScript, HTML, र CSS को आधारभूत कुराहरू, साथै आजका वेब विकासकर्ताहरूले प्रयोग गर्ने नवीनतम उपकरण र प्रविधिहरू सिकाउँछ। विद्यार्थीहरूले टाइपिङ गेम, भर्चुअल टेरारियम, वातावरणमैत्री ब्राउजर एक्सटेन्सन, स्पेस-इनभेडर शैलीको गेम, र व्यवसायहरूको लागि बैंकिङ एप निर्माण गरेर व्यावहारिक अनुभव प्राप्त गर्ने अवसर पाउनेछन्। श्रृंखला समाप्त हुँदा, विद्यार्थीहरूले वेब विकासको ठोस समझ प्राप्त गर्नेछन्।
🎓 तपाईं यस पाठ्यक्रमका केही प्रारम्भिक पाठहरू Learn Path मा Microsoft Learn मा लिन सक्नुहुन्छ!
सामग्री परियोजनासँग मेल खाने सुनिश्चित गरेर, प्रक्रिया विद्यार्थीहरूको लागि थप आकर्षक बनाइन्छ र अवधारणाहरूको सम्झना बढाइन्छ। हामीले JavaScript को आधारभूत पाठहरू पनि लेखेका छौं जसले अवधारणाहरू परिचय गराउँछ, "Beginners Series to: JavaScript" भिडियो ट्यूटोरियलहरूको संग्रहबाट भिडियोसँग जोडीएको छ, जसका केही लेखकहरूले यस पाठ्यक्रममा योगदान गरेका छन्।
यसका अतिरिक्त, कक्षा अघि कम-जोखिमको क्विजले विद्यार्थीलाई विषय सिक्नको लागि उद्देश्य सेट गर्दछ, जबकि कक्षा पछि दोस्रो क्विजले थप सम्झना सुनिश्चित गर्दछ। यो पाठ्यक्रम लचिलो र रमाइलो बनाउन डिजाइन गरिएको हो र पूर्ण वा आंशिक रूपमा लिन सकिन्छ। परियोजनाहरू साना सुरु हुन्छन् र 12-हप्ताको चक्रको अन्त्यसम्ममा क्रमशः जटिल बन्छन्।
हामीले जानाजानी JavaScript फ्रेमवर्कहरू परिचय गराउनबाट बचेर वेब विकासकर्ताको रूपमा फ्रेमवर्क अपनाउनु अघि आवश्यक आधारभूत सीपहरूमा ध्यान केन्द्रित गरेका छौं। यो पाठ्यक्रम पूरा गरेपछि अर्को राम्रो कदम भनेको अर्को भिडियो संग्रह मार्फत Node.js सिक्नु हुनेछ: "Beginner Series to: Node.js"।
हाम्रो Code of Conduct र Contributing दिशानिर्देशहरू हेर्नुहोस्। हामी तपाईंको रचनात्मक प्रतिक्रिया स्वागत गर्दछौं!
🧭 अफलाइन पहुँच
तपाईं Docsify प्रयोग गरेर यो दस्तावेज अफलाइन चलाउन सक्नुहुन्छ। यो रिपो फोर्क गर्नुहोस्, Docsify स्थापना गर्नुहोस् आफ्नो स्थानीय मेसिनमा, र त्यसपछि यस रिपोको मूल फोल्डरमा docsify serve टाइप गर्नुहोस्। वेबसाइट तपाईंको localhost मा पोर्ट 3000 मा सेवा गरिनेछ: localhost:3000।
सबै पाठहरूको PDF यहाँ फेला पार्न सकिन्छ।
🎒 अन्य पाठ्यक्रमहरू
हाम्रो टोलीले अन्य पाठ्यक्रमहरू उत्पादन गर्दछ! हेर्नुहोस्:
- Generative AI 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
- Mastering GitHub Copilot for C#/.NET Developers
- Choose Your Own Copilot Adventure
लाइसेन्स
यो रिपोजिटरी MIT लाइसेन्स अन्तर्गत लाइसेन्स गरिएको छ। थप जानकारीको लागि LICENSE फाइल हेर्नुहोस्।
अस्वीकरण:
यो दस्तावेज़ AI अनुवाद सेवा Co-op Translator प्रयोग गरेर अनुवाद गरिएको छ। हामी शुद्धताको लागि प्रयास गर्छौं, तर कृपया ध्यान दिनुहोस् कि स्वचालित अनुवादमा त्रुटिहरू वा अशुद्धताहरू हुन सक्छ। यसको मूल भाषा मा रहेको मूल दस्तावेज़लाई आधिकारिक स्रोत मानिनुपर्छ। महत्वपूर्ण जानकारीको लागि, व्यावसायिक मानव अनुवाद सिफारिस गरिन्छ। यस अनुवादको प्रयोगबाट उत्पन्न हुने कुनै पनि गलतफहमी वा गलत व्याख्याको लागि हामी जिम्मेवार हुने छैनौं।