44 KiB

Raw Blame History

यी स्रोतहरू प्रयोग गर्न सुरु गर्न निम्न चरणहरू अनुसरण गर्नुहोस्:

रिपोजिटरीलाई फोर्क गर्नुहोस्: मा क्लिक गर्नुहोस्।
रिपोजिटरीलाई क्लोन गर्नुहोस्: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
Azure AI Foundry Discord मा सामेल हुनुहोस् र विशेषज्ञहरू तथा अन्य विकासकर्तासँग भेट गर्नुहोस्

शुरुवातका लागि वेब विकास - एक पाठ्यक्रम

Microsoft Cloud Advocates द्वारा तयार गरिएको हाम्रो १२ हप्ताको व्यापक पाठ्यक्रमको साथ वेब विकासको आधारभूत कुरा सिक्नुहोस्। प्रत्येक २४ पाठले JavaScript, CSS, र HTML मा व्यावहारिक परियोजनाहरू जस्तै टेरारियम, ब्राउजर एक्सटेन्सन, र स्पेस गेमहरू मार्फत गहिरो जानकारी दिन्छ। क्विजहरू, छलफलहरू, र व्यावहारिक असाइनमेन्टहरूमा संलग्न हुनुहोस्। हाम्रो प्रभावकारी परियोजना-आधारित शिक्षण विधिको साथ आफ्नो सीप सुधार गर्नुहोस् र ज्ञानको प्रतिधारणलाई अनुकूलित गर्नुहोस्। आजै आफ्नो कोडिङ यात्रा सुरु गर्नुहोस्!

🌐 बहुभाषी समर्थन

GitHub Action मार्फत समर्थित (स्वचालित र सधैं अद्यावधिक)

यदि तपाईंले थप भाषाहरूको अनुवाद चाहनुहुन्छ भने यहाँ सूचीबद्ध छन् यहाँ

🧑‍🎓 तपाईं विद्यार्थी हुनुहुन्छ?

Student Hub पृष्ठ मा जानुहोस् जहाँ तपाईंले शुरुवातका स्रोतहरू, विद्यार्थी प्याकहरू र नि:शुल्क प्रमाणपत्र भौचर प्राप्त गर्ने तरिकाहरू पाउनुहुनेछ। यो पृष्ठलाई बुकमार्क गर्नुहोस् र समय-समयमा जाँच गर्नुहोस् किनभने हामी मासिक रूपमा सामग्री परिवर्तन गर्छौं।

📣 घोषणा - Generative AI प्रयोग गरेर नयाँ परियोजना निर्माण गर्नुहोस्

नयाँ AI सहायक परियोजना हालै थपिएको छ, यसलाई परियोजना मा हेर्नुहोस्।

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

हाम्रो नयाँ Generative 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 प्रयोग गर्नु हो, जसमा Terminal पनि समावेश छ। तपाईं यहाँ बाट Visual Studio Code डाउनलोड गर्न सक्नुहुन्छ।

तपाईंको रिपोजिटरीलाई तपाईंको कम्प्युटरमा क्लोन गर्नुहोस्। तपाईंले Code बटनमा क्लिक गरेर र URL प्रतिलिपि गरेर यो गर्न सक्नुहुन्छ:

!CodeSpace

त्यसपछि, Visual Studio Code भित्र Terminal खोल्नुहोस् र तपाईंले प्रतिलिपि गरेको URL साटेर निम्न कमाण्ड चलाउनुहोस्:
```
git clone <your-repository-url>
```
Visual Studio Code मा फोल्डर खोल्नुहोस्। तपाईंले File मा क्लिक गरेर यो गर्न सक्नुहुन्छ।

फोल्डर खोल्नुहोस् र तपाईंले भर्खरै क्लोन गरेको फोल्डर चयन गर्नुहोस्। भिजुअल स्टुडियो कोडका लागि सिफारिस गरिएका एक्सटेन्सनहरू:

Live Server - HTML पेजहरूलाई भिजुअल स्टुडियो कोडमा प्रिभ्यू गर्न

Copilot - कोड छिटो लेख्न सहयोग गर्न

📂 प्रत्येक पाठमा समावेश:

वैकल्पिक स्केच नोट
वैकल्पिक पूरक भिडियो
पाठ अघि वार्मअप क्विज
लिखित पाठ
प्रोजेक्ट-आधारित पाठहरूको लागि, प्रोजेक्ट निर्माणको चरण-दर-चरण मार्गदर्शन
ज्ञान जाँच
चुनौती
पूरक पढाइ
असाइनमेन्ट
पाठपछि क्विज

क्विजहरूको बारेमा नोट: सबै क्विजहरू Quiz-app फोल्डरमा समावेश छन्, कुल ४८ क्विजहरू, प्रत्येकमा तीन प्रश्न। यी यहाँ उपलब्ध छन्। क्विज एपलाई स्थानीय रूपमा चलाउन वा Azure मा डिप्लोय गर्न सकिन्छ; quiz-app फोल्डरमा दिइएको निर्देशनहरू पालना गर्नुहोस्।

🗃️ पाठहरू

	प्रोजेक्ट नाम	सिकाइने अवधारणाहरू	सिकाइका उद्देश्यहरू	लिंक गरिएको पाठ	लेखक
01	सुरुवात गर्दै	प्रोग्रामिङको परिचय र प्रयोग गरिने उपकरणहरू	अधिकांश प्रोग्रामिङ भाषाहरूको आधारभूत संरचना र पेशेवर डेभलपरहरूले प्रयोग गर्ने सफ्टवेयरको बारेमा जान्नुहोस्	प्रोग्रामिङ भाषाहरू र उपकरणहरूको परिचय	Jasmine
02	सुरुवात गर्दै	GitHub को आधारभूत कुरा, टिमसँग काम गर्ने समावेश	आफ्नो प्रोजेक्टमा GitHub कसरी प्रयोग गर्ने, कोड बेसमा अरूसँग कसरी सहकार्य गर्ने	GitHub को परिचय	Floor
03	सुरुवात गर्दै	पहुँचयोग्यता	वेब पहुँचयोग्यताको आधारभूत कुरा जान्नुहोस्	पहुंचयोग्यता आधारभूत कुरा	Christopher
04	JS आधारभूत कुरा	JavaScript डेटा प्रकार	JavaScript डेटा प्रकारहरूको आधारभूत कुरा	डेटा प्रकारहरू	Jasmine
05	JS आधारभूत कुरा	फङ्क्सनहरू र मेथडहरू	एप्लिकेसनको तर्क प्रवाह व्यवस्थापन गर्न फङ्क्सनहरू र मेथडहरूको बारेमा जान्नुहोस्	फङ्क्सनहरू र मेथडहरू	Jasmine and Christopher
06	JS आधारभूत कुरा	JS प्रयोग गरेर निर्णय लिने	निर्णय लिने विधिहरू प्रयोग गरेर आफ्नो कोडमा सर्तहरू सिर्जना गर्ने तरिका जान्नुहोस्	निर्णय लिने	Jasmine
07	JS आधारभूत कुरा	Arrays र लूपहरू	JavaScript मा डेटा प्रयोग गर्न Arrays र लूपहरूको प्रयोग	Arrays र लूपहरू	Jasmine
08	Terrarium	HTML अभ्यासमा	अनलाइन Terrarium निर्माण गर्न HTML बनाउनुहोस्, लेआउट निर्माणमा ध्यान केन्द्रित गर्दै	HTML को परिचय	Jen
09	Terrarium	CSS अभ्यासमा	अनलाइन Terrarium लाई स्टाइल गर्न CSS बनाउनुहोस्, CSS को आधारभूत कुरा सहित पेजलाई उत्तरदायी बनाउनेमा ध्यान केन्द्रित गर्दै	CSS को परिचय	Jen
10	Terrarium	JavaScript Closures, DOM ह्यान्डलिङ	Terrarium लाई ड्र्याग/ड्रप इन्टरफेसको रूपमा कार्य गर्न JavaScript बनाउनुहोस्, Closures र DOM ह्यान्डलिङमा ध्यान केन्द्रित गर्दै	JavaScript Closures, DOM ह्यान्डलिङ	Jen
11	Typing Game	टाइपिङ गेम निर्माण	आफ्नो JavaScript एपको तर्कलाई चलाउन किबोर्ड इभेन्टहरूको प्रयोग गर्ने तरिका जान्नुहोस्	इभेन्ट-ड्रिभन प्रोग्रामिङ	Christopher
12	Green Browser Extension	ब्राउजरसँग काम गर्ने	ब्राउजरहरू कसरी काम गर्छन्, तिनीहरूको इतिहास, र ब्राउजर एक्सटेन्सनको पहिलो तत्वहरूको संरचना कसरी बनाउने	ब्राउजरहरूको बारेमा	Jen
13	Green Browser Extension	फारम निर्माण गर्ने, API कल गर्ने र स्थानीय स्टोरेजमा भेरिएबलहरू राख्ने	स्थानीय स्टोरेजमा राखिएका भेरिएबलहरूको प्रयोग गरेर API कल गर्न आफ्नो ब्राउजर एक्सटेन्सनको JavaScript तत्वहरू निर्माण गर्नुहोस्	APIs, फारमहरू, र स्थानीय स्टोरेज	Jen
14	Green Browser Extension	ब्राउजरको पृष्ठभूमि प्रक्रिया, वेब प्रदर्शन	ब्राउजरको पृष्ठभूमि प्रक्रियाहरू प्रयोग गरेर एक्सटेन्सनको आइकन व्यवस्थापन गर्नुहोस्; वेब प्रदर्शन र केही अनुकूलनहरूको बारेमा जान्नुहोस्	पृष्ठभूमि कार्यहरू र प्रदर्शन	Jen
15	Space Game	JavaScript प्रयोग गरेर उन्नत गेम विकास	गेम निर्माणको तयारीमा Classes र Composition प्रयोग गरेर Inheritance र Pub/Sub पाटर्नको बारेमा जान्नुहोस्	उन्नत गेम विकासको परिचय	Chris
16	Space Game	क्यानभासमा चित्र बनाउने	स्क्रिनमा तत्वहरू चित्र बनाउन प्रयोग गरिने Canvas API को बारेमा जान्नुहोस्	क्यानभासमा चित्र बनाउने	Chris
17	Space Game	स्क्रिनमा तत्वहरू सार्ने	Cartesian coordinates र Canvas API प्रयोग गरेर तत्वहरूलाई गति कसरी दिन सकिन्छ जान्नुहोस्	तत्वहरू सार्ने	Chris
18	Space Game	टक्कर पत्ता लगाउने	तत्वहरूलाई एक-अर्कासँग टक्कर गर्न र प्रतिक्रिया दिन बनाउनुहोस्, keypress प्रयोग गरेर; गेमको प्रदर्शन सुनिश्चित गर्न cooldown फङ्क्सन प्रदान गर्नुहोस्	टक्कर पत्ता लगाउने	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
25	Browser/VScode Code	VScode प्रयोग गर्ने	कोड एडिटर प्रयोग गर्ने तरिका जान्नुहोस्	VScode कोड एडिटर प्रयोग गर्नुहोस्	Chris
26	AI Assistants	AIसँग काम गर्ने	आफ्नो AI सहायक निर्माण गर्ने तरिका जान्नुहोस्	AI सहायक प्रोजेक्ट	Chris

🏫 शिक्षाशास्त्र

हाम्रो पाठ्यक्रम दुई प्रमुख शिक्षाशास्त्रीय सिद्धान्तहरूमा आधारित छ:

प्रोजेक्ट-आधारित सिकाइ
बारम्बार क्विजहरू

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

🎓 तपाईं यस पाठ्यक्रमका केही प्रारम्भिक पाठहरू Microsoft Learn मा Learn Path को रूपमा लिन सक्नुहुन्छ!

पाठ्यक्रमलाई प्रोजेक्टहरूसँग मिलाएर सुनिश्चित गर्दा, प्रक्रिया विद्यार्थीहरूको लागि थप आकर्षक बनाइन्छ र अवधारणाहरूको सम्झना बढाइन्छ। हामीले JavaScript को आधारभूत कुरा सिकाउनका लागि केही प्रारम्भिक पाठहरू लेखेका छौं, जसमा "Beginners Series to: JavaScript" भिडियो ट्युटोरियलहरूको संग्रहबाट भिडियोहरू समावेश छन्, जसका केही लेखकहरूले यस पाठ्यक्रममा योगदान दिएका छन्।

यसका अतिरिक्त, कक्षाको अघि कम-जोखिमको क्विजले विद्यार्थीलाई विषयवस्तु सिक्न प्रेरित गर्छ, जबकि कक्षापछि दोस्रो क्विजले अवधारणाको सम्झना सुनिश्चित गर्छ। यो पाठ्यक्रम लचिलो र रमाइलो बनाउन डिजाइन गरिएको हो र पूर्ण वा आंशिक रूपमा लिन सकिन्छ। प्रोजेक्टहरू साना स्तरबाट सुरु हुन्छन् र १२ हप्ताको चक्रको अन्त्यसम्ममा क्रमशः जटिल बन्दै जान्छन्।

हामीले जानाजानी JavaScript फ्रेमवर्कहरूलाई परिचय नगराई वेब डेभलपरको रूपमा आवश्यक आधारभूत सीपहरू सिकाउन ध्यान केन्द्रित गरेका छौं। पाठ्यक्रम पूरा गरेपछि अर्को राम्रो कदम भनेको Node.js को बारेमा सिक्नु हो, जसका लागि अर्को भिडियो संग्रह उपलब्ध छ: "Beginner Series to: Node.js".

हाम्रो Code of Conduct र Contributing दिशानिर्देशहरू हेर्नुहोस्। हामी तपाईंको रचनात्मक प्रतिक्रिया स्वागत गर्दछौं!

🧭 अफलाइन पहुँच

तपाईं Docsify प्रयोग गरेर यो डकुमेन्टेसनलाई अफलाइन चलाउन सक्नुहुन्छ। यो रिपोजिटरीलाई Fork गर्नुहोस्, आफ्नो स्थानीय मेसिनमा Docsify स्थापना गर्नुहोस्, र त्यसपछि यो रिपोजिटरीको रुट फोल्डरमा docsify serve टाइप गर्नुहोस्। वेबसाइट तपाईंको localhost मा पोर्ट 3000 मा चलाइनेछ: localhost:3000.

📘 PDF

सबै पाठहरूको PDF यहाँ फेला पार्न सकिन्छ।

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

हाम्रो टिमले अन्य पाठ्यक्रमहरू उत्पादन गर्छ! हेर्नुहोस्:

लाइसेन्स

यो रिपोजिटरी MIT लाइसेन्स अन्तर्गत लाइसेन्स गरिएको छ। थप जानकारीको लागि LICENSE फाइल हेर्नुहोस्।

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

44 KiB Raw Blame History