7.9 KiB
کوئز ایپ
یہ کوئزز ڈیٹا سائنس کے نصاب کے لیے لیکچر سے پہلے اور بعد کے کوئزز ہیں، جو یہاں دستیاب ہیں: https://aka.ms/webdev-beginners
ترجمہ شدہ کوئز سیٹ شامل کرنا
کوئز کا ترجمہ شامل کرنے کے لیے، assets/translations
فولڈرز میں مماثل کوئز ڈھانچے بنائیں۔ اصل کوئزز assets/translations/en
میں موجود ہیں۔ کوئزز کو کئی گروپوں میں تقسیم کیا گیا ہے۔ یقینی بنائیں کہ نمبرنگ کو صحیح کوئز سیکشن کے ساتھ ہم آہنگ کریں۔ اس نصاب میں کل 40 کوئزز ہیں، اور گنتی 0 سے شروع ہوتی ہے۔
ترجمہ فائل کی ساخت یہاں ہے:
[
{
"title": "A title",
"complete": "A complete button title",
"error": "An error message upon selecting the wrong answer",
"quizzes": [
{
"id": 1,
"title": "Title",
"quiz": [
{
"questionText": "The question asked",
"answerOptions": [
{
"answerText": "Option 1 title",
"isCorrect": true
},
{
"answerText": "Option 2 title",
"isCorrect": false
}
]
}
]
}
]
}
]
ترجمہ میں ترمیم کرنے کے بعد، ترجمہ فولڈر میں index.js
فائل کو ایڈٹ کریں تاکہ تمام فائلز کو en
میں موجود کنونشنز کے مطابق امپورٹ کریں۔
assets/translations
میں موجود index.js
فائل کو ایڈٹ کریں تاکہ نئی ترجمہ شدہ فائلز کو امپورٹ کریں۔
مثال کے طور پر، اگر آپ کا ترجمہ JSON ex.json
میں ہے، تو 'ex' کو لوکلائزیشن کی کلید بنائیں، پھر اسے نیچے دیے گئے طریقے سے امپورٹ کریں:
index.js
import ex from "./ex.json";
// if 'ex' is localization key then enter it like so in `messages` to expose it
const messages = {
ex: ex[0],
};
export default messages;
کوئز ایپ کو مقامی طور پر چلائیں
ضروریات
- ایک GitHub اکاؤنٹ
- Node.js اور Git
انسٹال اور سیٹ اپ
-
اس ٹیمپلیٹ سے ایک ریپوزٹری بنائیں۔
-
اپنی نئی ریپوزٹری کو کلون کریں، اور کوئز ایپ پر جائیں:
git clone https://github.com/your-github-organization/repo-name cd repo-name/quiz-app
-
npm پیکجز اور ڈیپینڈنسیز انسٹال کریں:
npm install
ایپ بنائیں
-
حل کو بنانے کے لیے، یہ کمانڈ چلائیں:
npm run build
ایپ شروع کریں
-
حل کو چلانے کے لیے، یہ کمانڈ چلائیں:
npm run dev
[اختیاری] کوڈ کی جانچ
-
کوڈ کو جانچنے کے لیے، یہ کمانڈ چلائیں:
npm run lint
کوئز ایپ کو Azure پر ڈیپلائے کریں
ضروریات
-
ایک Azure سبسکرپشن۔ مفت سبسکرپشن کے لیے یہاں سائن اپ کریں۔
اس کوئز ایپ کو ڈیپلائے کرنے کی تخمینی لاگت: مفت
Azure پر اوپر دیے گئے لنک کے ذریعے سائن ان کرنے کے بعد، ایک سبسکرپشن اور ریسورس گروپ منتخب کریں، پھر:
-
Static Web App کی تفصیلات: ایک نام فراہم کریں اور ہوسٹنگ پلان منتخب کریں۔
-
GitHub لاگ ان: اپنی ڈیپلائے سورس کو GitHub پر سیٹ کریں، پھر لاگ ان کریں اور فارم میں مطلوبہ فیلڈز کو پُر کریں:
- Organization – اپنی تنظیم منتخب کریں۔
- Repository – Web Dev for Beginners نصاب کی ریپوزٹری منتخب کریں۔
- Branch - ایک برانچ منتخب کریں (main)
-
Build Presets: Azure Static Web Apps ایک ڈیٹیکشن الگورتھم استعمال کرتا ہے تاکہ آپ کی ایپلیکیشن میں استعمال ہونے والے فریم ورک کا پتہ لگا سکے۔
- App location - ./quiz-app
- Api location -
- Output location - dist
-
Deployment: 'Review + Create' پر کلک کریں، پھر 'Create' پر کلک کریں۔
ایک بار ڈیپلائے ہونے کے بعد، ایک ورک فلو فائل آپ کی ریپوزٹری کے .github ڈائریکٹری میں بنائی جائے گی۔ یہ ورک فلو فائل ان ایونٹس کی ہدایات پر مشتمل ہوتی ہے جو ایپ کو Azure پر دوبارہ ڈیپلائے کرنے کو ٹرگر کرتے ہیں، جیسے برانچ main پر push وغیرہ۔
ورک فلو فائل کی مثال
یہاں ایک مثال ہے کہ GitHub Actions ورک فلو فائل کیسا دکھائی دے سکتا ہے: name: Azure Static Web Apps CI/CDon: push: branches: - main pull_request: types: [opened, synchronize, reopened, closed] branches: - main jobs: build_and_deploy_job: runs-on: ubuntu-latest name: Build and Deploy Job steps: - uses: actions/checkout@v2 - name: Build And Deploy id: builddeploy uses: Azure/static-web-apps-deploy@v1 with: azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }} repo_token: ${{ secrets.GITHUB_TOKEN }} action: "upload" app_location: "quiz-app" # App source code path api_location: ""API source code path optional output_location: "dist" #Built app content directory - optional
-
ڈیپلائے کے بعد: ڈیپلائے مکمل ہونے کے بعد، 'Go to Deployment' پر کلک کریں، پھر 'View app in browser' پر کلک کریں۔
جب آپ کا GitHub Action (ورک فلو) کامیابی سے مکمل ہو جائے، تو لائیو صفحہ کو ریفریش کریں تاکہ اپنی ایپلیکیشن دیکھ سکیں۔
ڈسکلیمر:
یہ دستاویز AI ترجمہ سروس Co-op Translator کا استعمال کرتے ہوئے ترجمہ کی گئی ہے۔ ہم درستگی کے لیے کوشش کرتے ہیں، لیکن براہ کرم آگاہ رہیں کہ خودکار ترجمے میں غلطیاں یا غیر درستیاں ہو سکتی ہیں۔ اصل دستاویز کو اس کی اصل زبان میں مستند ذریعہ سمجھا جانا چاہیے۔ اہم معلومات کے لیے، پیشہ ور انسانی ترجمہ کی سفارش کی جاتی ہے۔ ہم اس ترجمے کے استعمال سے پیدا ہونے والی کسی بھی غلط فہمی یا غلط تشریح کے ذمہ دار نہیں ہیں۔