@ -2,27 +2,27 @@
## پروجیکٹ کا جائزہ
یہ ویب ڈی ولپمنٹ کے بنیادی اصول نوجوانوں کو سکھانے کے لیے تعلیمی نصاب کا ذخیرہ ہے۔ نصاب ایک جامع 12 ہفتوں کا کورس ہے جسے Microsoft Cloud Advocates نے تیار کیا ہے، جس میں JavaScript، CSS، اور HTML پر مشتمل 24 عملی اسباق شامل ہیں۔
یہ ابتدائیوں کے لیے ویب ڈوی لپمنٹ کے بنیادی اصول سکھانے کے لیے ایک تعلیمی نصاب کا ذخیرہ ہے۔ نصاب ایک جامع 12 ہفتوں کا کورس ہے جو Microsoft Cloud Advocates نے تیار کیا ہے، جس میں 24 عملی اسباق شامل ہیں جو JavaScript، CSS، اور HTML کا احاطہ کرتے ہیں۔
### کلیدی اجزاء
### اہم اجزاء
- ** تعلیمی مواد**: 24 منظم اسباق جو پروجیکٹ کی بنیاد پر ماڈیولز میں ترتیب دیے گئے ہیں
- ** عملی پروجیکٹس**: Terrarium، Typing Game، Browser Extension، Space Game، Banking App، Code Editor، اور AI Chat Assistant
- ** انٹرایکٹو کوئزز**: 48 کوئزز، ہر ایک میں 3 سوالات (سبق سے پہلے اور بعد کے جائزے)
- ** کئی زبانوں کی حمایت**: GitHub Actions کے ذریعے 50+ زبانوں میں خودکار ترجمے
- ** ٹیکنالوجیز**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI پروجیکٹس کے لیے)
- ** تعلیمی مواد**: 24 منظم اسباق جو پراجیکٹ پر مبنی ماڈیولز میں ترتیب دیے گئے ہیں
- ** عملی پراجیکٹس**: ٹیریریم، ٹائپنگ گیم، براؤزر ایکسٹینشن، اسپیس گیم، بینکنگ ایپ، کوڈ ایڈیٹر، اور AI چیٹ اسسٹنٹ
- ** انٹرایکٹو کوئزز**: 48 کوئزز جن میں ہر ایک میں 3 سوالات ہوتے ہیں (سبق سے پہلے/بعد کا جائزہ)
- ** کثیر زبان حمایت**: GitHub Actions کے ذریعے 50+ زبانوں میں خودکار ترجمہ
- ** ٹیکنالوجیز**: HTML, CSS, JavaScript, Vue.js 3, Vite, Node.js, Express, Python (AI پراجیکٹس کے لیے)
### فن تعمیر
- سبقوں کی بنیاد پر تعلیمی ذخیرہ
- ہر سبق کے فولڈر میں README، کوڈ مثالیں، اور حل موجود ہیں
- علحیدہ ڈیریکٹریز میں آزاد پروجیکٹس (quiz-app، مختلف سبقوں کے پروجیکٹس)
- GitHub Actions کا ترجمہ نظام (co-op-translator)
- Docsify کے ذریعے دستاویزات فراہم کی جاتی ہیں اور PDF کی صورت میں بھی دستیاب ہیں
- سبق پر مبنی تعلیمی ذخیرہ
- ہر سبق کے فولڈر میں README، کوڈ مثالیں، اور حل شامل ہیں
- الگ الگ فولڈرز میں اسٹینڈ اکیلے پراجیکٹس (quiz-app، مختلف سبق پراجیکٹس)
- GitHub Actions استعمال کرتے ہوئے ترجمہ کا نظام (co-op-translator)
- دستاویزات Docsify کے ذریعے فراہم کی گئی اور PDF کے طور پر دستیاب
## سیٹ اپ کمانڈز
یہ ذخیرہ بنیادی طور پر تعلیمی مواد کے استعمال کے لیے ہے۔ مخصوص پروجیکٹس پر کام کرنے کے لیے:
یہ ذخیرہ بنیادی طور پر تعلیمی مواد کے استعمال کے لیے ہے۔ مخصوص پراجیکٹس کے ساتھ کام کرنے کے لیے:
### مرکزی ذخیرہ سیٹ اپ
@ -31,35 +31,35 @@ git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners
```
### Quiz App سیٹ اپ (Vue 3 + Vite)
### کوئز ایپ سیٹ اپ (Vue 3 + Vite)
```bash
cd quiz-app
npm install
npm run dev # سرور ترقی شروع کریں
npm run build # پیداوار کے لیے بنائ یں
npm run dev # سرور کی ترقی شروع کریں
npm run build # پیداوار کے لئے تیار کر یں
npm run lint # ESLint چلائیں
```
### Bank پرو جیکٹ API (Node.js + Express)
### بینک پرا جیکٹ API (Node.js + Express)
```bash
cd 7-bank-project/api
npm install
npm start # اے پی آئی سرور شروع کریں
npm run lint # ای ایس لنٹ چلائیں
npm run format # پریٹیئر سے فارمیٹ کریں
npm start # API سرور شروع کریں
npm run lint # ESLint چلائیں
npm run format # Prettier کے ساتھ فارمیٹ کریں
```
### Browser Extension پرو جیکٹس
### براؤزر ایکسٹینشن پرا جیکٹس
```bash
cd 5-browser-extension/solution
npm install
# براؤزر-مخصوص ایکسٹینشن لوڈ کرنے کی ہدایات پر عمل کریں
# براؤزر-مخصوص توسیع لوڈ کرنے کی ہدایات پر عمل کریں
```
### Space Game پرو جیکٹس
### اسپیس گیم پرا جیکٹس
```bash
cd 6-space-game/solution
@ -67,216 +67,216 @@ npm install
# index.html کو براؤزر میں کھولیں یا Live Server استعمال کریں
```
### Chat پروجیکٹ (Python Backend )
### چیٹ پراجیکٹ (Python بیک اینڈ )
```bash
cd 9-chat-project/solution/backend/python
pip install openai
# GITHUB_TOKEN ماحولیاتی متغیر مقرر کریں
# محیط متغیر GITHUB_TOKEN کو مقرر کریں
python api.py
```
## ڈیولپمنٹ ورک فلو
## ترقیاتی ورک فلو
### مواد کے کنٹری بیوٹرز کے لیے
### مواد فراہم کرنے والوں کے لیے
1. ** ریپوزٹری کو اپنے GitHub اکاؤنٹ پر فورک کریں**
2. ** اپنے فورک کو مقامی طور پر کلون کریں**
3. ** اپنے تبدیلیوں کے لیے نئی برانچ بنائیں**
4. سبق کے مواد یا کوڈ مثالوں میں تبدیلی کریں
5. متعلقہ پروجیکٹ فولڈرز میں کوڈ کی تبدیلیاں ٹیسٹ کریں
6. تعاون کی ہدایات کے مطابق پل ریکویسٹ جمع کروائیں
1. ** ریپوزی ٹری کو فورک کریں** اپنے GitHub اکاؤنٹ پر
2. ** اپنے فورک کو مقامی طور پر کلون کریں**
3. ** اپنے تبدیلیوں کے لیے نئی برانچ بنائیں**
4. سبق کے مواد یا کوڈ مثالوں میں تبدیلی کریں
5. متعلقہ پراجیکٹ ڈائریکٹریز میں کوئی بھی کوڈ تبدیلی آزمائیں
6. تعاون کی رہنما اصول کے مطابق پل ریکویسٹ جمع کروائیں
### سیکھنے والوں کے لیے
1. ریپوزٹری کو فورک یا کلون کریں
2. سبق کی ڈائریکٹریز میں تسلسل کے ساتھ جائیں
3. ہر سبق کے README فائلیں پڑھیں
4. سبق سے پہلے کوئزز مکمل کریں https://ff-quizzes.netlify.app/web/
5. سبق کے فولڈرز میں کوڈ کی مثالوں پر کام کریں
6. اسائنمنٹس اور چیلنجز مکمل کریں
7. سبق کے بعد کوئزز لیں
1. ریپوزی ٹری کو فورک یا کلون کریں
2. سبق کے فولڈرز میں ترتیب وار جائیں
3. ہر سبق کے README فائلیں پڑھیں
4. سبق سے پہلے کوئزز مکمل کریں https://ff-quizzes.netlify.app/web/
5. سبق کے فولڈرز میں کوڈ مثالوں پر کام کریں
6. اسائنمنٹس اور چیلنجز مکمل کریں
7. سبق کے بعد کوئزز ح ل کر یں
### براہ راست ترقی
### لائیو ڈیولپمنٹ
- ** دستاویزات**: روٹ میں `docsify serve` چلائیں (پورٹ 3000)
- **Quiz App** : quiz-app فولڈر میں `npm run dev` چلائیں
- ** پروجیکٹس**: HTML پرو جیکٹس کے لیے VS Code Live Server ایکسٹینشن استعمال کریں
- **API پر وجیکٹس**: متعلقہ API فولڈرز میں `npm start` چلائیں
- ** دستاویزی مواد**: روٹ پر `docsify serve` چلائیں (پورٹ 3000)
- ** کوئز ایپ**: quiz-app ڈائریکٹری میں `npm run dev` چلائیں
- ** پراجیکٹس**: HTML پرا جیکٹس کے لیے VS Code Live Server ایکسٹینشن استعمال کریں
- **API پر اجیکٹس**: متعلقہ API ڈائریکٹریز میں `npm start` چلائیں
## ٹیسٹنگ ہدایات
## ٹیسٹ کرنے کی ہدایات
### Quiz App کی ٹیسٹنگ
### کوئز ایپ ٹیسٹنگ
```bash
cd quiz-app
npm run lint # کوڈ کے طرز کے مسائل چیک کریں
npm run build # تعمیر کی کامیابی کی تصدیق کریں
npm run lint # کوڈ اسٹائل کے مسائل کی جانچ کریں
npm run build # تصدیق کریں کہ بلڈ کامیاب ہو گیا ہے
```
### Bank API کی ٹیسٹنگ
### بینک API ٹیسٹنگ
```bash
cd 7-bank-project/api
npm run lint # کوڈ کے انداز کے مسائل کی جانچ کریں
node server.js # تصدیق کریں کہ سرور بغیر غلطیوں کے شروع ہوتا ہے
node server.js # سرور کے بغیر غلطیوں کے شروع ہونے کی تصدیق کریں
```
### عمومی ٹیسٹنگ طریقہ کار
- یہ ایک تعلیمی ذخیرہ ہے اور جامع خودکار ٹیسٹ نہیں رکھتا
- دستی ٹیسٹنگ پر توجہ دی جاتی ہے:
- کوڈ کی مثالیں بغیر غلطی چلیں
- دستاویزات کی لنکس صحیح کام کریں
- پروجیکٹ کی تعمیر کامیابی سے مکمل ہو
- مثالیں بہترین طریقوں پر عمل کریں
- یہ ایک تعلیمی ذخیرہ ہے جس میں مکمل خودکار ٹیسٹ شامل نہیں ہیں
- دستی ٹیسٹنگ پر توجہ دیتا ہے:
- کوڈ مثالیں بغیر غلطی کے چلتی ہ یں
- دستاویزات میں موجود لنکس کام کرتے ہیں
- پراجیکٹ بیلڈ کامیابی سے مکمل ہوتا ہے
- مثالیں بہترین طریقہ
### جمع کروانے سے پہلے چیکس
### جمع کروانے سے پہلے چیک
- جہاں package.json موجود ہو، `npm run lint` چلائیں
- مارکڈاؤن کے لنکس کی تصدیق کریں
- مثالیں براؤزر یا Node.js میں ٹیسٹ کریں
- ترجمے مناسب ساخت کو برقرار رکھیں
- `npm run lint` چلائیں جہاں package.json ہو
- مارک ڈاؤن لنکس کی جانچ پڑتال کریں
- کوڈ مثالیں براؤزر یا Node.js میں چیک کریں
- تصدیق کریں کہ ترجمے صحیح ڈھانچہ رکھتے ہیں
## کوڈ اسٹائل گائیڈ لائنز
## کوڈ اسٹائل کی رہنما خطوط
### JavaScript
- جدید ES6+ نحو استعمال کریں
- پروجیکٹس میں فراہم کردہ ESLint کنفیگریشنز پر عمل کریں
- تعلیمی وضاحت کے لیے معنی خیز متغیر اور فنکشن کے نام استعمال کریں
- سیکھنے والوں کے لیے تصورات کی وضاحت والے تبصرے شامل کریں
- جہاں Prettier مرتب ہو، اس سے فارمیٹ کریں
- جدید ES6+ نحو استعمال کریں
- پراجیکٹس میں دی گئی معیاری ESLint کنفیگریشن پر عمل کریں
- تعلیمی وضاحت کے لیے معنی خیز متغیر اور فنکشن نام استعمال کریں
- سیکھنے والوں کے لیے تصفیہ تشریحات شامل کریں
- جہاں پریٹیئر کنفیگر ہو وہاں فارمیٹ کریں
### HTML/CSS
- معنوی HTML5 عناصر
- جوابدہ (Responsive) ڈیزائن اصول
- صاف ستھری کلاس نام کاری
- CSS تکنیکس کی وضاحت کرنے والے تبصرے سیکھنے والوں کے لیے
- معنوی HTML5 عناصر
- رد عمل دکھانے والے ڈیزائن کے اصول
- واضح کلاس نام رکھنے کے قواعد
- CSS تکنیک کو سیکھنے والوں کے لیے تبصرے
### Python
- PEP 8 اسٹائل گائیڈ لائنز
- واضح، تعلیمی کوڈ مثالیں
- جہاں مفید ہو ٹائپ ہنٹس
- PEP 8 اسٹائل گائیڈ لائنز
- واضح، تعلیمی کوڈ مثالیں
- جہاں مفید ہو، ٹائپ ہنٹس
### مارکڈاؤن دستاویزات
### مارک ڈاؤن دستاویزات
- صاف سرخیوں کی ترتیب
- زبان کی وضاحت کے ساتھ کوڈ بلاکس
- اضافی وسائل کے لنکس
- `images/` فولڈرز میں اسکرین شاٹس اور تصاویر
- تصاویر کے لیے Alt متن برائے آسان رسائی
- واضح ہیڈنگ کی ترتیب
- زبان کی وضاحت کے ساتھ کوڈ بلاکس
- اضافی وسائل کے لیے ل نکس
- `images/` فولڈرز میں اسکرین شاٹس اور تصاویر
- تصاویر کے لیے متبادل متن برائے رسائی
### فائل آرگنائزیشن
- اسباق متسلسل نمبر کے ساتھ (1-getting-started-lessons, 2-js-basics, وغیرہ)
- ہر پروجیکٹ میں `solution/` اور اکثر `start/` یا `your-work/` فولڈر
- سبق خصوصی `images/` فولڈر میں تصاویر محفوظ کی گئی ہیں
- ترجمے `translations/{language-code}/` ساخت میں
- اسباق تسلسل سے نمبر شدہ (1-getting-started-lessons، 2-js-basics، وغیرہ)
- ہر پراجیکٹ کے پاس `solution/` اور اکثر `start/` یا `your-work/` فولڈرز ہوتے ہیں
- تصاویر ا سبا کے م خصوص `images/` فولڈرز میں محفوظ
- ترجمے `translations/{language-code}/` ڈھانچے میں
## تعمیر اور تعیناتی
## بلڈ اور تعیناتی
### Quiz App کی تعیناتی (Azure Static Web Apps)
### کوئز ایپ تعیناتی (Azure Static Web Apps)
quiz-app Azure Static Web Apps کے لیے ترتیب دیا گیا ہے:
کوئز ایپ Azure Static Web Apps تعیناتی کے لیے ترتیب دی گئی ہے:
```bash
cd quiz-app
npm run build # فولڈر dist/ بناتا ہے
# مین پر پو ش کرنے پر GitHub Actions ورک فلو کے ذریعے تعینات کرتا ہے
# مین پر پش کرنے پر GitHub Actions ورک فلو کے ذریعے تعینات کرتا ہے
```
Azure Static Web Apps کی ترتیب:
- ** ایپ لوکیشن**: `/quiz-app`
- ** آؤٹ پٹ لوکیشن**: `dist`
- ** ورک فلو**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
Azure Static Web Apps کی ترتیب:
- ** ایپ لوکیشن**: `/quiz-app`
- ** آؤٹ پٹ لوکیشن**: `dist`
- ** ورک فلو**: `.github/workflows/azure-static-web-apps-ashy-river-0debb7803.yml`
### دستاویزات کا PDF تیار کرنا
### دستاویزات PDF جنریشن
```bash
npm install # انسٹال کریں docsify-to-pdf
npm run convert # docs سے PDF بنائ یں
npm install # ڈاکسفائی ٹو پی ڈی ایف انسٹال کریں
npm run convert # ڈاکس سے پی ڈی ایف تیار کر یں
```
### Docsify دستاویزات
```bash
npm install -g docsify-cli # ڈاکسفائی کو عالمی طور پر انسٹال کریں
docsify serve # لوکل ہوسٹ:3000 پر سروس فراہم کریں
npm install -g docsify-cli # ڈاکسفائی کو عالمی سطح پر انسٹال کریں
docsify serve # لوکل ہوسٹ:3000 پر خدمت کریں
```
### پروجیکٹ مخصوص تعمیر
### پراجیکٹ مخصوص بلڈز
ہر پروجیکٹ فولڈر کا اپنا تعمیر عمل ہو سکتا ہے:
- Vue پروجیکٹس: `npm run build` سے پروڈکشن بنڈلز بنتے ہیں
- سٹیٹک پروجیکٹس: کوئی تعمیر مرحلہ نہیں، فائلز براہ راست سرو کریں
ہر پراجیکٹ ڈائریکٹری کا اپنا بلڈ عمل ہو سکتا ہے:
- Vue پراجیکٹس: `npm run build` پروڈکشن بنڈلز تیار کرتا ہے
- جامد پراجیکٹس: کوئی بلڈ مرحلہ نہیں، فائلز کو براہ راست سرو کریں
## پل ریکویسٹ گائیڈ لائنز
## پل ریکویسٹ کی رہنما خطوط
### عنوان کا فارمیٹ
صاف اور وضاحتی عنوانات استعمال کریں جو تبدیلی کے علاقے کو ظاہر کریں:
- `[Quiz-app] سبق X کے لیے ن یا
- `[Lesson-3] terrarium پروجیکٹ میں ٹائپو درست کریں`
- `[Translation] سبق 5 کے لیے ہسپانوی ترجمہ شامل کریں`
- `[Docs] سیٹ اپ ہدایات کو اپ ڈیٹ کریں`
صاف، وضاحتی عنوان استعمال کریں جو تبدیلی کے علاقے کی نشاندہی کرے:
- `[Quiz-app] سبق X کے لیے ن ئ ی کوئز شامل کریں`
- `[Lesson-3] ٹیریریم پراجیکٹ میں ٹائپو درست کریں`
- `[Translation] سبق 5 کے لیے ہسپانوی ترجمہ شامل کریں`
- `[Docs] سیٹ اپ ہدایات کو اپ ڈیٹ کریں`
### درکار چیکس
### ضروری چیکز
PR جمع کروانے سے پہلے:
1. ** کوڈ کی معیار**:
- متاثرہ پروجیکٹ فولڈرز میں `npm run lint` چلائیں
- تمام lint کی غلطیاں اور وارننگز ٹھیک کریں
1. ** کوڈ معیار**:
- متاثرہ پراجیکٹ ڈائریکٹریز میں `npm run lint` چلائیں
- تمام لِنٹنگ کی غلطیاں اور وارننگز درست کریں
2. ** تعمیر کی تصدیق**:
- جہاں لاگو ہو `npm run build` چلائیں
- یقینی بنائیں کہ کوئی تعمیر کی غلطی نہ ہو
2. ** بلڈ ویریفیکیشن**:
- اگر قابل اطلاق ہو تو `npm run build` چلائیں
- بلڈ میں کوئی غلطی نہ ہو
3. ** لنک کی توثیق**:
- تمام مارکڈاؤن لنکس کا ٹیسٹ کریں
- تصویری حوالہ جات کام کر رہے ہیں کی تصدیق کریں
3. ** لنک ویریفیکیشن**:
- تمام مارک ڈاؤن لنکس کی جانچ کریں
- تصویری حوالہ جات کو چیک کریں
4. ** مواد کا جائزہ**:
- املا اور گرامر کی جانچ کریں
- کوڈ مثالیں درست اور تعلیمی ہوں
- ترجمے اصل معنی کو برقرار رکھیں
4. ** مواد کا جائزہ**:
- املا اور گرامر کی جانچ کریں
- کوڈ مثالیں درست اور تعلیمی ہوں
- ترجمے اصل معنی کو برقرار رکھیں
### تعاون کی ضروریات
- Microsoft CLA سے اتفاق کریں (پہلی PR پر خودکار چیک)
- [Microsoft Open Source Code of Conduct ](https://opensource.microsoft.com/codeofconduct/ ) پر عمل کریں
- تفصیلی ہدایات کے لیے [CONTRIBUTING.md ](./CONTRIBUTING.md ) دیکھیں
- اگر لاگو ہو تو PR کی تفصیل میں ایشو نمبرز کا حوالہ دیں
- Microsoft CLA سے اتفاق کریں (پہلے PR پر خودکار چیک)
- [Microsoft Open Source Code of Conduct ](https://opensource.microsoft.com/codeofconduct/ ) کی پیروی کریں
- تفصیلی رہنما خطوط کے لیے [CONTRIBUTING.md ](./CONTRIBUTING.md ) دیکھیں
- اگر قابل اطلاق ہو تو PR تفصیل میں ایشو نمبرز شامل کریں
### جائزہ لینے کا عمل
### جائزہ کا عمل
- PRs مینٹینرز اور کمیونٹی کے ذریعے جائزہ لیے جاتے ہیں
- تعلیمی وضاحت کو ترجیح دی جاتی ہے
- کوڈ مثالیں موجودہ بہترین طریقوں کی پیروی کریں
- ترجمے درستگی اور ثقافتی مناسبت کی جانچ پڑتال سے گزریں
- PRs کو مینٹینرز اور کمیونٹی جائزہ لیتی ہے
- تعلیمی وضاحت کو ترجیح دی جاتی ہے
- کوڈ مثالیں موجودہ بہترین طریقوں کی پیروی کریں
- ترجمے درستگی اور ثقافتی مطابقت کے لیے جائزہ لیے جاتے ہیں
## ترجمہ نظام
## ترجمہ کا نظام
### خودکار ترجمہ
- GitHub Actions کے ساتھ co-op-translator ورک فلو استعمال کرتا ہے
- 50+ زبانوں میں خود بخود ترجمہ کرتا ہے
- ماخ ذ فائلیں مرکزی ڈائریکٹریز میں
- ترجمہ شدہ فائلیں `translations/{language-code}/` فولڈرز میں
- co-op-translator ورک فلو کے ساتھ GitHub Actions استعمال کرتا ہے
- 50+ زبانوں میں خودکار ترجمہ کرتا ہے
- ذریعہ فائلیں مرکزی ڈائریکٹریز میں
- ترجمہ شدہ فائلیں `translations/{language-code}/` میں
### دستی ترجمہ کی بہتری شامل کرنا
### دستی ترجمہ میں بہتری شامل کرنا
1. `translations/{language-code}/` فولڈر میں فائل تلاش کریں
2. ساخت کو برقرار رکھتے ہوئے بہتری کریں
3. یقینی بنائیں کہ کوڈ مثالیں کام کرتی رہیں
4. کسی بھی لوکلائزڈ کوئز مواد کو ٹیسٹ کریں
1. `translations/{language-code}/` میں فائل تلاش کریں
2. ڈھانچہ برقرار رکھتے ہوئے بہتری کریں
3. کوڈ مثالوں کو فعال رکھیں
4. کسی بھی مقامی کوئز مواد کی جانچ کریں
### ترجمہ کے میٹاڈیٹا
### ترجمہ میٹاڈیٹا
ترجمہ شدہ فائلوں میں میٹاڈیٹا ہیڈر شامل ہ وتا ہ ے:
ترجمہ شدہ فائلوں میں میٹاڈیٹا ہیڈر شامل ہے:
```markdown
<!--
CO_OP_TRANSLATOR_METADATA:
@ -289,120 +289,120 @@ CO_OP_TRANSLATOR_METADATA:
-->
```
## ڈی بگنگ اور مسئلہ حل کرنا
## غلطی کا پتہ لگانا اور مسئلے حل کرنا
### عام مسائل
**Quiz app شروع نہیں ہو رہا**:
- Node.js کا ورژن چیک کریں (v14+ تجو یز شد ہ
- `node_modules` اور `package-lock.json` حذف کریں، پھر `npm install` چلائیں
- پورٹ کی ٹکراؤ کو چیک کریں (ڈیفالٹ: Vite پورٹ 5173 استعمال کرتا ہے)
**کوئز ایپ شروع نہیں ہو رہی**:
- Node.js کا ورژن چیک کریں (v14+ سفارش کی جا تی ہ ے )
- `node_modules` اور `package-lock.json` کو حذف کریں، پھر `npm install` چلائیں
- پورٹ کے تصادمات چیک کریں (ڈیفالٹ: Vite پورٹ 5173 استعمال کرتا ہے)
**API سرور شروع نہیں ہو رہا**:
- کم از کم Node.js ورژن کا یقین دہانی کریں (node >=10)
- چیک کریں کہ پورٹ پہلے سے استعمال میں تو نہیں
- تمام dependencies `npm install` سے انسٹال ہوں
**API سرور شروع نہیں ہوتا**:
- Node.js کا ورژن کم از کم (node >=10) ہو
- چیک کریں کہ پورٹ پہلے استعمال میں نہیں
- تمام انحصار `npm install` کے ساتھ انسٹال کیے گئے ہوں
**Browser extension لوڈ نہیں ہو رہا**:
- manifest.json کے درست فارمیٹ کی تصدیق کریں
- براؤزر کنسول میں غلطیوں کی جانچ کریں
- براؤزر مخصوص ایکسٹینشن انسٹالیشن ہدایات پر عمل کریں
**براؤزر ایکسٹینشن لوڈ نہیں ہو رہی**:
- manifest.json کی صحیح فارمیٹنگ کی تصدیق کریں
- براؤزر کنسول میں غلطیاں چیک کریں
- براؤزر مخصوص ایکسٹینشن انسٹالیشن کی ہدایات پر عمل کریں
**Python chat پروجیکٹ مسائل**:
- OpenAI پیکی ج انسٹال کریں: `pip install openai`
- GITHUB_TOKEN ماحول متغیر سیٹ ہے کی جانچ کریں
- GitHub Models کے رسائی حقوق چیک کریں
**Python چیٹ پراجیکٹ کے مسائل**:
- OpenAI پیکج انسٹال کریں: `pip install openai`
- GITHUB_TOKEN ماحول متغیر سیٹ ہے
- GitHub Models کی رسائی کی اجازتیں چیک کریں
**Docsify دستاویزات سرور نہیں کر رہا**:
- docsify-cli عالمی طور پر انسٹال کریں: `npm install -g docsify-cli`
- ذخیرہ کی روٹ ڈائریکٹری سے چلائیں
- یقینی بنائیں کہ `docs/_sidebar.md` موجود ہے
**Docsify دستاویزات فراہم نہیں کر رہا**:
- docsify-cli کو گلوبلی انسٹال کریں: `npm install -g docsify-cli`
- ریپوزیٹری کی روٹ ڈائریکٹری سے چلائیں
- چیک کریں کہ `docs/_sidebar.md` موجود ہو
### ترقی کے ماحول کے نکات
### ترقیاتی ماحول کی تجاویز
- HTML پروجیکٹس کے لیے VS Code کے ساتھ Live Server ایکسٹینشن استعمال کریں
- مستقل فارمیٹنگ کے لیے ESLint اور Prettier ایکسٹینشنز انسٹال کریں
- JavaScript کی ڈی بگنگ کے لیے براؤزر DevTools کا استعمال کریں
- Vue پرو جیکٹس کے لیے Vue DevTools براؤزر ایکسٹینشن انسٹال کریں
- HTML پراجیکٹس کے لیے VS Code میں Live Server ایکسٹینشن استعمال کریں
- برقراری کے لیے ESLint اور Prettier ایکسٹینشن انسٹال کریں
- JavaScript کی خرابی نکالنے کے لیے براؤزر DevTools استعمال کریں
- Vue پرا
### کارکردگی کے لیے ت وجہ
### کارکردگی کے پہ لو
- بڑی تعداد میں ترجمہ شدہ فائلیں (50+ زبانیں) کلون کو بڑا بناتی ہیں
- صرف مواد پر کام کر رہے ہوں تو shallow clone استعمال کریں: `git clone --depth 1`
- انگلش مواد پر کام کرتے وقت ترجمے کو تلاش سے خارج کریں
- پہلی بار چلانے پر تعمیراتی عمل سست ہو سکتے ہیں (npm install، Vite build)
- ترجمہ شدہ فائلوں کی بڑی تعداد (50+ زبانیں) کی وجہ سے مکمل کلون بڑے ہوتے ہیں
- صرف مواد پر کام کی صورت میں shallow clone استعمال کریں: `git clone --depth 1`
- انگلش مواد پر کام کرتے ہوئے ترجموں کو سرچ سے خارج کریں
- بلڈ پروسیس پہلی بار سست ہو سکتا ہے (npm install، Vite build)
## سیکیورٹی کے امور
## سیکیورٹی کے پہلو
### ماحول کے متغیرات
### ماحول متغیرات
- API کلیدیں کبھی بھی ذخیرہ میں شامل نہ کریں
- `.env` فائلز استعمال کریں (جو پہلے سے `.gitignore` میں ہیں)
- ماحول متغیرات کی ضرورت پروجیکٹ کے README میں دستاویز کریں
- API کیز کبھی بھی ذخیرہ میں شامل نہ کریں
- `.env` فائلوں کا استعمال کریں (جو پہلے سے `.gitignore` میں ہیں)
- پراجیکٹ کی README میں ضروری ماحول متغیرات دستاویزی کریں
### Python پرو جیکٹس
### Python پرا
- ورچوئل ماحول استعمال کریں: `python -m venv venv`
- dependencies کو اپ ٹو ڈیٹ رکھیں
- GitHub کے ٹوکنز کم از کم ضروری اجازتوں کے ساتھ ہوں
- ورچوئل انوائر منٹ ک ا `python -m venv venv`
- انحصار کو اپ ڈیٹ رکھیں
- GitHub ٹوکنز کے لیے کم از کم مطلوبہ اجازتیں رکھیں
### GitHub Models ت ک رسائی
### GitHub Models کی رسائی
- GitHub Models کے لیے Personal Access Tokens (PAT) مطلوب ہیں
- ٹوکنز کو ماحول کے متغیرات کے طور پر محفوظ کریں
- ٹوکنز یا اسناد کو کبھی ذخیرہ میں کمٹ نہ کریں
- شخصی رسائی کے ٹوکنز (PAT) GitHub Models کے لیے ضروری ہیں
- ٹوکنز کو ماحول متغیرات کے طور پر ذخیرہ کریں
- ٹوکنز یا اسناد کبھی بھی شامل نہ کریں
## اضافی نوٹس
### ہدف سامعین
- ویب ڈی ولپمنٹ کے مکمل نو آموز
- طلباء اور خود سیکھنے والے
- کلاس رومز میں نصاب استعمال کرنے والے اساتذہ
- مواد آسان رسائی اور تدریجی مہارت سازی کے لیے ڈیزائن کیا گیا ہے
- ویب ڈوی لپمنٹ کے مکمل نو آموز
- طلبا اور خود سیکھنے والے
- اساتذہ جو نصاب کلاس روم میں استعمال کرتے ہیں
- مواد رسائی اور تدریجی مہارت کی ترقی کے لیے ڈیزائن کیا گیا ہے
### تعلیمی فلسفہ
- پرو جیکٹ پر مبنی سیکھنے کا طریقہ
- کثرت سے علمی چی کز (کوئزز)
- عملی کوڈنگ کی مشقیں
- حقیقی دنیا کی مثالیں
- فریم ورکس سے پہلے بنیادی اصولوں پر توجہ
- پرا
- کثرت سے علم کا ہ
- عملی کوڈنگ مشقیں
- حقیقی دنیا کی درخواست کی مثالیں
- فریم ورکس سے پہلے بنیادی اصولوں پر توجہ
### ذخیرہ کی دیکھ بھال
### ذخیرہ دیکھ بھال
- سیکھنے والوں اور کنٹری بیوٹرز کی فعال کمیونٹی
- dependencies اور مواد کی باقاعدہ اپ ڈیٹس
- مسائل اور مباحثے مینٹینرز کی نگرانی میں
- ترجمہ کی اپ ڈیٹس خودکار طور پر GitHub Actions کے ذریعے
- سیکھنے والوں اور تعاون کرنے والوں کی فعال کمیونٹی
- انحصار اور مواد کی باقاعدہ اپڈیٹس
- ایشوز اور مباحثے مینٹینرز کی نگرانی میں
- ترجمہ اپڈیٹس GitHub Actions کے ذریعے خودکار
### متعلقہ وسائل
- [Microsoft Learn modules](https://docs.microsoft.com/learn/ )
- [Student Hub resources ](https://docs.microsoft.com/learn/student-hub/ )
- [GitHub Copilot ](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot ) سیکھنے والوں کے لیے تجویز کردہ
- اضافی کورسز: Generative AI, Data Science, ML, IoT نصاب دستیاب
- [Microsoft Learn ماڈیولز](https://docs.microsoft.com/learn/ )
- [Student Hub وسائل ](https://docs.microsoft.com/learn/student-hub/ )
- سیکھنے والوں کے لیے [GitHub Copilot ](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot ) کی سفارش کی گئی
- اضافی کورسز: جنریٹو AI، ڈیٹا سائنس، ML، IoT نصاب دستیاب
### مخصوص پرو جیکٹس کے ساتھ کام کرنا
### مخصوص پرا
انفرادی پروجیکٹس کے تفصیلی ہدایات کے لیے متعلقہ README فائلوں کو دیکھیں:
- `quiz-app/README.md` - Vue 3 کوئز ایپلیکیشن
- `7-bank-project/README.md` - بینکنگ ایپلیکیشن جس میں توثیق شامل ہے
- `5-browser-extension/README.md` - براؤزر ایکسٹینشن کی ترقی
- `6-space-game/README.md` - کینوس پر مبنی گیم ترقی
- `9-chat-project/README.md` - AI چیٹ اسسٹنٹ پروجیکٹ
مفصل ہدایات کے لیے ہر پراجیکٹ کے README فائلز دیکھیں:
- `quiz-app/README.md` - Vue 3 کوئز ایپلیکیشن
- `7-bank-project/README.md` - بینکنگ ایپلیکیشن بذریعہ توثیق
- `5-browser-extension/README.md` - براؤزر ایکسٹینشن کی ترقی
- `6-space-game/README.md` - کینوس پر مبنی گیم ڈویلپمنٹ
- `9-chat-project/README.md` - AI چیٹ اسسٹنٹ پراجیکٹ
### مونو ریپوزٹری کا ڈھانچہ
### مونو ریپوز کا ڈھانچہ
اگرچہ یہ روایتی مونو ریپوزٹری نہیں، اس میں متعدد آزاد پروجیکٹس شامل ہیں:
- ہر سبق خود مختار ہے
- پروجیکٹس dependencies شیئر نہیں کرتے
- بغیر ایک دوسرے کو متاثر کیے انفرادی پروجیکٹس پر کام کریں
- مکمل نصاب کے لیے پورے ریپوزٹری کو کلون کریں
اگرچہ یہ روایتی مونو ریپو نہیں ہے، بلکہ اس ذخیرے میں کئی آزاد پراجیکٹس شامل ہیں:
- ہر سبق خود مختار ہے
- پراجیکٹس انحصار شیئر نہیں کرتے
- الگ الگ پراجیکٹس پر بغیر مداخلت کام کریں
- مکمل نصاب کے تجربے کے لیے پورا ریپوزیٹری کلون کریں
---
<!-- CO - OP TRANSLATOR DISCLAIMER START -->
**دستخطی رہنمائی**:
اس دستاویز کا ترجمہ مصنوعی ذہانت کی ترجمہ سہولت [Co-op Translator ](https://github.com/Azure/co-op-translator ) کے ذریعے کیا گیا ہے۔ اگرچہ ہم درستگی کے لیے کوشاں ہیں، براہ کرم یہ بات ذہن میں رکھیں کہ خودکار ترجموں میں غلطیاں یا عدم مطابقت ہو سکتی ہے۔ اصل دستاویز اپنی مایہ ناز زبان میں معتبر ماخذ تصور ک ی جانی چاہیے۔ اہم معلومات کے لیے پیشہ ور انسانی ترجمہ کی سفارش کی جاتی ہے۔ ہم اس ترجمہ
**ڈس کلیمر**:
یہ دستاویز AI ترجمہ سروس [Co-op Translator ](https://github.com/Azure/co-op-translator ) کے ذریعے ترجمہ کی گئی ہے۔ اگرچہ ہم درستگی کی کوشش کرتے ہیں، براہ کرم اس بات کا خیال رکھیں کہ خودکار ترجمے میں غلطیاں یا عدم درستیاں ہو سکتی ہیں۔ اصل دستاویز اپنی مادری زبان میں معتبر ماخذ سمجھ ی جانی چاہیے۔ اہم معلومات کے لیے پیشہ ورانہ انسانی ترجمہ کی سفارش کی جاتی ہے۔ ہم اس ترجمے کے استعمال سے پیدا ہونے والی کسی بھی غلط فہمی یا غلط تعبیر کے ذمہ دار نہیں ہیں۔
<!-- CO - OP TRANSLATOR DISCLAIMER END -->
localizeflow[bot]
3 weeks ago