50 KiB

Raw Blame History

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

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

Azure AI Foundry Discord समुदायमा सामेल हुनुहोस्

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

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

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

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

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

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

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

📣 घोषणा - नयाँ GitHub Copilot Agent मोड चुनौतीहरू पूरा गर्न!

नयाँ चुनौती थपिएको छ, अधिकांश अध्यायहरूमा "GitHub Copilot Agent Challenge 🚀" खोज्नुहोस्। यो GitHub Copilot र Agent मोड प्रयोग गरेर पूरा गर्नका लागि नयाँ चुनौती हो। यदि तपाईंले पहिले Agent मोड प्रयोग गर्नुभएको छैन भने यो केवल पाठ सिर्जना गर्न मात्र होइन, फाइलहरू सिर्जना र सम्पादन गर्न, आदेशहरू चलाउन र थप गर्न सक्षम छ।

📣 घोषणा - 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 सिर्जना गर्नेछ।

तपाईंको कम्प्युटरमा स्थानीय रूपमा पाठ्यक्रम चलाउँदै

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

हाम्रो सिफारिस भनेको Visual Studio Code प्रयोग गर्नु हो, जसमा Terminal पनि समावेश छ। तपाईं यहाँ बाट Visual Studio Code डाउनलोड गर्न सक्नुहुन्छ।

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

CodeSpace

त्यसपछि, 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 फोल्डरमा समावेश छन्, प्रत्येकमा तीन प्रश्न सहित 48 कुल क्विजहरू। तिनीहरू यहाँ उपलब्ध छन्। क्विज एपलाई स्थानीय रूपमा चलाउन वा 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 कल गर्ने र स्थानीय स्टोरेजमा भेरिएबलहरू भण्डारण गर्ने	आफ्नो ब्राउजर एक्सटेन्सनको JavaScript तत्वहरू निर्माण गर्नुहोस्, स्थानीय स्टोरेजमा भण्डारण गरिएका भेरिएबलहरू प्रयोग गरेर API कल गर्ने	APIs, फारमहरू, र स्थानीय स्टोरेज	Jen
14	Green Browser Extension	ब्राउजरको पृष्ठभूमि प्रक्रिया, वेब प्रदर्शन	एक्सटेन्सनको आइकन व्यवस्थापन गर्न ब्राउजरको पृष्ठभूमि प्रक्रियाहरू प्रयोग गर्नुहोस्; वेब प्रदर्शनको बारेमा जान्नुहोस् र प्रदर्शन सुधार गर्न केही अनुकूलनहरू गर्नुहोस्	पृष्ठभूमि कार्यहरू र प्रदर्शन	Jen
15	Space Game	JavaScript प्रयोग गरेर थप उन्नत खेल विकास	खेल निर्माणको तयारीमा कक्षाहरू र संरचना प्रयोग गरेर उत्तराधिकारको बारेमा जान्नुहोस्, साथै Pub/Sub ढाँचाको बारेमा जान्नुहोस्	उन्नत खेल विकासको परिचय	Chris
16	Space Game	क्यानभासमा चित्र बनाउने	स्क्रिनमा तत्वहरू चित्र बनाउन प्रयोग गरिने Canvas API को बारेमा जान्नुहोस्	क्यानभासमा चित्र बनाउने	Chris
17	Space Game	स्क्रिनमा तत्वहरू सार्ने	तत्वहरूले Cartesian समन्वय र Canvas 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
25	Browser/VScode Code	VScode प्रयोग गर्ने	कोड सम्पादक प्रयोग गर्ने तरिका जान्नुहोस्	VScode कोड सम्पादक प्रयोग गर्नुहोस्	Chris
26	AI Assistants	AI सँग काम गर्ने	आफ्नो AI सहायक निर्माण गर्ने तरिका जान्नुहोस्	AI सहायक परियोजना	Chris

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

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

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

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

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

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

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

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

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

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

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

📘 PDF

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

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

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

Azure / Edge / MCP / Agents

जेनेरेटिभ एआई शृंखला

मुख्य सिकाइ

कोपाइलट शृंखला

सहयोग प्राप्त गर्ने तरिका

यदि तपाईं समस्यामा पर्नुहुन्छ वा एआई एप्स निर्माणको बारेमा कुनै प्रश्न छ भने, यहाँ सामेल हुनुहोस्:

यदि तपाईंलाई उत्पादनको प्रतिक्रिया दिनु छ वा निर्माणको क्रममा त्रुटिहरू छन् भने, यहाँ जानुहोस्:

लाइसेन्स

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

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

50 KiB Raw Blame History