این یک مخزن برنامه درسی آموزشی برای آموزش مبانی توسعه وب به مبتدیان است. این برنامه درسی یک دوره جامع ۱۲ هفتهای توسعه یافته توسط مدافعان ابر مایکروسافت است که شامل ۲۴ درس عملی در زمینههای JavaScript، CSS و HTML میباشد.
این مخزن یک برنامه درسی آموزشی برای آموزش اصول توسعه وب به مبتدیان است. این برنامه درسی یک دوره جامع ۱۲ هفتهای است که توسط مدافعان مایکروسافت کلود توسعه یافته و شامل ۲۴ درس عملی است که مباحث JavaScript، CSS و HTML را پوشش میدهد.
### اجزای کلیدی
- **محتوای آموزشی**: ۲۴ درس سازمانیافته در قالب ماژولهای پروژهمحور
- **پروژههای عملی**: Terrarium، بازی تایپ، افزونه مرورگر، بازی فضایی، برنامه بانکداری، ویرایشگر کد، و دستیار چت هوش مصنوعی
- **آزمونهای تعاملی**: ۴۸ آزمون با ۳ سوال هر کدام (ارزیابی قبل و بعد درس)
- **پشتیبانی چندزبانه**: ترجمههای خودکار به بیش از ۵۰ زبان از طریق GitHub Actions
اگرچه این مخزن یک مونو رپوی سنتی نیست، شامل چند پروژه مستقل است:
- هر درس خودکفا است
اگرچه یک مونو رپو سنتی نیست، این مخزن شامل چندین پروژه مستقل است:
- هر درس بهصورت جداگانه
- پروژهها وابستگی مشترک ندارند
- میتوان روی پروژههای فردی بدون تأثیر بر دیگران کار کرد
- کلون کل مخزن برای تجربه کامل برنامه درسی لازم است
- کار روی پروژههای جداگانه بدون تأثیر بر سایرین
- کلون کل مخزن برای تجربه کامل برنامه درسی
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**سلب مسئولیت**:
این سند با استفاده از سرویس ترجمه هوش مصنوعی [Co-op Translator](https://github.com/Azure/co-op-translator) ترجمه شده است. در حالی که ما برای دقت تلاش میکنیم، لطفاً توجه داشته باشید که ترجمههای خودکار ممکن است شامل خطاها یا عدم دقتهایی باشند. سند اصلی به زبان بومی خود باید به عنوان منبع معتبر در نظر گرفته شود. برای اطلاعات حیاتی، ترجمه حرفهای انسانی توصیه میشود. ما مسئول هیچ گونه سوءتفاهم یا تفسیر نادرست ناشی از استفاده از این ترجمه نیستیم.
این سند با استفاده از سرویس ترجمه هوش مصنوعی [Co-op Translator](https://github.com/Azure/co-op-translator) ترجمه شده است. در حالی که ما برای دقت تلاش میکنیم، لطفاً توجه داشته باشید که ترجمههای خودکار ممکن است شامل خطاها یا نادرستیهایی باشند. سند اصلی به زبان بومی خود باید به عنوان منبع معتبر در نظر گرفته شود. برای اطلاعات حیاتی، ترجمه حرفهای انسانی توصیه میشود. ما مسئول هیچ گونه سوءتفاهم یا تفسیر نادرستی که ناشی از استفاده از این ترجمه باشد، نمیباشیم.
اصول پایه توسعه وب را با دوره جامع ۱۲ هفتهای ما توسط مدافعان مایکروسافت کلود بیاموزید. هر یک از ۲۴ درس به صورت عملی به جاوااسکریپت، CSS و HTML میپردازد، با پروژههای کاربردی مانند تراریومها، افزونههای مرورگر و بازیهای فضایی. در آزمونها، بحثها و وظایف عملی شرکت کنید. مهارتهای خود را افزایش دهید و حفظ دانش خود را با روش تدریس پروژهمحور مؤثر ما بهینهسازی کنید. سفر کدنویسی خود را امروز آغاز کنید!
اصول توسعه وب را با دوره جامع ۱۲ هفتهای ما توسط مدافعان ابری مایکروسافت بیاموزید. هر یک از ۲۴ درس به صورت پروژههای عملی مثل تراریومها، افزونههای مرورگر و بازیهای فضایی به جاوااسکریپت، CSS و HTML میپردازد. با آزمونها، بحثها و تمرینهای عملی درگیر شوید. مهارتهای خود را ارتقا دهید و با روش آموزش پروژهمحور موثر ما، دانش خود را بهینه کنید. امروز سفر برنامهنویسی خود را آغاز کنید!
برای شروع استفاده از این منابع، مراحل زیر را دنبال کنید:
1. **فورک کردن مخزن**: کلیک کنید بر [](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)
2. **کلون کردن مخزن**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
3. [**به دیسکورد Azure AI Foundry بپیوندید و با کارشناسان و توسعهدهندگان همدل ملاقات کنید**](https://discord.com/invite/ByRwuEEgH4)
1. **فورک کردن مخزن**: کلیک کنید [](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)
2. **کلون کردن مخزن**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
۳. [**به دیسکورد Azure AI Foundry بپیوندید و با کارشناسان و توسعهدهندگان همسطح ملاقات کنید**](https://discord.com/invite/ByRwuEEgH4)
### 🌐 پشتیبانی چندزبانه
### 🌐 پشتیبانی چندزبانه
#### پشتیبانی شده توسط GitHub Action (خودکار و همیشه بهروز)
> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images"
> ```
>
> این به شما همه چیز مورد نیاز برای اتمام دوره را همراه با دانلود بسیار سریعتر میدهد.
> این همه چیز مورد نیاز برای اتمام دوره را با دانلود بسیار سریعتر به شما میدهد.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**اگر مایلید زبانهای ترجمه اضافی پشتیبانی شود، آنها در این آدرس لیست شدهاند [اینجا](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
**اگر مایل به حمایت از زبانهای ترجمه بیشتری هستید، زبانهای پشتیبانی شده در [اینجا](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md) لیست شدهاند**
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑🎓 _آیا دانشآموزهستید؟_
#### 🧑🎓 _آیا دانشجوهستید؟_
به صفحه [**مرکز دانشآموزان**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) مراجعه کنید که در آن منابع مبتدی، بستههای دانشآموزی و حتی راههایی برای دریافت کوپن گواهینامه رایگان پیدا خواهید کرد. این صفحهای است که میخواهید آن را نشانک گذاری کنید و گهگاه چک کنید چون محتوای آن ماهانه بهروزرسانی میشود.
به صفحه [**Student Hub**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) مراجعه کنید، جایی که منابع مبتدی، بستههای دانشجویی و حتی راههایی برای دریافت کوپن رایگان گواهی دریافت خواهید کرد. این صفحهای است که میخواهید آن را نشانک (Bookmark) کنید و هر از گاهی چک کنید چون محتوای آن ماهانه بهروزرسانی میشود.
### 📣 اعلامیه - چالشهای جدید GitHub Copilot Agent Mode برای تکمیل!
### 📣 اطلاعیه - چالشهای جدید حالت GitHub Copilot Agent برای تکمیل!
چالش جدید اضافه شده است، به دنبال "چالش GitHub Copilot Agent 🚀" در اکثر فصلها باشید. این یک چالش جدید برای شماست تا با استفاده از GitHub Copilot و حالت Agent آن را کامل کنید. اگر قبلاً از حالت Agent استفاده نکردهاید، این حالت قادر است نه تنها متن تولید کند بلکه میتواند فایل ایجاد و ویرایش کند، دستورها را اجرا کند و بیشتر.
چالش جدید اضافه شده، دنبال "GitHub Copilot Agent Challenge 🚀" در اکثر فصلها باشید. این یک چالش جدید برای شمااست تا با استفاده از GitHub Copilot و حالت Agent کامل کنید. اگر قبلاً از حالت Agent استفاده نکردهاید، این حالت قادر است نه تنها متن تولید کند بلکه فایلها را ایجاد و ویرایش کند، فرمانها را اجرا کرده و بیشتر.
### 📣 اعلامیه - _پروژه جدیدی برای ساخت با استفاده از هوش مصنوعی مولد_
### 📣 اطلاعیه - _پروژه جدید برای ساخت با استفاده از هوش مصنوعی مولد_
پروژه دستیار هوش مصنوعی جدید به تازگی اضافه شده است، آن را بررسی کنید [پروژه](./9-chat-project/README.md)
### 📣 اعلامیه - _برنامه درسی جدید_ برای هوش مصنوعی مولد در جاوااسکریپت به تازگی منتشر شده است
### 📣 اطلاعیه - _برنامه درسی جدید_ درباره هوش مصنوعی مولد برای جاوااسکریپت به تازگی منتشر شده است
برنامه درسی جدید هوش مصنوعی مولد ما را از دست ندهید!
برنامه درسی هوش مصنوعی مولد ما را از دست ندهید!
برای شروع به آدرس [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) مراجعه کنید!
برای شروع به [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) مراجعه کنید!
هر درس شامل یک تکلیف برای کامل کردن، یک آزمون دانش و چالشی برای راهنمایی شما در یادگیری موضوعاتی مانند:
- درخواستدهی و مهندسی درخواست
- تولید اپلیکیشنهای متنی و تصویری
- اپلیکیشنهای جستجو
هر درس شامل یک تکلیف برای تکمیل، یک تست دانش و یک چالش برای راهنمایی شما در یادگیری موضوعاتی مانند:
- پرامپت و مهندسی پرامپت
- تولید برنامههای متن و تصویر
- برنامههای جستجو
برای شروع به آدرس [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) مراجعه کنید!
برای شروع به [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) مراجعه کنید!
## 🌱 شروع به کار
> **معلمان**، ما [برخی پیشنهادات](for-teachers.md) برای چگونگی استفاده از این برنامه درسی ارائه کردهایم. ما مشتاقانه منتظر بازخورد شما [در انجمن بحث ما](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner) هستیم!
> **معلمان**، ما [برخی پیشنهادات](for-teachers.md) درباره نحوه استفاده از این برنامه درسی ارائه کردهایم. منتظر بازخورد شما در [انجمن بحث ما](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner) هستیم!
**[یادگیرندگان](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**، برای هر درس، با یک آزمون قبل از درس شروع کنید و سپس به خواندن مطالب درس بپردازید، فعالیتهای مختلف را انجام دهید و در پایان در آزمون بعد از درس دانش خود را بسنجید.
**[دانشآموزان](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**، برای هر درس، با یک آزمون پیشنمایش درس شروع کنید و ادامه دهید با خواندن مطالب درس، انجام فعالیتهای مختلف و درک خود را با آزمون پس از درس بسنجید.
برای بهبود تجربه یادگیری خود، با همکلاسانتان به همکاری در پروژهها بپردازید! بحث و گفتگو در [انجمن بحث](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) تشویق میشود که تیمی از ناظران ما برای پاسخ به سوالات شما حضور دارند.
برای بهبود تجربه یادگیری خود، با همسالان خود ارتباط برقرار کنید و روی پروژهها با هم کار کنید! در [انجمن بحث](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) گفتگو encouraged است و تیم مدیران ما در دسترسند تا به سوالات شما پاسخ دهند.
برای گسترش دانش خود، ما قویاً توصیه میکنیم که [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) را برای منابع مطالعاتی اضافی بررسی کنید.
برای ادامه تحصیل، ما اکیداً توصیه میکنیم با [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) برای مطالعات بیشتر آشنا شوید.
### 📋 راهاندازی محیط کاری شما
### 📋 راهاندازی محیط توسعه شما
این برنامه درسی دارای محیط توسعه آماده به کار است! با شروع، میتوانید انتخاب کنید که در [Codespace](https://github.com/features/codespaces/) (_یک محیط مبتنی بر مرورگر بدون نیاز به نصب_) یا به صورت محلی روی کامپیوتر خود با استفاده از یک ویرایشگر متن مانند [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) کار کنید.
این برنامه درسی محیط توسعهای آماده دارد! هنگام شروع میتوانید انتخاب کنید دوره را در یک [Codespace](https://github.com/features/codespaces/) (_محیط مبتنی بر مرورگر بدون نیاز به نصب_) اجرا کنید یا به صورت محلی روی کامپیوتر خود با استفاده از یک ویرایشگر متن مانند [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) آن را اجرا کنید.
#### ایجاد مخزن خود
برای این که راحتتر کارهای خود را ذخیره کنید، توصیه میشود نسخهای از این مخزن را ایجاد کنید. میتوانید این کار را با کلیک بر روی دکمه **Use this template** در بالای صفحه انجام دهید. این کار یک مخزن جدید در حساب گیتهاب شما با نسخهای از برنامه درسی ایجاد میکند.
برای ذخیره راحت کار خود، پیشنهاد میشود یک نسخه کپی از این مخزن بسازید. این کار را میتوانید با کلیک روی دکمه **Use this template** در بالای صفحه انجام دهید. این یک مخزن جدید در حساب GitHub شما با کپی برنامه درسی ایجاد میکند.
مراحل زیر را دنبال کنید:
1. **فورک کردن مخزن**: روی دکمه "Fork" در گوشه بالا سمت راست این صفحه کلیک کنید.
2. **کلون کردن مخزن**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
۱. **فورک کردن مخزن:** روی دکمه "Fork" در گوشه بالا-راست این صفحه کلیک کنید.
۲. **کلون کردن مخزن:**`git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
#### اجرای برنامه درسی در Codespace
در نسخهای از این مخزن که ایجاد کردهاید، دکمه **Code** را کلیک کرده و گزینه **Open with Codespaces** را انتخاب کنید. این برای شما یک Codespace جدید ایجاد میکند.
در نسخه کپی شده مخزن، دکمه **Code** را کلیک کنید و **Open with Codespaces** را انتخاب کنید. این یک Codespace جدید برای شما ایجاد خواهد کرد.
#### اجرای برنامه درسی به صورت محلی روی کامپیوتر شما
برای اجرای این برنامه درسی به صورت محلی روی کامپیوتر خود، به یک ویرایشگر متن، یک مرورگر و یک ابزار خط فرمان نیاز دارید. اولین درس ما، [مقدمهای بر زبانهای برنامهنویسی و ابزارهای مورد استفاده](../../1-getting-started-lessons/1-intro-to-programming-languages) شما را با گزینههای مختلف این ابزارها آشنا میکند تا بتوانید بهترینها را انتخاب کنید.
برای اجرای این برنامه درسی به صورت محلی، به یک ویرایشگر متن، مرورگر و ابزار خط فرمان نیاز دارید. اولین درس ما، [مقدمهای بر زبانها و ابزارهای برنامهنویسی](../../1-getting-started-lessons/1-intro-to-programming-languages)، گزینههای مختلف برای هر کدام از این ابزارها را به شما معرفی میکند تا بهترینها را انتخاب کنید.
توصیه ما استفاده از [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) به عنوان ویرایشگر است که همچنین یک [ترمینال](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) داخلی دارد. میتوانید Visual Studio Code را از [اینجا](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) دانلود کنید.
1. مخزن خود را روی کامپیوترتان کلون کنید. میتوانید این کار را با کلیک روی دکمه **Code** و کپی کردن آدرس URL انجام دهید:
توصیه ما استفاده از [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) به عنوان ویرایشگر است که دارای [ترمینال داخلی](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) نیز میباشد. میتوانید Visual Studio Code را از [اینجا](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) دانلود کنید.
1. کد مخزن خود را روی کامپیوترتان کلون کنید. میتوانید این کار را با کلیک روی دکمه **Code** و کپی کردن URL انجام دهید:
[CodeSpace](./images/createcodespace.png)
سپس، درون [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) در [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) باز کنید و فرمان زیر را اجرا کنید، به جای `<your-repository-url>` آدرسی که تازه کپی کردهاید را جایگزین کنید:
سپس، در [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) داخل [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) باز کرده و دستور زیر را اجرا کنید، به جای `<your-repository-url>` آدرسی که تازه کپی کردهاید را جایگزین کنید:
```bash
git clone <your-repository-url>
```
2. پوشه را در Visual Studio Code باز کنید. میتوانید این کار را با کلیک روی **File** > **Open Folder**انجام داده و پوشهای را که تازه کلون کردهاید انتخاب کنید.
2. پوشه را در Visual Studio Code باز کنید. میتوانید این کار را با کلیک روی **File** > **Open Folder**و انتخاب پوشهای که تازه کلون کردهاید انجام دهید.
> افزونههای پیشنهادی Visual Studio Code:
>
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - برای پیشنمایش صفحات HTML درون Visual Studio Code
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - برای کمک به نوشتن کد سریعتر
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - برای پیشنمایش صفحات HTML در داخل Visual Studio Code
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - برای کمک به نوشتن سریعتر کد
## 📂 هر درس شامل:
- طرح اولیه اختیاری (sketchnote)
- ویدئوی کمکی اختیاری
- آزمون گرمکننده پیش از درس
- درس کتبی
- برای درسهای مبتنی بر پروژه، راهنماهای گام به گام ساخت پروژه
- بررسیهای دانش
- یک چالش
- مطالعه تکمیلی
- تکلیف
- یادداشت تصویری اختیاری
- ویدیوی تکمیلی اختیاری
- آزمون پیشگرمکننده پیش از درس
- درس نوشتاری
- برای درسهای مبتنی بر پروژه، راهنماهای گامبهگام برای ساخت پروژه
- چکهای دانش
- چالش
- خواندن تکمیلی
- تمرین
- [آزمون پس از درس](https://ff-quizzes.netlify.app/web/)
> **نکتهای درباره آزمونها**: همه آزمونها در پوشه Quiz-app قرار دارند، در مجموع ۴۸ آزمون با هر کدام شامل سه سوال. آنها قابل دسترس [در اینجا](https://ff-quizzes.netlify.app/web/) هستند و میتوان اپلیکیشن آزمون را به صورت محلی اجرا کرد یا در Azure مستقر نمود؛ دستورالعملها در پوشه `quiz-app` آمده است.
> **نکتهای درباره آزمونها**: همه آزمونها در پوشه Quiz-app قرار دارند، مجموعاً ۴۸ آزمون هر کدام با سه سؤال. آنها در [اینجا](https://ff-quizzes.netlify.app/web/) در دسترس هستند، اپ آزمون میتواند به صورت محلی اجرا یا به Azure منتشر شود؛ دستورالعملها در پوشه `quiz-app` آمده است.
## 🗃️ درسها
## 🗃️ دروس
| | نام پروژه | مفاهیم آموزش داده شده | اهداف یادگیری | درس مرتبط | نویسنده |
| 01 | شروع به کار | مقدمهای بر برنامهنویسی و ابزارهای کار | یادگیری اصول پایهای اکثر زبانهای برنامهنویسی و نرمافزاری که به توسعهدهندگان حرفهای در انجام کارشان کمک میکند | [مقدمهای بر زبانها و ابزارهای برنامهنویسی](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | شروع به کار | مبانی گیتهاب، شامل کار گروهی | چگونگی استفاده از گیتهاب در پروژه و همکاری با دیگران روی کد | [مقدمهای بر گیتهاب](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | شروع به کار | دسترسیپذیری | فراگیری مبانی دسترسیپذیری وب | [مبانی دسترسیپذیری](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | مبانی JS | انواع داده در JavaScript | مبانی انواع داده در JavaScript | [انواع داده](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | مبانی JS | توابع و روشها | آشنایی با توابع و روشها برای مدیریت جریان منطقی برنامه | [توابع و روشها](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher |
| 06 | مبانی JS | گرفتن تصمیم با JS | یادگیری چگونگی ایجاد شرایط در کد با استفاده از روشهای تصمیمگیری | [گرفتن تصمیم](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | مبانی JS | آرایهها و حلقهها | کار با دادهها با استفاده از آرایهها و حلقهها در JavaScript | [آرایهها و حلقهها](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [تراریوم](./3-terrarium/solution/README.md) | HTML در عمل | ساخت HTML برای ایجاد تراریوم آنلاین، تمرکز بر ساختار بندی صفحه | [مقدمهای بر HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [تراریوم](./3-terrarium/solution/README.md) | CSS در عمل | ساخت CSS برای طراحی تراریوم آنلاین، تمرکز بر مبانی CSS شامل واکنشگرا کردن صفحه | [مقدمهای بر CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [تراریوم](./3-terrarium/solution/README.md) | بستههای JavaScript، دستکاری DOM | ساخت جاوااسکریپت برای کارکرد تراریوم به صورت رابط کشیدن/رها کردن، تمرکز بر بستهها و دستکاری DOM | [بستههای JavaScript، دستکاری DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [بازی تایپ](./4-typing-game/solution/README.md) | ساخت بازی تایپ | یادگیری استفاده از رویدادهای صفحه کلید برای هدایت منطق برنامه جاوااسکریپت | [برنامهنویسی رویدادمحور](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [افزونه مرورگر سبز](./5-browser-extension/solution/README.md) | کار با مرورگرها | یادگیری کارکرد مرورگرها، تاریخچه آنها و راهاندازی اولیه افزونه مرورگر | [درباره مرورگرها](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [افزونه مرورگر سبز](./5-browser-extension/solution/README.md) | ساخت فرم، فراخوانی API و ذخیره متغیرها در local storage | ساخت عناصر جاوااسکریپت افزونه مرورگر برای فراخوانی API با استفاده از متغیرهای ذخیره شده در local storage | [APIها، فرمها و ذخیره محلی](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [افزونه مرورگر سبز](./5-browser-extension/solution/README.md) | فرآیندهای پسزمینه در مرورگر، کارایی وب | استفاده از فرآیندهای پسزمینه مرورگر برای مدیریت آیکون افزونه؛ آشنایی با عملکرد وب و بهینهسازیهایی برای بهبود آن | [وظایف پسزمینه و کارایی](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [بازی فضایی](./6-space-game/solution/README.md) | توسعه بازی پیشرفتهتر با JavaScript | یادگیری وراثت با هر دو کلاس و ترکیب و الگوی Pub/Sub، برای آمادهسازی ساخت بازی | [مقدمهای بر توسعه بازی پیشرفته](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [بازی فضایی](./6-space-game/solution/README.md) | رسم روی بوم | آشنایی با API بوم (Canvas) برای رسم عناصر روی صفحه | [رسم روی بوم](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [بازی فضایی](./6-space-game/solution/README.md) | حرکت عناصر در صفحه نمایش | کشف چگونگی حرکت گرفتن عناصر با استفاده از مختصات کارتزین و API بوم | [حرکت دادن عناصر](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [بازی فضایی](./6-space-game/solution/README.md) | تشخیص برخورد | ایجاد برخورد و واکنش عناصر به یکدیگر با استفاده از فشار کلیدها و فراهم کردن عملکرد خنککننده برای اطمینان از کارایی بازی | [تشخیص برخورد](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [بازی فضایی](./6-space-game/solution/README.md) | نگهداری امتیاز | انجام محاسبات ریاضی بر اساس وضعیت و عملکرد بازی | [نگهداری امتیاز](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [بازی فضایی](./6-space-game/solution/README.md) | پایان و شروع مجدد بازی | یادگیری پایان دادن و شروع مجدد بازی، شامل پاکسازی منابع و بازنشانی مقادیر متغیرها | [شرط پایان](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [اپ بانک](./7-bank-project/solution/README.md) | قالبها و مسیرها در یک اپ وب | یادگیری ساخت اسکلت معماری وبسایت چندصفحهای به کمک روتینگ و قالبهای HTML | [قالبها و مسیرها](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [اپ بانک](./7-bank-project/solution/README.md) | ساخت فرم ورود و ثبتنام | یادگیری ساخت فرمها و مدیریت روالهای اعتبارسنجی | [فرمها](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [اپ بانک](./7-bank-project/solution/README.md) | روشهای دریافت و استفاده از داده | جریان داده در برنامه، نحوه دریافت، ذخیره و حذف آن | [داده](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [اپ بانک](./7-bank-project/solution/README.md) | مفاهیم مدیریت وضعیت | یادگیری حفظ وضعیت برنامه و مدیریت برنامهای آن | [مدیریت وضعیت](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [کد مرورگر/VScode](../../8-code-editor) | کار با VScode | یادگیری استفاده از ویرایشگر کد | [استفاده از ویرایشگر کد VScode](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [دستیارهای هوش مصنوعی](./9-chat-project/README.md) | کار با هوش مصنوعی | یادگیری ساخت دستیار هوش مصنوعی خودتان | [پروژه دستیار هوش مصنوعی](./9-chat-project/README.md) | Chris |
## 🏫 روش آموزش
برنامهی درسی ما با دو اصل کلیدی آموزش طراحی شده است:
| 01 | شروع کار | مقدمهای بر برنامهنویسی و ابزارها | یادگیری مبانی پایهای که پشت اکثر زبانهای برنامهنویسی است و درباره نرمافزاری که به توسعهدهندگان حرفهای کمک میکند تا وظایفشان را انجام دهند | [مقدمهای بر زبانهای برنامهنویسی و ابزارها](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | شروع کار | مبانی گیتهاب، شامل کار تیمی | نحوه استفاده از گیتهاب در پروژهتان،نحوه همکاری با دیگران روی یک پایگاهکد | [مقدمهای بر گیتهاب](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | شروع کار | دسترسپذیری | یادگیری مبانی دسترسپذیری وب | [مبانی دسترسپذیری](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | مبانی جاوااسکریپت | انواع دادههای جاوااسکریپت | مبانی انواع دادههای جاوااسکریپت | [انواع داده](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | مبانی جاوااسکریپت | توابع و متدها | یادگیری درباره توابع و متدها برای مدیریت جریان منطق یک برنامه | [توابع و متدها](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher |
| 06 | مبانی جاوااسکریپت | تصمیمگیری با جاوااسکریپت | یادگیری نحوه ایجاد شرایط در کد با استفاده از روشهای تصمیمگیری | [تصمیمگیری](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | مبانی جاوااسکریپت | آرایهها و حلقهها | کار با دادهها با استفاده از آرایهها و حلقهها در جاوااسکریپت | [آرایهها و حلقهها](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [تردارخانه](./3-terrarium/solution/README.md) | تمرین HTML | ساخت HTML برای ایجاد یک تراریوم آنلاین، تمرکز بر ساختاربندی | [مقدمهای بر HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [تردارخانه](./3-terrarium/solution/README.md) | تمرین CSS | ساخت CSS برای استایلدهی تراریوم آنلاین، تمرکز بر مبانی CSS شامل ساخت واکنشگرا | [مقدمهای بر CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [تردارخانه](./3-terrarium/solution/README.md) | بستههای جاوااسکریپت، دستکاری DOM | ساخت کد جاوااسکریپت برای عملکرد تراریوم به عنوان واسط کشیدن/رها کردن، تمرکز بر بستهها و دستکاری DOM | [بستههای جاوااسکریپت، دستکاری DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [بازی تایپینگ](./4-typing-game/solution/README.md) | ساخت بازی تایپینگ | یادگیری استفاده از رویدادهای صفحهکلید برای هدایت منطق اپلیکیشن جاوااسکریپت | [برنامهنویسی مبتنی بر رویداد](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [افزونه مرورگر سبز](./5-browser-extension/solution/README.md) | کار با مرورگرها | آشنایی با نحوه کار مرورگرها، تاریخچه آنها و نحوه ساخت عناصر اولیه یک افزونه مرورگر | [درباره مرورگرها](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [افزونه مرورگر سبز](./5-browser-extension/solution/README.md) | ساخت یک فرم، فراخوانی API و ذخیره متغیرها در حافظه محلی | ساخت عناصر جاوااسکریپت افزونه مرورگر برای فراخوانی API با استفاده از متغیرهای ذخیره شده در حافظه محلی | [APIها، فرمها و حافظه محلی](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [افزونه مرورگر سبز](./5-browser-extension/solution/README.md) | فرآیندهای پسزمینه در مرورگر، عملکرد وب | استفاده از فرآیندهای پسزمینه مرورگر برای مدیریت آیکون افزونه؛ یادگیری درباره عملکرد وب و بهینهسازیهایی برای افزایش | [کارهای پسزمینه و عملکرد](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [بازی فضا](./6-space-game/solution/README.md) | توسعه بازی پیشرفتهتر با جاوااسکریپت | یادگیری درباره وراثت با استفاده از کلاسها و ترکیب و الگوی Pub/Sub، برای آمادهسازی جهت ساخت بازی | [مقدمهای بر توسعه بازی پیشرفته](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [بازی فضا](./6-space-game/solution/README.md) | نقاشی روی بوم | آشنایی با API بوم برای ترسیم عناصر روی صفحه | [نقاشی روی بوم](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [بازی فضا](./6-space-game/solution/README.md) | حرکت دادن عناصر روی صفحه | کشف نحوه حرکت گرفتن عناصر با استفاده از مختصات کارتزینی و API بوم | [حرکت دادن عناصر](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [بازی فضا](./6-space-game/solution/README.md) | تشخیص برخورد | ایجاد برخورد و واکنش عناصر نسبت به یکدیگر با استفاده از فشردن کلیدها و فراهم کردن تابع خنکسازی برای حفظ عملکرد بازی | [تشخیص برخورد](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [بازی فضا](./6-space-game/solution/README.md) | نگهداری امتیاز | انجام محاسبات ریاضی بر اساس وضعیت و عملکرد بازی | [نگهداری امتیاز](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [بازی فضا](./6-space-game/solution/README.md) | خاتمه و راهاندازی مجدد بازی | یادگیری درباره خاتمه و راهاندازی مجدد بازی، شامل پاکسازی منابع و بازنشانی مقدار متغیرها | [شرط پایان](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [اپ بانکداری](./7-bank-project/solution/README.md) | قالبهای HTML و مسیرها در اپ وب | یادگیری نحوه ایجاد اسکلت معماری وبسایت چند صفحهای با استفاده از مسیردهی و قالبهای HTML | [قالبهای HTML و مسیرها](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [اپ بانکداری](./7-bank-project/solution/README.md) | ساخت فرم ورود و ثبتنام | یادگیری ساخت فرمها و مدیریت چککردن اعتبار | [فرمها](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [اپ بانکداری](./7-bank-project/solution/README.md) | روشهای دریافت و استفاده از دادهها | جریان دادهها در اپلیکیشن شما، نحوه دریافت، ذخیره و حذف آن | [داده](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [اپ بانکداری](./7-bank-project/solution/README.md) | مفاهیم مدیریت وضعیت | یادگیری نحوه حفظ وضعیت در اپلیکیشن و مدیریت آن به صورت برنامهنویسی | [مدیریت وضعیت](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [کد مرورگر/ویاسکد](../../8-code-editor) | کار با ویاسکد | یادگیری نحوه استفاده از ویرایشگر کد| [استفاده از ویرایشگر کد ویاسکد](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [دستیارهای هوش مصنوعی](./9-chat-project/README.md) | کار با هوش مصنوعی | یادگیری چگونگی ساخت دستیار هوش مصنوعی خودتان | [پروژه دستیار هوش مصنوعی](./9-chat-project/README.md) | Chris |
## 🏫 روش تدریس
برنامه درسی ما با دو اصل کلیدی آموزشی طراحی شده است:
* یادگیری مبتنی بر پروژه
* آزمونهای مکرر
این برنامه اساسهای JavaScript، HTML و CSS را آموزش میدهد، همچنین جدیدترین ابزارها و تکنیکهایی که توسعهدهندگان وب امروزه استفاده میکنند. دانشآموزان فرصت کسب تجربه عملی را با ساخت بازی تایپ، تراریوم مجازی، افزونه مرورگر دوستدار محیط زیست، بازی سبک Space Invader و اپ بانک برای کسبوکارها خواهند داشت. تا پایان این مجموعه، یک درک جامع از توسعه وب کسب خواهند کرد.
این برنامه مبانی جاوااسکریپت، HTML و CSS را آموزش میدهد، بهعلاوه جدیدترین ابزارها و تکنیکهایی که توسعهدهندگان وب امروزی استفاده میکنند. دانشجویان فرصت خواهند داشت تا تجربه عملی با ساخت بازی تایپینگ، تراریوم مجازی، افزونه مرورگر سازگار با محیط زیست، بازی سبک مهاجم فضایی و اپ بانکداری برای کسبوکارها کسب کنند. تا پایان این سری، دانشجویان درک محکمی از توسعه وب به دست خواهند آورد.
> 🎓 شما میتوانید چند درس اول این برنامه را به صورت [مسیر یادگیری](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) در Microsoft Learn دنبال کنید!
> 🎓 میتوانید چند درس اول این برنامه درسی را به عنوان یک [مسیر یادگیری](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) در Microsoft Learn بگذرانید!
با اطمینان از هماهنگی محتوا با پروژهها، روند یادگیری برای دانشآموزان جذابتر شده و ماندگاری مفاهیم افزایش مییابد. همچنین چند درس مقدماتی در مبانی JavaScript نوشته شده است که مفاهیم را معرفی میکند و با ویدئویی از مجموعه آموزشی "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" همراه است که برخی نویسندگان آن به این برنامه کمک کردهاند.
با اطمینان از اینکه محتوا با پروژهها هماهنگ است، فرآیند برای دانشآموزان جذابتر شده و حفظ مفاهیم تقویت خواهد شد. همچنین چند درس شروعکننده در مبانی جاوااسکریپت نوشتیم تا مفاهیم را معرفی کنیم، همراه با ویدیویی از مجموعه "[سری شروعکنندگان به: جاوااسکریپت](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" که برخی نویسندگان آن به این برنامه درسی کمک کردهاند.
علاوه بر این، یک آزمون کمفشار قبل از کلاس هدف دانشآموز را به سمت یادگیری موضوع تعیین میکند، در حالی که آزمون دوم پس از کلاس، حفظ بهتر مطلب را تضمین میکند. این برنامه طوری طراحی شده که انعطافپذیر و سرگرمکننده باشد و میتوان آن را به صورت کامل یا بخشی از آن را گذراند. پروژهها از سطح کوچک آغاز شده و تا پایان چرخه ۱۲ هفتهای به طور فزایندهای پیچیده میشوند.
علاوه بر این، آزمونی با ریسک کم پیش از کلاس قصد دانشآموز را برای یادگیری موضوع تنظیم میکند، در حالی که آزمون دوم پس از کلاس حفظ بیشتر را تضمین میکند. این برنامه درسی به گونهای طراحی شده که انعطافپذیر و سرگرمکننده باشد و میتوان آن را کامل یا جزیی دنبال کرد. پروژهها با پروژههای کوچک شروع شده و تا پایان دوره ۱۲ هفتهای به تدریج پیچیدهتر میشوند.
در حالی که عمداً از معرفی فریمورکهای JavaScript اجتناب کردهایم تا روی مهارتهای پایهای که به عنوان توسعهدهنده وب نیاز دارید تمرکز کنیم، گام بعدی خوب برای تکمیل این برنامه، یادگیری Node.js از طریق مجموعه ویدئوهای دیگر است: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
در حالی که عمداً از معرفی چارچوبهای جاوااسکریپت پرهیز کردهایم تا روی مهارتهای پایهای لازم قبل از پذیرش چارچوب تمرکز کنیم، گام بعدی خوب برای تکمیل این برنامه یادگیری Node.js از طریق مجموعه دیگری از ویدیوهاست: "[سری شروعکنندگان به: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
> به [کد رفتاری](CODE_OF_CONDUCT.md) و [راهنمای مشارکت](CONTRIBUTING.md) ما مراجعه کنید. بازخورد سازنده شما را خوشآمد میگوییم!
> به راهنمای [کد رفتار](CODE_OF_CONDUCT.md) و [مشارکت](CONTRIBUTING.md) ما مراجعه کنید. ما از بازخورد سازنده شما استقبال میکنیم!
## 🧭 دسترسی آفلاین
شما میتوانید این مستندات را به صورت آفلاین با استفاده از [Docsify](https://docsify.js.org/#/) اجرا کنید. این مخزن را فورک کنید، [Docsify را روی دستگاه خود نصب کنید](https://docsify.js.org/#/quickstart) و سپس در پوشه اصلی مخزن این فرمان را وارد کنید `docsify serve`. وبسایت روی پورت ۳۰۰۰ در لوکالهاست شما اجرا خواهد شد: `localhost:3000`.
شما میتوانید این مستندات را به صورت آفلاین با استفاده از [Docsify](https://docsify.js.org/#/) اجرا کنید. این مخزن را فورک کنید، [Docsify را نصب کنید](https://docsify.js.org/#/quickstart) روی دستگاه محلی خود، سپس در پوشه ریشه این مخزن دستور `docsify serve` را تایپ کنید. وبسایت روی پورت ۳۰۰۰ در لوکالهاست شما سرو خواهد شد: `localhost:3000`.
## 📘 PDF
یک فایل PDF از تمام درسها را میتوانید [در اینجا](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) پیدا کنید.
یک فایل PDF از تمام درسها را میتوانید [اینجا](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) پیدا کنید.
## 🎒 دورههای دیگر
تیم ما دورههای دیگری هم تولید میکند! نگاه کنید به:
تیم ما دورههای دیگری هم تولید میکند! مشاهده کنید:
<!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain
@ -233,7 +232,7 @@
---
### سری هوش مصنوعی مولد
### سری آموزش هوش مصنوعی مولد
[](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
[-C084FC?style=for-the-badge&labelColor=E5E7EB&color=C084FC)](https://github.com/microsoft/generative-ai-for-beginners-java?WT.mc_id=academic-105485-koreyst)
@ -241,7 +240,7 @@
---
### آموزشهای پایهای
### آموزشهای اصلی
[](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
@ -252,19 +251,19 @@
---
### سری CoPilot
### سری آموزش کوپایلوت
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
اگر گیر کردید یا سوالی درباره ساخت اپلیکیشنهای هوش مصنوعی دارید، به جمع یادگیرندگان و توسعهدهندگان با تجربه در بحثهای MCP بپیوندید. این یک جامعه حمایتگر است که سوالات پذیرفته شده و دانش به صورت آزاد به اشتراک گذاشته میشود.
اگر گیر کردید یا هر سوالی درباره ساخت اپلیکیشنهای هوش مصنوعی دارید. به همراه دیگر یادگیرندگان و توسعهدهندگان با تجربه در بحثهای مربوط به MCP شرکت کنید. این یک جامعه حمایتکننده است که در آن سوالات پذیرفته میشود و دانش بهطور آزادانه به اشتراک گذاشته میشود.
این سند با استفاده از سرویس ترجمه هوش مصنوعی [Co-op Translator](https://github.com/Azure/co-op-translator) ترجمه شده است. در حالی که ما تلاش میکنیم دقت را حفظ کنیم، لطفاً آگاه باشید که ترجمههای خودکار ممکن است شامل اشتباهات یا نواقصی باشند. سند اصلی به زبان بومی خود باید به عنوان منبع معتبر در نظر گرفته شود. برای اطلاعات حیاتی، ترجمه حرفهای انسانی توصیه میشود. ما مسئول هیچ گونه سوءتفاهم یا برداشت نادرست ناشی از استفاده از این ترجمه نیستیم.
**سلب مسئولیت**:
این سند با استفاده از سرویس ترجمه هوش مصنوعی [Co-op Translator](https://github.com/Azure/co-op-translator) ترجمه شده است. با اینکه ما برای دقت تلاش میکنیم، لطفاً توجه داشته باشید که ترجمههای خودکار ممکن است شامل خطاها یا نواقص باشند. سند اصلی به زبان مادری خود باید به عنوان منبع معتبر در نظر گرفته شود. برای اطلاعات حیاتی، ترجمه حرفهای انسانی توصیه میشود. ما مسئول هیچ گونه سوءتفاهم یا برداشت نادرست ناشی از استفاده از این ترجمه نیستیم.
یہ ابتدائیوں کو ویب ڈویلپمنٹ کے بنیادی اصول سکھانے کے لیے ایک تعلیمی نصاب کا مخزن ہے۔ نصاب 12 ہفتوں پر محیط ایک جامع کورس ہے جو Microsoft Cloud Advocates نے تیار کیا ہے، جس میں جاوا اسکرپٹ، CSS، اور HTML پر مشتمل 24 عملی اسباق شامل ہیں۔
یہ ویب ڈویلپمنٹ کی بنیادی باتیں سکھانے کے لیے ابتدائیوں کے لیے ایک تعلیمی نصاب کا ذخیرہ ہے۔ نصاب ایک جامع ۱۲ ہفتوں کا کورس ہے جو Microsoft Cloud Advocates نے تیار کیا ہے، جس میں جاوا اسکرپٹ، CSS، اور HTML پر مشتمل ۲۴ عملی اسباق شامل ہیں۔
### کلیدی اجزاء
- **تعلیمی مواد**: 24 منظم اسباق جو پراجیکٹ پر مبنی ماڈیولز میں منظم ہیں
- **عملی پراجیکٹس**: ٹیریریم، ٹائپنگ گیم، براؤزر ایکسٹینشن، اسپیس گیم، بینکنگ ایپ، کوڈ ایڈیٹر، اور AI چیٹ اسسٹنٹ
- **انٹرایکٹو کوئزز**: 48 کوئزز جن میں ہر ایک میں 3 سوالات ہوتے ہیں (سبق سے پہلے/بعد کی تشخیص)
- **کثیراللسانی معاونت**: GitHub Actions کے ذریعے 50+ زبانوں میں خودکار ترجمے
- `6-space-game/README.md` - کینوس پر مبنی گیم ڈیولپمنٹ
- `9-chat-project/README.md` - AI چیٹ اسسٹنٹ پراجیکٹ
- `9-chat-project/README.md` - AI چیٹ اسسٹنٹ پروجیکٹ
### مونو رپو ساخت
### مونو ریپو ڈھانچہ
اگرچہ یہ روایتی مونو رپو نہیں ہے، یہ مخزن متعدد آزاد پراجیکٹس پر مشتمل ہے:
روایتی مونو ریپو تو نہیں، لیکن اس ذخیرے میں متعدد آزاد پروجیکٹس شامل ہیں:
- ہر سبق خود مختار ہے
- پراجیکٹس انحصارات شیئر نہیں کرتے
- بغیر دوسرے پراجیکٹس کو متاثر کیے انفرادی پراجیکٹس پر کام کریں
- پورے نصاب کے تجربے کے لیے پورا مخزن کلون کریں
- پروجیکٹس کی dependencies مشترک نہیں ہیں
- ایک دوسرے کو متاثر کیے بغیر انفرادی پروجیکٹس پر کام کریں
- مکمل نصاب کے لیے پورے ذخیرے کو کلون کریں
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**خبردار**:
اس دستاویز کا ترجمہ AI ترجمہ سروس [Co-op Translator](https://github.com/Azure/co-op-translator) کے ذریعے کیا گیا ہے۔ اگرچہ ہم درستگی کے لیے کوشاں ہیں، براہ کرم آگاہ رہیں کہ خودکار تراجم میں غلطیاں یا عدم صحیحیت ہو سکتی ہے۔ اصل دستاویز اپنی اصلی زبان میں معتبر ماخذ سمجھی جائے گی۔ اہم معلومات کے لیے پیشہ ور انسانی ترجمہ کی سفارش کی جاتی ہے۔ اس ترجمے کے استعمال سے پیدا ہونے والی کسی بھی غلط فہمی یا غلط تشریح کی ذمہ داری ہم پر عائد نہیں ہوتی۔
**ڈس کلیمر**:
یہ دستاویز AI ترجمہ خدمت [Co-op Translator](https://github.com/Azure/co-op-translator) استعمال کرتے ہوئے ترجمہ کی گئی ہے۔ اگرچہ ہم درستگی کے لیے کوشاں ہیں، براہ کرم آگاہ رہیں کہ خودکار تراجم میں غلطیاں یا عدم درستیاں ہو سکتی ہیں۔ اصل دستاویز اپنی مادری زبان میں مستند ماخذ سمجھی جانی چاہیے۔ اہم معلومات کے لیے پیشہ ور انسانی ترجمہ کی سفارش کی جاتی ہے۔ ہم اس ترجمے کے استعمال سے پیدا ہونے والی کسی بھی غلط فہمی یا غلط تعبیر کے ذمہ دار نہیں ہیں۔
Microsoft Cloud Advocates کی طرف سے ہمارا 12 ہفتوں کا جامع کورس کے ساتھ ویب ڈیولپمنٹ کی بنیادیں سیکھیں۔ 24 اسباق میں سے ہر ایک JavaScript، CSS، اور HTML میں ہاتھ سے تجرباتی پروجیکٹس جیسے کہ ٹیریریمز، براؤزر ایکسٹینشنز، اور اسپیس گیمز کے ذریعے وارد ہوتا ہے۔ کوئزز، مباحثے، اور عملی اسائنمنٹس میں حصہ لیں۔ اپنی مہارتیں بڑھائیں اور ہمارے مؤثر پروجیکٹ پر مبنی پیڈاگوگی کے ساتھ اپنے علم کو بہتر بنائیں۔ آج ہی اپنی کوڈنگ سفر شروع کریں!
مائیکروسافٹ کلاؤڈ ایڈووکیٹس کے ذریعہ ہمارے 12 ہفتوں کے جامع کورس کے ساتھ ویب ڈیولپمنٹ کی بنیادی باتیں سیکھیں۔ 24 اسباق میں سے ہر ایک جاوا اسکرپٹ، CSS، اور HTML کی گہرائی میں جا کر عملی منصوبوں جیسے ٹیراریمز، براؤزر ایکسٹینشنز، اور اسپیس گیمز پر کام کرتا ہے۔ کوئزز، مباحثوں، اور عملی اسائنمنٹس میں شامل ہوں۔ اپنی مہارتوں کو بہتر بنائیں اور ہمارے مؤثر پروجیکٹ پر مبنی تدریسی طریقہ کار کے ساتھ اپنی معلومات کو بہتر طور پر محفوظ کریں۔ آج ہی اپنی کوڈنگ کی سفر شروع کریں!
> یہ رفوسٹری 50+ زبانوں کے تراجم شامل کرتی ہے جس سے ڈاؤن لوڈ کا سائز بہت بڑھ جاتا ہے۔ بغیر تراجم کی کلوننگ کے لیے sparse checkout استعمال کریں:
> اس ریپوزیٹری میں 50+ زبانوں میں ترجمے شامل ہیں جو ڈاؤن لوڈ کے سائز کو کافی بڑھا دیتے ہیں۔ بغیر ترجموں کے کلون کرنے کے لیے sparse checkout استعمال کریں:
>
> **Bash / macOS / Linux:**
> ```bash
@ -48,170 +48,171 @@ Azure AI Foundry Discord کمیونٹی میں شامل ہوں
> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images"
> ```
>
> اس سے آپ کو تیزی سے کورس مکمل کرنے کے لیے سب کچھ مل جائے گا۔
> اس سے آپ کو کورس مکمل کرنے کے لیے درکار سب کچھ تیز تر ڈاؤن لوڈ کے ساتھ مل جائے گا۔
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**اگر آپ مزید ترجمہ شدہ زبانیں شامل کرانا چاہتے ہیں تو وہ یہاں ملاحظہ کریں [here](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
**اگر آپ چاہیں کہ اضافی ترجمہ شدہ زبانوں کی حمایت کی جائے تو وہ یہاں فہرست وار دستیاب ہیں [here](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑🎓 _کیا آپ طالب علم ہیں؟_
وزٹ کریں [**Student Hub page**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) جہاں آپ کو ابتدائی وسائل، طالب علم پیکس، اور مفت سرٹیفیکیٹ واؤچر حاصل کرنے کے طریقے ملیں گے۔ یہ وہ صفحہ ہے جو آپ کو بک مارک کرنا چاہیے اور وقتاً فوقتاً چیک کرنا چاہیے کیونکہ ہم ماہانہ مواد کو تبدیل کرتے ہیں۔
وزٹ کریں [**Student Hub page**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) جہاں آپ کو ابتدائی وسائل، طالب علم پیکس اور مفت سرٹیفکیٹ واؤچر حاصل کرنے کے طریقے ملیں گے۔ یہ وہ صفحہ ہے جسے آپ کو نشان زد کرنا چاہیے اور وقتاً فوقتاً جانچنا چاہیے کیونکہ ہم ماہانہ مواد تبدیل کرتے ہیں۔
### 📣 اعلان - مکمل کرنے کے لیے نئے GitHub Copilot Agent موڈ چیلنجز!
### 📣 اعلان - نئے GitHub Copilot Agent موڈ چیلنجز مکمل کرنے کے لیے!
نیا چیلنج شامل کیا گیا ہے، زیادہ تر ابواب میں "GitHub Copilot Agent Challenge 🚀" تلاش کریں۔ یہ آپ کے لیے GitHub Copilot اور Agent موڈ استعمال کرنے کا نیا چیلنج ہے۔ اگر آپ نے پہلے Agent موڈ استعمال نہیں کیا، تو یہ صرف متن تخلیق کرنے کے علاوہ فائلیں بنانے اور ایڈٹ کرنے، کمانڈز چلانے اور مزید کر سکتا ہے۔
نیا چیلنج شامل کیا گیا ہے، زیادہ تر ابواب میں "GitHub Copilot Agent Challenge 🚀" دیکھیں۔ یہ آپ کے لیے GitHub Copilot اور Agent موڈ استعمال کرتے ہوئے مکمل کرنے کا نیا چیلنج ہے۔ اگر آپ نے پہلے Agent موڈ استعمال نہیں کیا ہے تو یہ صرف متن تیار کرنے کی صلاحیت نہیں رکھتا بلکہ فائلز بنانے، ترمیم کرنے، کمانڈز چلانے اور بہت کچھ کر سکتا ہے۔
### 📣 اعلان - _جنریٹو AI کی مدد سے نیا پروجیکٹ بنانے کا موقع_
### 📣 اعلان - _نیا پروجیکٹ جنریٹو AI استعمال کرتے ہوئے بنانے کے لیے_
نیا AI Assistant پروجیکٹ ابھی شامل کیا گیا ہے، اسے چیک کریں [project](./9-chat-project/README.md)
نیا AI اسسٹنٹ پروجیکٹ ابھی شامل کیا گیا ہے، چیک کریں [project](./9-chat-project/README.md)
### 📣 اعلان - _جنریٹو AI کے لیے نیا نصاب جے ایس پر ابھی جاری ہواہے_
### 📣 اعلان - _جاوا اسکرپٹ کے لیے جنریٹو AI پر نیا نصاب جاری کیا گیاہے_
ہمارا نیا جنریٹو AI نصاب مت چھوڑیں!
شروع کرنے کے لیے ملاحظہ کریں [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)
شروع کرنے کے لیے وزٹ کریں [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) !
ہر سبق میں ایک اسائنمنٹ، ایک نالج چیک، اور چیلنج شامل ہے جو آپ کو درج ذیل موضوعات سیکھنے میں رہنمائی کرے گا:
ہر سبق میں مکمل کرنے کے لیے اسائنمنٹ، نالج چیک اور چیلنج شامل ہے تاکہ آپ کو درج ذیل موضوعات سیکھنے میں مدد ملے:
- پرامپٹنگ اور پرامپٹ انجینئرنگ
- ٹیکسٹ اور امیج ایپ جنریشن
- سرچ ایپس
شروع کرنے کے لیے ملاحظہ کریں [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course)
شروع کرنے کے لیے وزٹ کریں [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) !
## 🌱 شروع کریں
> **اساتذہ**، ہم نے [کچھ تجاویز شامل کی ہیں](for-teachers.md) کہ اس نصاب کو کیسے استعمال کیا جائے۔ آپ کی رائے ہمارے لیے قیمتی ہے [ڈسکشن فورم میں](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)۔
> **اساتذہ**، ہم نے [کچھ تجاویز شامل کی ہیں](for-teachers.md) کہ اس نصاب کو کیسے استعمال کیا جائے۔ ہمیں آپ کی رائے کا انتظار رہے گا [ہماری مباحثہ فورم](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner) میں!
**[سیکھنے والے](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**، ہر سبق کے لیے، پری لیکچر کوئز سے شروع کریں، لیکچر مواد پڑھیں، مختلف سرگرمیاں مکمل کریں اور پوسٹ لیکچر کوئز سے اپنی سمجھ کا جائزہ لیں۔
**[سیکھنے والے](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**، ہر سبق کے لیے، پری لیکچر کوئز سے شروع کریں اور لیکچر کے مواد کو پڑھیں، مختلف سرگرمیاں مکمل کریں اور پوسٹ لیکچر کوئز کے ذریعے اپنی سمجھ کو چیک کریں۔
اپنے تعلیمی تجربے کو بہتر بنانے کے لیے، اپنے ساتھیوں سے مل کر پروجیکٹس پر کام کریں! مباحثے کے لیے ہماری [ڈسکشن فورم](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) میں حصہ لیں جہاں ہمارے ماڈریٹرز کی ٹیم آپ کے سوالات کے جوابات دینے کے لیے موجود ہوگی۔
اپنے تعلیمی تجربے کو بڑھانے کے لیے، اپنے ساتھیوں سے جڑیں اور منصوبوں پر مل کر کام کریں! مباحثے ہمارے [مباحثہ فورم](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) میں خوش آئند ہیں جہاں ہمارے ماڈریٹرز آپ کے سوالات کے جواب دینے کے لیے دستیاب ہوں گے۔
اپنی تعلیم کو مزید بڑھانے کے لیے، ہم آپ کو تجویز کرتے ہیں کہ اضافی تعلیمی مواد کے لیے [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) دریافت کریں۔
اپنی تعلیم کو مزید آگے بڑھانے کے لیے، ہم تجویز کرتے ہیں کہ آپ [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) پر اضافی مطالعہ کے مواد کو دریافت کریں۔
### 📋 اپنا ماحول تیار کرنا
### 📋 اپنا ماحول سیٹ اپ کریں
اس نصاب کے ساتھ ایک تیار شدہ ڈویلپمنٹ ماحول موجود ہے! شروع کرتے وقت آپ کورس کو [Codespace](https://github.com/features/codespaces/) (_ایک براؤزر پر مبنی، بغیر انسٹالیشن والے ماحول_) پر یا اپنے کمپیوٹر پر لوکل طور پر [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) جیسے ٹیکسٹ ایڈیٹر کے ساتھ چلا سکتے ہیں۔
یہ نصاب ایک تیار ترقیاتی ماحول کے ساتھ آتا ہے! شروع کرتے وقت آپ انتخاب کر سکتے ہیں کہ آپ نصاب کو [Codespace](https://github.com/features/codespaces/) میں چلائیں (جو براؤزر بیسڈ، بغیر انسٹال کے چلنے والا ماحول ہے)، یا اپنے کمپیوٹر پر لوکل طور پر ایک متن کے ایڈیٹر جیسے کہ [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) استعمال کر کے چلائیں۔
#### اپنی رفوسٹری بنائیں
اپنا کام آسانی سے محفوظ کرنے کے لیے، یہ مشورہ دیا جاتا ہے کہ آپ اس رفوسٹری کی اپنی کاپی بنائیں۔ یہ کرنے کے لیے صفحہ کے اوپری حصے میں**Use this template** بٹن پر کلک کریں۔ اس سے آپ کے GitHub اکاؤنٹ میں نصاب کی ایک نئی کاپی کے ساتھ ایک نئی رفوسٹری بن جائے گی۔
#### اپنی ریپوزیٹری بنائیں
اپنا کام آسانی سے محفوظ کرنے کے لیے، یہ تجویز کیا جاتا ہے کہ آپ اس ریپوزیٹری کی اپنی کاپی بنائیں۔ یہ کرنے کے لیے صفحہ کے اوپر موجود**Use this template** بٹن پر کلک کریں۔ اس سے آپ کے GitHub اکاؤنٹ میں نصاب کی ایک کاپی کے ساتھ ایک نئی ریپوزیٹری بن جائے گی۔
یہ اقدامات کریں:
1. **رفوسٹری کو فورک کریں**: اس صفحہ کے دائیں بالائی کونے میں "Fork" بٹن پر کلک کریں۔
1. **ریپوزیٹری کو فورک کریں**: اس صفحہ کے اوپری دائیں کونے میں "Fork" بٹن پر کلک کریں۔
2. **ریپوزیٹری کو کلون کریں**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
#### Codespace میں نصاب چلانا
#### نصاب کو Codespace میں چلانا
اپنی بنائی ہوئی رفوسٹری میں**Code** بٹن پر کلک کریں اور **Open with Codespaces** منتخب کریں۔ یہ آپ کے لئے نیا Codespace تیار کرے گا جس میں آپ کام کر سکیں گے۔
جو کاپی آپ نے بنائی ہے اس میں،**Code** بٹن پر کلک کریں اور **Open with Codespaces** منتخب کریں۔ یہ آپ کے لیے نیا Codespace بنائے گا جہاں آپ کام کر سکیں گے۔
اپنے کمپیوٹر پر اس نصاب کو چلانے کے لیے آپ کو ایک ٹیکسٹ ایڈیٹر، براؤزر اور کمانڈ لائن ٹول کی ضرورت ہوگی۔ ہمارا پہلا سبق، [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages)، آپ کو ان مختلف اختیارات کے بارے میں رہنمائی دے گا تاکہ آپ اپنے لیے بہترین منتخب کر سکیں۔
اپنے کمپیوٹر پر اس نصاب کو چلانے کے لیے، آپ کو ایک متن کا ایڈیٹر، ایک براؤزر، اور کمانڈ لائن ٹول درکار ہوں گے۔ ہمارا پہلا سبق، [Introduction to Programming Languages and Tools of the Trade](../../1-getting-started-lessons/1-intro-to-programming-languages)، آپ کو مختلف اختیارات سے گزرتا ہے تاکہ آپ کے لیے بہترین ٹول منتخب کیا جا سکے۔
ہم آپ کو یہ مشورہ دیتے ہیں کہ [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) ایڈیٹر استعمال کریں، جس میں ایک بلٹ ان [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) بھی شامل ہے۔ آپ Visual Studio Code یہاں سے ڈاؤن لوڈ کر سکتے ہیں [here](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)۔
1. اپنے ریپوزٹری کو اپنے کمپیوٹر پر کلون کریں۔ آپ یہ **Code** بٹن پر کلک کر کے اور URL کو کاپی کر کے کر سکتے ہیں:
ہماری تجویز ہے کہ آپ بطور ایڈیٹر [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) استعمال کریں، جس میں ایک بلٹ ان [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) بھی شامل ہے۔ آپ Visual Studio Code یہاں سے ڈاؤن لوڈ کر سکتے ہیں [here](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)۔
1. اپنے ریپوزیٹری کو اپنے کمپیوٹر پر کلون کریں۔ آپ یہ کام**Code** بٹن پر کلک کر کے اور URL کو کاپی کر کے کر سکتے ہیں:
[CodeSpace](./images/createcodespace.png)
پھر، [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) کے اندر [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) کھولیں اور درج ذیل کمانڈ چلائیں، `<your-repository-url>` کو اس URL سے بدلیں جو آپ نے ابھی کاپی کیا ہے:
پھر، [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) کے اندر [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) کھولیں اور درج ذیل کمانڈ چلائیں، جہاں `<your-repository-url>` کی جگہ وہ URL ڈالیں جو آپ نے ابھی کاپی کیا ہے:
```bash
git clone <your-repository-url>
```
2. Visual Studio Code میں فولڈر کھولیں۔ آپ یہ **File** > **Open Folder** پر کلک کر کے اور اس فولڈر کو منتخب کر کے کر سکتے ہیں جو آپ نے ابھی کلون کیا ہے۔
2. فولڈر کو Visual Studio Code میں کھولیں۔ یہ کام آپ**File** > **Open Folder** پر کلک کر کے اور اس فولڈر کو منتخب کر کے کر سکتے ہیں جسے آپ نے ابھی کلون کیا ہے۔
> تجویز کردہ Visual Studio Code کے اضافی پلگ ان:
> تجویز کردہ Visual Studio Code ایکسٹینشنز:
>
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - Visual Studio Code کے اندر HTML صفحات کا پیش نظارہ کرنے کے لیے
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - آپ کو تیزی سے کوڈ لکھنے میں مدد فراہم کرنے کے لیے
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - Visual Studio Code میں HTML صفحات کا پیش نظارہ کرنے کے لیے
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - کوڈ لکھنے میں تیزی کے لیے مددگار
## 📂 ہر سبق میں شامل ہیں:
- اختیاری اسکیچنوٹ
- اختیاری خاکہ نوٹ
- اختیاری اضافی ویڈیو
- سبق سے پہلے وارم اپ کوئز
- تحریری سبق
- پروجیکٹ پر مبنی اسباق کے لیے، پروجیکٹ بنانے پر مرحلہ وار رہنما
- معلومات کی جانچ
- پروجیکٹ کی بنیاد پر اسباق کے لیے، پروجیکٹ بنانے کے لیے مرحلہ وار رہنمائی
- علم کی جانچ
- ایک چیلنج
- اضافی مطالعہ
- اسباق کے بعد کا کوئز ([post-lesson quiz](https://ff-quizzes.netlify.app/web/))
- اسباق کے بعد کا کوئز [post-lesson quiz](https://ff-quizzes.netlify.app/web/)
> **کوئزز کے بارے میں ایک نوٹ**: تمام کوئزز Quiz-app فولڈر میں محفوظ ہیں، کل 48 کوئزز جن میں ہر ایک میں تین سوالات ہوتے ہیں۔ یہ [یہاں](https://ff-quizzes.netlify.app/web/) دستیاب ہیں، کوئز ایپ مقامی طور پر چلائی جا سکتی ہے یا Azure پر بھی تعینات کی جا سکتی ہے؛ `quiz-app` فولڈر میں دی گئی ہدایات پر عمل کریں۔
> **کوئزز کے بارے میں ایک نوٹ**: تمام کوئزز Quiz-app فولڈر میں موجود ہیں، کل 48 کوئزز، ہر ایک میں تین سوالات ہیں۔ یہ [یہاں](https://ff-quizzes.netlify.app/web/) دستیاب ہیں۔ کوئز ایپ کو مقامی طور پر چلایا جا سکتا ہے یا Azure پر ڈیپلائے کیا جا سکتا ہے؛ `quiz-app` فولڈر میں ہدایات پر عمل کریں۔
## 🗃️ اسباق
| | پروجیکٹ کا نام | سکھائے جانے والے تصورات | تعلیم کے مقاصد | متعلقہ سبق | مصنف |
| | پروجیکٹ کا نام | پڑھائے گئے تصورات | تعلیمی مقاصد | منسلک سبق | مصنف |
| 01 | Getting Started | پروگرامنگ اور اس کے اوزار کا تعارف | زیادہ تر پروگرامنگ زبانوں اور پیشہ ورانہ ترقی کاروں کی مدد کرنے والے سافٹ ویئر کی بنیادی باتیں سیکھیں | [Intro to Programming Languages and Tools of the Trade](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Getting Started | GitHub کی بنیادی باتیں، ٹیم کے ساتھ کام کرنا | اپنے پروجیکٹ میں GitHub کو کیسے استعمال کریں، اور دوسروں کے ساتھ ایک کوڈ بیس پر کس طرح تعاون کریں | [Intro to GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Getting Started | Accessibility | ویب ایکسیسبلٹی کی بنیادی باتیں سیکھیں | [Accessibility Fundamentals](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | JS Basics | جاوااسکرپٹ ڈیٹا کی اقسام | جاوا اسکرپٹ ڈیٹا کی اقسام کی بنیادی باتیں | [Data Types](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | JS Basics | فنکشنز اور میتھڈز | ایپلیکیشن کے منطق کے بہاؤ کو منظم کرنے کے لیے فنکشنز اور میتھڈز کے بارے میں سیکھیں | [Functions and Methods](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher |
| 06 | JS Basics | JS میں فیصلے کرنا | اپنے کوڈ میں فیصلہ سازی کے طریقے استعمال کرتے ہوئے شرائط بنانے کے بارے میں سیکھیں | [Making Decisions](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS Basics | Arrays اور Loops | جاوا اسکرپٹ میں arrays اور loops کے ذریعہ ڈیٹا کے ساتھ کام کریں | [Arrays and Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML عملی طور پر | آن لائن ٹیریریم بنانے کے لیے HTML تیار کریں، لے آؤٹ بنانے پر توجہ دیں | [Introduction to HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS عملی طور پر | آن لائن ٹیریریم کو اسٹائل کرنے کے لیے CSS تیار کریں، CSS کی بنیادی باتوں پر توجہ دیں بشمول صفحے کا ردعمل دینا | [Introduction to CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | جاوا اسکرپٹ Closures، DOM میں ترمیم | ٹیریریم کو ڈریگ/ڈراپ انٹرفیس کے طور پر فعال بنانے کے لیے جاوا اسکرپٹ بنائیں، closures اور DOM میں ترمیم پر توجہ دیں | [JavaScript Closures, DOM manipulation](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Typing Game](./4-typing-game/solution/README.md) | ٹائپنگ گیم بنائیں | جاوا اسکرپٹ ایپ کے منطقی بہاؤ کے لیے کی بورڈ ایونٹس کو کیسے استعمال کریں | [Event-Driven Programming](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | براؤزر کے ساتھ کام کرنا | براؤزر کیسے کام کرتے ہیں، ان کی تاریخ، اور براؤزر ایکسٹینشن کے پہلا عناصر کس طرح تیار کرتے ہیں | [About Browsers](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | فارم بنانا، API کال کرنا اور لوکل اسٹوریج میں متغیرات محفوظ کرنا | اپنے براؤزر ایکسٹینشن کے جاوا اسکرپٹ عناصر تیار کریں تاکہ API کال کی جا سکے جو لوکل اسٹوریج میں محفوظ متغیرات استعمال کرتے ہیں | [APIs, Forms, and Local Storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | براؤزر کے پس منظر کے مراحل، ویب کی کارکردگی | ایکسٹینشن کے آئیکن کو منظم کرنے کے لیے براؤزر کے پس منظر کے مراحل استعمال کریں؛ ویب کارکردگی اور کچھ اصلاحات سیکھیں تاکہ کارکردگی بڑھائی جا سکے | [Background Tasks and Performance](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Space Game](./6-space-game/solution/README.md) | جاوا اسکرپٹ کے ساتھ مزید جدید کھیل کی ترقی | کلاسز اور کمپوزیشن دونوں استعمال کرتے ہوئے وراثت اور Pub/Sub پیٹرن کے بارے میں سیکھیں، گیم بنانے کی تیاری کے لیے | [Introduction to Advanced Game Development](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Space Game](./6-space-game/solution/README.md) | کینوس پر ڈرائنگ | کینوس API کے بارے میں سیکھیں، جو سیریز پر عناصر ڈرائنگ کے لیے استعمال ہوتا ہے | [Drawing to Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](./6-space-game/solution/README.md) | اسکرین پر عناصر کو حرکت دینا | دریافت کریں کہ کس طرح عناصر کو کارٹیسیئن کوآرڈی نیٹس اور کینوس API کی مدد سے حرکت دی جا سکتی ہے | [Moving Elements Around](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Space Game](./6-space-game/solution/README.md) | تصادم کا پتہ لگانا | عناصر کو آپس میں ٹکرائیں اور ایک دوسرے کے ردعمل کو یقینی بنانے کے لیے keypresses استعمال کریں؛ گیم کی کارکردگی کو یقینی بنانے کے لیے cooldown فنکشن فراہم کریں | [Collision Detection](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Space Game](./6-space-game/solution/README.md) | سکور رکھنا | گیم کی حالت اور کارکردگی کی بنیاد پر ریاضی کے حسابات کریں | [Keeping Score](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Space Game](./6-space-game/solution/README.md) | گیم کا اختتام اور دوبارہ شروع کرنا | گیم کا اختتام اور دوبارہ شروع کرنے کے بارے میں سیکھیں، بشمول اثاثوں کی صفائی اور متغیرات کی ری سیٹ کرنا | [The Ending Condition](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Banking App](./7-bank-project/solution/README.md) | ویب ایپ میں HTML ٹیمپلیٹس اور روٹس | ملٹی پیج ویب سائٹ کے فن تعمیر کی اسکافولڈنگ کو روٹنگ اور HTML ٹیمپلیٹس کا استعمال کر کے سیکھیں | [HTML Templates and Routes](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banking App](./7-bank-project/solution/README.md) | لاگ ان اور رجسٹریشن فارم بنائیں | فارم بنانے اور ویلیڈیشن کے طریقہ کار کے بارے میں سیکھیں | [Forms](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banking App](./7-bank-project/solution/README.md) | ڈیٹا حاصل کرنے اور استعمال کرنے کے طریقے | آپ کی ایپ میں ڈیٹا کیسے آتا اور جاتا ہے، اسے کیسے حاصل کریں، محفوظ کریں، اور ختم کریں | [Data](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banking App](./7-bank-project/solution/README.md) | اسٹیٹ مینجمنٹ کے تصورات | اپنی ایپ میں اسٹیٹ کو کیسے برقرار رکھا جاتا ہے اور پروگرام کے ذریعے اسے کیسے منظم کیا جاتا ہے | [State Management](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Browser/VScode Code](../../8-code-editor) | VScode کے ساتھ کام کرنا | کوڈ ایڈیٹر استعمال کرنا سیکھیں| [Use VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI Assistants](./9-chat-project/README.md) | AI کے ساتھ کام کرنا | اپنا AI اسسٹنٹ بنانا سیکھیں | [AI Assistant project](./9-chat-project/README.md) | Chris |
## 🏫 تعلیم
ہمارا نصاب دو اہم تعلیمی اصولوں کو مدنظر رکھتے ہوئے ڈیزائن کیا گیا ہے:
* پروجیکٹ پر مبنی سیکھنا
* کثرت سے کوئزز
یہ پروگرام جاوا اسکرپٹ، HTML، اور CSS کی بنیادیں سکھاتا ہے، نیز آج کے ویب ڈویلپرز کی طرف سے استعمال ہونے والے جدید اوزار اور تکنیکس بھی۔ طلباء کو ٹائپنگ گیم، ورچوئل ٹیریریم، ماحولیاتی براؤزر ایکسٹینشن، اسپیس انویڈر طرز کا گیم، اور کاروباری بنکنگ ایپ بنانے کا عملی تجربہ حاصل کرنے کا موقع ملے گا۔ سیریز کے آخر تک، طلباء کو ویب ڈویلپمنٹ کی ایک مضبوط سمجھ حاصل ہو جائے گی۔
> 🎓 آپ اس نصاب کے ابتدائی چند اسباق کو مائیکروسافٹ لرن پر [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) کے طور پر لے سکتے ہیں!
یہ یقینی بنا کر کہ مواد پروجیکٹس کے مطابق ہو، عمل طلباء کے لیے زیادہ دلچسپ بنایا جاتا ہے اور تصورات کی یادداشت میں بہتری آتی ہے۔ ہم نے جاوا اسکرپٹ کی بنیادوں میں کئی ابتدائی اسباق لکھے ہیں تاکہ تصورات متعارف کرائیں، جن کے ساتھ ویڈیو "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" کی ویڈیو ٹیوٹوریل سیریز کا استعمال کیا گیا ہے، جن کے کچھ مصنفین نے اس نصاب میں مدد کی ہے۔
اس کے علاوہ، کلاس سے پہلے ایک کم دباؤ والا کوئز طالب علم کے لیے یک موضوع سیکھنے کے ارادے کو متعین کرتا ہے، جبکہ کلاس کے بعد دوسرا کوئز بہتر یادداشت کو یقینی بناتا ہے۔ یہ نصاب لچکدار اور خوشگوار بنانے کے لیے ڈیزائن کیا گیا ہے اور مکمل یا جزوی طور پر لیا جا سکتا ہے۔ پروجیکٹس چھوٹے سے شروع ہو کر 12 ہفتوں کے سائیکل کے آخر میں زیادہ پیچیدہ ہو جاتے ہیں۔
اگرچہ ہم نے جاوااسکرپٹ فریم ورکس کو جان بوجھ کر شامل نہیں کیا تاکہ بنیادی مہارتوں پر توجہ دی جا سکے جو ویب ڈویلپر کے لیے ضروری ہیں، اگلا اچھا قدم اس نصاب کو مکمل کرنے کے بعد Node.js کے بارے میں سیکھنا ہو گا، جس کے لیے ویڈیوز کی ایک اور سیریز موجود ہے: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)"۔
> ہمارا [Code of Conduct](CODE_OF_CONDUCT.md) اور [Contributing](CONTRIBUTING.md) رہنما خطوط ملاحظہ کریں۔ ہم آپ کی تعمیری آراء کے خیرمقدم کے منتظر ہیں!
| 01 | شروع کرنا | پروگرامنگ اور ٹولز کا تعارف | بیشتر پروگرامنگ زبانوں کے بنیادی اصول اور ایسے سافٹ ویئر کے بارے میں جانیں جو پیشہ ور ڈویلپرز کو ان کے کام میں مدد دیتے ہیں | [پروگرامنگ زبانوں اور ٹولز کا تعارف](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | شروع کرنا | GitHub کی بنیادی باتیں، ٹیم کے ساتھ کام کرنا | اپنے پروجیکٹ میں GitHub کا استعمال کیسے کریں، اور دوسروں کے ساتھ کوڈ بیس پر تعاون کیسے کریں | [GitHub کا تعارف](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | شروع کرنا | رسائی (Accessibility) | ویب رسائی کی بنیادی باتیں سیکھیں | [Accessibility Fundamentals](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | JS بنیادی باتیں | JavaScript کے ڈیٹا ٹائپس | جاوا اسکرپٹ کے ڈیٹا ٹائپس کی بنیادی باتیں | [ڈیٹا ٹائپس](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | JS بنیادی باتیں | فنکشنز اور طریقہ کار | ایپلیکیشن کے لاجک فلو کو منظم کرنے کے لیے فنکشنز اور طریقہ کار کے بارے میں جانیں | [فنکشنز اور طریقہ کار](./2-js-basics/2-functions-methods/README.md) | Jasmine اور Christopher |
| 06 | JS بنیادی باتیں | JS میں فیصلے کرنا | اپنے کوڈ میں فیصلے کرنے کے طریقے بنانا سیکھیں | [فیصلے کرنا](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS بنیادی باتیں | Arrays اور Loops | جاوا اسکرپٹ میں ڈیٹا کو Arrays اور Loops کے ذریعے سنبھالنا | [Arrays اور Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML کی مشق | آن لائن ٹیریریم بنانے کے لیے HTML بنائیں، خاص طور پر لے آؤٹ بنانے پر توجہ دیں | [HTML کا تعارف](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS کی مشق | آن لائن ٹیریریم کو اسٹائل کرنے کے لیے CSS بنائیں، CSS کی بنیادی باتوں پر توجہ دیں بشمول صفحہ کو ذمہ دار بنانا | [CSS کا تعارف](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | JavaScript کلوزرز، DOM کی ترمیم | JavaScript بنائیں تاکہ ٹیریریم ڈریگ/ڈراپ انٹرفیس کے طور پر کام کرے، کلوزرز اور DOM ترمیم پر توجہ دیں | [JavaScript کلوزرز، DOM کی ترمیم](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Typing Game](./4-typing-game/solution/README.md) | ٹائپنگ گیم بنائیں | اپنے JavaScript ایپ کے لاجک کو چلانے کے لیے کی بورڈ ایونٹس کا استعمال سیکھیں | [ایونٹ ڈرائیون پروگرامنگ](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | براؤزرز کے ساتھ کام کرنا | براؤزرز کیسے کام کرتے ہیں، ان کی تاریخ، اور براؤزر ایکسٹینشن کے پہلے عناصر کو کیسے بنائیں | [براؤزرز کے بارے میں](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | فارم بنانا، API کال کرنا اور لوکل اسٹوریج میں متغیرات محفوظ کرنا | اپنی براؤزر ایکسٹینشن کے JavaScript عناصر بنائیں تاکہ API کال کریں اور لوکل اسٹوریج میں ذخیرہ کیے گئے متغیرات کا استعمال کریں | [APIs، فارم اور لوکل اسٹوریج](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | براؤزر میں پس منظر کے عمل، ویب کی کارکردگی | ایکسٹینشن کے آئیکن کو منظم کرنے کے لیے براؤزر کے پس منظر کے عمل استعمال کریں؛ ویب کی کارکردگی اور بہتر بنانے کے لیے کچھ اصلاحات سیکھیں | [پس منظر کے کام اور کارکردگی](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Space Game](./6-space-game/solution/README.md) | JavaScript کے ساتھ مزید اعلیٰ سطحی گیم ڈویلپمنٹ | وراثت کے بارے میں جانیں، کلاسز اور کمپوزیشن دونوں کے استعمال سے، اور Pub/Sub نمونہ، گیم بنانے کی تیاری کے لیے | [اعلیٰ سطحی گیم ڈویلپمنٹ کا تعارف](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Space Game](./6-space-game/solution/README.md) | کینوس پر ڈرائنگ | Canvas API کے بارے میں سیکھیں، جو اسکرین پر عناصر ڈرائنگ کے لیے استعمال ہوتی ہے | [کینوس پر ڈرائنگ](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](./6-space-game/solution/README.md) | اسکرین پر عناصر کو حرکت دینا | دریافت کریں کہ عناصر کو کس طرح Cartesian کوآرڈینیٹس اور Canvas API استعمال کرتے ہوئے حرکت دی جا سکتی ہے | [عناصر کو حرکت دینا](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Space Game](./6-space-game/solution/README.md) | ٹکراؤ کی شناخت | عناصر کو آپس میں ٹکرانے دیں اور Keypresses استعمال کرتے ہوئے رد عمل ظاہر کریں، اور گیم کی کارکردگی کو یقینی بنانے کے لیے ایک cooldown فنکشن فراہم کریں | [ٹکراؤ کی شناخت](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Space Game](./6-space-game/solution/README.md) | اسکور رکھنا | گیم کی حالت اور کارکردگی کی بنیاد پر ریاضیاتی حسابات انجام دیں | [اسکور رکھنا](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Space Game](./6-space-game/solution/README.md) | گیم ختم کرنا اور دوبارہ شروع کرنا | گیم کو ختم کرنے اور دوبارہ شروع کرنے کے بارے میں جانیں، بشمول اثاثوں کی صفائی اور ویریبل قدروں کو ری سیٹ کرنا | [اختتامی حالت](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Banking App](./7-bank-project/solution/README.md) | ویب ایپ میں HTML ٹیمپلیٹس اور راستے | ملٹی پیج ویب سائٹ کی ساخت بنانے کے لیے روٹنگ اور HTML ٹیمپلیٹس کا استعمال سیکھیں | [HTML ٹیمپلیٹس اور راستے](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banking App](./7-bank-project/solution/README.md) | لاگ ان اور رجسٹریشن فارم بنائیں | فارم بنانے اور ویلیڈیشن کی ہینڈلنگ کے بارے میں جانیں | [فارم](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banking App](./7-bank-project/solution/README.md) | ڈیٹا حاصل کرنے اور استعمال کرنے کے طریقے | آپ کی ایپ میں ڈیٹا کے بہاؤ، اسے حاصل کرنے، ذخیرہ کرنے، اور خارج کرنے کے طریقے | [ڈیٹا](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banking App](./7-bank-project/solution/README.md) | اسٹیٹ مینجمنٹ کے تصورات | اپنی ایپ میں اسٹیٹ کو برقرار رکھنے اور پروگرام کے ذریعے اسے سنبھالنے کے بارے میں سیکھیں | [اسٹیٹ مینجمنٹ](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Browser/VScode Code](../../8-code-editor) | VScode کے ساتھ کام کرنا | کوڈ ایڈیٹر استعمال کرنا سیکھیں| [VScode کوڈ ایڈیٹر استعمال کریں](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI Assistants](./9-chat-project/README.md) | AI کے ساتھ کام کرنا | اپنا AI اسسٹنٹ بنانا سیکھیں | [AI اسسٹنٹ پروجیکٹ](./9-chat-project/README.md) | Chris |
## 🏫 تدریس کا طریقہ کار
ہمارا نصاب دو اہم تدریسی اصولوں پر مبنی ہے:
* پروجیکٹ کی بنیاد پر سیکھنا
* بار بار ہونے والے کوئزز
یہ پروگرام جاوا اسکرپٹ، HTML، اور CSS کی بنیادی باتیں سکھاتا ہے، نیز موجودہ دور کے ویب ڈویلپرز کے ذریعہ استعمال ہونے والے جدید ٹولز اور تکنیکیں بھی۔ طلباء کو موقع ملے گا کہ وہ ٹائپنگ گیم، ورچول ٹیریریم، ماحولیاتی دوست براؤزر ایکسٹینشن، اسپیس ایونڈر انداز کا گیم، اور کاروباری بینکاری ایپ بنا کر عملی تجربہ حاصل کریں۔ سلسلے کے آخر تک، طلباء کو ویب ڈویلپمنٹ کی مضبوط سمجھ حاصل ہوگی۔
> 🎓 آپ اس نصاب کے پہلے چند اسباق کو Microsoft Learn پر [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) کے طور پر لے سکتے ہیں!
پروجیکٹس کے ساتھ مواد کے مطابقت کو یقینی بنا کر، طلباء کے لیے یہ عمل زیادہ دلچسپ بنایا گیا ہے اور تصورات کو یاد رکھنے میں مدد ملے گی۔ ہم نے جاوا اسکرپٹ کی بنیادیات کے کئی ابتدائی اسباق بھی لکھے ہیں تاکہ تصورات متعارف کروائے جا سکیں، اور انہیں "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)" ویڈیو ٹیوٹوریلز کے مجموعہ کی ویڈیو کے ساتھ جوڑا گیا ہے، جن کے کچھ مصنفین نے اس نصاب میں تعاون بھی کیا ہے۔
اس کے علاوہ، کلاس کے شروع میں ایک کم دباؤ والا کوئز طالب علم کے لیے ایک موضوع سیکھنے کی نیت قائم کرتا ہے، جبکہ کلاس کے بعد دوسرا کوئز مزید یادداشت کو یقینی بناتا ہے۔ یہ نصاب لچکدار اور تفریحی ہے اور اسے مکمل یا جزوی طور پر لیا جا سکتا ہے۔ پروجیکٹس چھوٹے سے شروع ہوتے ہیں اور 12 ہفتوں کے آخر تک بتدریج پیچیدہ ہوتے جاتے ہیں۔
اگرچہ ہم نے جان بوجھ کر جاوا اسکرپٹ فریم ورکس متعارف نہیں کروائے تاکہ ایک ویب ڈویلپر کے لیے بنیادی مہارتوں پر توجہ دی جا سکے اس سے پہلے کہ کوئی فریم ورک اپنایا جائے، اس نصاب کو مکمل کرنے کا ایک اچھا اگلا قدم Node.js کے بارے میں سیکھنا ہوگا، جو ایک اور ویڈیو مجموعہ "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)" کے ذریعے ممکن ہے۔
> ہمارے [Code of Conduct](CODE_OF_CONDUCT.md) اور [Contributing](CONTRIBUTING.md) ہدایات ملاحظہ کریں۔ ہم آپ کی تعمیری آراء کا خیرمقدم کرتے ہیں!
## 🧭 آف لائن رسائی
آپ اس دستاویز کو آف لائن [Docsify](https://docsify.js.org/#/) کے ذریعہ چلا سکتے ہیں۔ اس ریپو کو فورک کریں، اپنی مقامی مشین پر [Docsify انسٹال کریں](https://docsify.js.org/#/quickstart)، پھر اس ریپو کے روٹ فولڈر میں `docsify serve` ٹائپ کریں۔ ویب سائٹ آپ کے لوکل ہوسٹ پر پورٹ 3000 پر چلے گی: `localhost:3000`۔
آپ اس دستاویز کو آف لائن [Docsify](https://docsify.js.org/#/) کے ذریعے چلا سکتے ہیں۔ اس ریپو کو فورک کریں، اپنے مقامی مشین پر [Docsify انسٹال کریں](https://docsify.js.org/#/quickstart)، اور پھر اس ریپو کے روٹ فولڈر میں کمانڈ `docsify serve` چلائیں۔ ویب سائٹ آپ کے لوکل ہوسٹ پر پورٹ 3000 پر دستیاب ہوگی: `localhost:3000`۔
## 📘 PDF
تمام اسباق کا ایک پی ڈی ایف [یہاں](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) دستیاب ہے۔
تمام اسباق کا پی ڈی ایف یہاں مل سکتا ہے [here](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf)۔
## 🎒 دیگر کورسز
ہماری ٹیم دیگر کورسز بھی تیار کرتی ہے! دیکھیں:
ہماری ٹیم دوسرے کورسز بھی فراہم کرتی ہے! چیک کریں:
<!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain
@ -227,7 +228,7 @@ Azure AI Foundry Discord کمیونٹی میں شامل ہوں
[](https://github.com/microsoft/ai-agents-for-beginners?WT.mc_id=academic-105485-koreyst)
---
### Generative AI Series
[](https://github.com/microsoft/generative-ai-for-beginners?WT.mc_id=academic-105485-koreyst)
[-9333EA?style=for-the-badge&labelColor=E5E7EB&color=9333EA)](https://github.com/microsoft/Generative-AI-for-beginners-dotnet?WT.mc_id=academic-105485-koreyst)
@ -235,8 +236,8 @@ Azure AI Foundry Discord کمیونٹی میں شامل ہوں
[-E879F9?style=for-the-badge&labelColor=E5E7EB&color=E879F9)](https://github.com/microsoft/generative-ai-with-javascript?WT.mc_id=academic-105485-koreyst)
---
### Core Learning
### بنیادی تعلیم
[](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
@ -246,8 +247,8 @@ Azure AI Foundry Discord کمیونٹی میں شامل ہوں
[](https://github.com/microsoft/xr-development-for-beginners?WT.mc_id=academic-105485-koreyst)
---
### Copilot Series
### کوپائلٹ سیریز
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
@ -255,21 +256,21 @@ Azure AI Foundry Discord کمیونٹی میں شامل ہوں
## مدد حاصل کریں
اگر آپ پھنس جائیں یا AI ایپس بنانے کے بارے میں کوئی سوال ہو تو۔ MCP کے بارے میں بحث میں دیگر سیکھنے والوں اور تجربہ کار ڈویلپرز سے شامل ہوں۔ یہ ایک معاون کمیونٹی ہے جہاں سوالات خوش آمدید ہیں اور علم آزادانہ طور پر شیئر کیا جاتا ہے۔
اگر آپ رکاوٹ کا سامنا کرتے ہیں یا AI ایپس بنانے کے حوالے سے کوئی سوال ہے تو MCP کے بارے میں بحث میں شامل ہوں۔ یہ ایک معاون کمیونٹی ہے جہاں سوالات خوش آمدید ہیں اور علم آزادانہ طور پر شیئر کیا جاتا ہے۔
یہ ریپوزٹری MIT لائسنس کے تحت ہے۔ مزید معلومات کے لیے [LICENSE](../../LICENSE) فائل دیکھیں۔
یہ ذخیرہ MIT لائسنس کے تحت لائسنس یافتہ ہے۔ مزید معلومات کے لیے [LICENSE](../../LICENSE) فائل دیکھیں۔
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**دستیابی کی اطلاع**:
یہ دستاویز AI ترجمہ خدمت [Co-op Translator](https://github.com/Azure/co-op-translator) کے ذریعے ترجمہ کی گئی ہے۔ اگرچہ ہم درستگی کی کوشش کرتے ہیں، براہ کرم آگاہ رہیں کہ خودکار ترجموں میں غلطیاں یا کمیاں ہو سکتی ہیں۔ اصل دستاویز اپنی مادری زبان میں مستند ماخذ سمجھی جانی چاہیے۔ اہم معلومات کے لیے پیشہ ورانہ انسانی ترجمہ کی سفارش کی جاتی ہے۔ اس ترجمہ کے استعمال سے پیدا ہونے والی کسی بھی غلط فہمی یا تشریح کی ذمہ داری ہم پر نہیں ہوگی۔
**ڈس کلیمر**:
اس دستاویز کا ترجمہ AI ترجمہ سروس [Co-op Translator](https://github.com/Azure/co-op-translator) کے ذریعے کیا گیا ہے۔ اگرچہ ہم درستگی کے لیے کوشاں ہیں، براہ کرم یہ بات ذہن میں رکھیں کہ خودکار تراجم میں غلطیاں یا کمی بیشی ہو سکتی ہے۔ اصل دستاویز اپنی مادری زبان میں ہی مستند ماخذ شمار کی جانی چاہیے۔ اہم معلومات کے لیے پیشہ ور انسانی ترجمہ کو ترجیح دی جانی چاہیے۔ ہم اس ترجمے کے استعمال سے پیدا ہونے والی کسی بھی غلط فہمی یا غلط تعبیر کے لیے ذمہ دار نہیں ہیں۔
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
推荐使用 [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) 作为编辑器,它内置了[终端](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon)。您可以从[这里](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)下载安装 Visual Studio Code。
1. 将你的仓库克隆到电脑上。你可以点击 **Code** 按钮并复制 URL:
我们推荐使用 [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) 作为编辑器,它自带内置的 [终端](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon)。你可以在[这里](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon)下载 Visual Studio Code。
1. 将您的仓库克隆到计算机。您可以通过点击 **Code** 按钮并复制 URL 来完成此操作:
[CodeSpace](./images/createcodespace.png)
然后,在 [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) 中打开 [终端](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon),运行以下命令,将 `<your-repository-url>` 替换成刚才复制的 URL:
然后,在 [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) 中打开 [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon),运行以下命令,将 `<your-repository-url>` 替换为您刚刚复制的 URL:
```bash
git clone <your-repository-url>
```
2. 在 Visual Studio Code 中打开该文件夹。你可以点击 **文件** > **打开文件夹** 并选择刚刚克隆的文件夹。