Web-Dev-For-Beginners/translations/ar

تطوير الويب للمبتدئين - منهج دراسي

تعلم أساسيات تطوير الويب مع دورتنا الشاملة التي تستمر 12 أسبوعًا من خلال Microsoft Cloud Advocates. كل من الدروس الـ24 تغوص في JavaScript وCSS وHTML من خلال مشاريع تطبيقية مثل التيراريوم، إضافات المتصفح، وألعاب الفضاء. شارك في الاختبارات والمناقشات والمهام العملية. عزز مهاراتك وحسن من احتفاظك بالمعلومات من خلال منهجنا الفعّال المبني على المشاريع. ابدأ رحلة الترميز الخاصة بك اليوم!

انضم إلى مجتمع Azure AI Foundry على Discord

اتبع هذه الخطوات للبدء باستخدام هذه الموارد:

1. افتح نسخة من المستودع: انقر على
2. انسخ المستودع محليًا: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
3. انضم إلى Azure AI Foundry Discord وقابل الخبراء والمطورين الآخرين

🌐 دعم متعدد اللغات

مدعوم عبر GitHub Action (مؤتمت وجديد دائمًا)

العربية | البنغالية | البلغارية | البورمية (ميانمار) | الصينية (المبسط) | الصينية (التقليدية، هونغ كونغ) | الصينية (التقليدية، ماكاو) | الصينية (التقليدية، تايوان) | الكرواتية | التشيكية | الدنماركية | الهولندية | الإستونية | الفنلندية | الفرنسية | الألمانية | اليونانية | العبرية | الهندية | الهنغارية | الإندونيسية | الإيطالية | اليابانية | الكنادا | الكورية | الليتوانية | الماليزية | المالايالامية | الماراثية | النيبالية | النيجيرية بيدجن | النرويجية | الفارسية (اللغة الفارسية) | البولندية | البرتغالية (البرازيل) | البرتغالية (البرتغال) | البنجابية (الغورمكي) | الرومانية | الروسية | الصربية (السيريلية) | السلوفاكية | السلوفينية | الإسبانية | السواحيلية | السويدية | التاغالوغ (الفلبينية) | التاميلية | التيلوغو | التايلاندية | التركية | الأوكرانية | الأردية | الفيتنامية

تفضل النسخ المحلي؟

يتضمن هذا المستودع أكثر من 50 ترجمة لغوية مما يزيد بشكل ملحوظ من حجم التنزيل. للنسخ بدون الترجمات، استخدم sparse checkout:

git clone --filter=blob:none --sparse https://github.com/microsoft/Web-Dev-For-Beginners.git
cd Web-Dev-For-Beginners
git sparse-checkout set --no-cone '/*' '!translations' '!translated_images'

هذا يمنحك كل ما تحتاجه لإكمال الدورة مع تحميل أسرع بكثير.

إذا كنت ترغب في دعم لغات ترجمة إضافية فهي مذكورة هنا

🧑‍🎓 هل أنت طالب؟

زر صفحة مركز الطلاب حيث ستجد موارد للمبتدئين، وحزم طلابية وطرق للحصول على قسيمة شهادة مجانية. هذه هي الصفحة التي تود حفظها والاطلاع عليها من وقت لآخر حيث نقوم بتغيير المحتوى شهريًا.

📣 إعلان - تحديات جديدة لوضع GitHub Copilot Agent لتكملها!

تمت إضافة تحدي جديد، ابحث عن "تحدي GitHub Copilot Agent 🚀" في معظم الفصول. هذا تحدي جديد لك لإكماله باستخدام GitHub Copilot ووضع العميل Agent mode. إذا لم تستخدم وضع العميل سابقًا فهو قادر ليس فقط على توليد النصوص بل يمكنه أيضًا إنشاء وتعديل الملفات، تنفيذ الأوامر وأكثر.

📣 إعلان - مشروع جديد للبناء باستخدام الذكاء الاصطناعي التوليدي

تمت إضافة مشروع مساعد AI جديد، تحقق منه المشروع

📣 إعلان - منهج دراسي جديد حول الذكاء الاصطناعي التوليدي لـ JavaScript صدر للتو

لا تفوت منهج الذكاء الاصطناعي التوليدي الجديد لدينا!

زر https://aka.ms/genai-js-course للبدء!

• دروس تغطي كل شيء من الأساسيات إلى RAG.
• تفاعل مع شخصيات تاريخية باستخدام GenAI وتطبيقنا المرافق.
• سرد ممتع وجذاب، ستسافر عبر الزمن!

كل درس يتضمن مهمة لإنجازها، اختبار معرفة وتحدي يرشدك في تعلم مواضيع مثل:

• الكتابة البرمجية والهندسة البرمجية للتعليمات
• توليد تطبيقات نص وصورة
• تطبيقات البحث

زر https://aka.ms/genai-js-course للبدء!

🌱 بدء الاستخدام

أيها المعلمون، لقد تضمننا بعض الاقتراحات حول كيفية استخدام هذا المنهج. نود أن نحصل على ملاحظاتكم في منتدى النقاش الخاص بنا!

المتعلمون، لكل درس، ابدأ باختبار قبل المحاضرة وتابع قراءة مادة المحاضرة، إكمال الأنشطة المختلفة وتحقق من فهمك مع اختبار بعد المحاضرة.

لتعزيز تجربة تعلمك، تواصل مع زملائك للعمل على المشاريع معًا! التشجيع على النقاش موجود في منتدى النقاش حيث سيكون فريق المشرفين متاحًا للإجابة على أسئلتكم.

لتعزيز تعليمك، نوصي بشدة باستكشاف Microsoft Learn لمواد دراسية إضافية.

📋 إعداد البيئة الخاصة بك

هذا المنهج يحتوي على بيئة تطوير جاهزة للاستخدام! عند البدء يمكنك اختيار تشغيل المنهج في Codespace (بيئة تعتمد على المتصفح، لا حاجة للتثبيت)، أو محليًا على جهاز الكمبيوتر باستخدام محرر نصوص مثل Visual Studio Code.

أنشئ مستودعك الخاص

لكي تحفظ عملك بسهولة، يُنصح بإنشاء نسخة خاصة بك من هذا المستودع. يمكنك فعل ذلك بالضغط على زر استخدام هذا القالب أعلى الصفحة. سيؤدي ذلك إلى إنشاء مستودع جديد في حساب GitHub الخاص بك بنسخة من المنهج.

اتبع هذه الخطوات:

1. افتح نسخة من المستودع: انقر على زر "Fork" في الزاوية العليا اليمنى من هذه الصفحة.
2. انسخ المستودع محليًا: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git

تشغيل المنهج في Codespace

في نسختك من هذا المستودع التي أنشأتها، انقر على زر Code واختر Open with Codespaces. سيؤدي هذا إلى إنشاء Codespace جديد للعمل فيه.

تشغيل المنهج محليًا على جهاز الكمبيوتر الخاص بك

لتشغيل هذا المنهج محليًا على جهاز الكمبيوتر الخاص بك، ستحتاج إلى محرر نصوص، متصفح، وأداة سطر أوامر. سيأخذك درسنا الأول، مقدمة عن لغات البرمجة وأدوات العمل، عبر الخيارات المختلفة لكل من هذه الأدوات لاختيار الأنسب لك.

توصيتنا هي استخدام محرر Visual Studio Code، الذي يحتوي أيضًا على محطة طرفية. يمكنك تنزيل Visual Studio Code من هنا.

1. انسخ مستودعك إلى جهاز الكمبيوتر. يمكنك فعل ذلك بالضغط على زر Code ونسخ عنوان URL:

   CodeSpace ثم افتح الطرفية داخل Visual Studio Code وقم بتشغيل الأمر التالي، مع استبدال <your-repository-url> بالرابط الذي نسخته للتو:

   git clone <your-repository-url>
   

2. افتح المجلد في Visual Studio Code. يمكنك القيام بذلك بالنقر على ملف > فتح مجلد واختيار المجلد الذي قمت باستنساخه للتو.

الإضافات الموصى بها لـ Visual Studio Code:

• Live Server - لمعاينة صفحات HTML داخل Visual Studio Code
• Copilot - لمساعدتك على كتابة الشفرة بسرعة أكبر

📂 تتضمن كل درس:

• ملاحظة تخطيطية اختيارية
• فيديو تكميلي اختياري
• اختبار تسخين قبل الدرس
• درس مكتوب
• للدروس المعتمدة على المشاريع، دلائل خطوة بخطوة حول كيفية بناء المشروع
• تحقق من المعرفة
• تحدي
• قراءة تكميليّة
• واجب
• اختبار بعد الدرس

ملاحظة حول الاختبارات: تحتوي كل الاختبارات على 48 اختبارًا إجماليًا، كل اختبار يتضمن ثلاثة أسئلة. وهي متوفرة هنا ويمكن تشغيل تطبيق الاختبار محلياً أو نشره على Azure؛ اتبع التعليمات في مجلد quiz-app.

🗃️ الدروس

	اسم المشروع	المفاهيم التي تُدرس	الأهداف التعليمية	الدرس المرتبط	المؤلف
01	البدء	مقدمة في البرمجة وأدوات العمل	تعلم الأسس الأساسية لمعظم لغات البرمجة حول البرمجة وأدوات البرمجيات التي تساعد المطورين المحترفين في أداء عملهم	مقدمة في لغات البرمجة وأدوات العمل	Jasmine
02	البدء	أساسيات GitHub، يشمل العمل مع فريق	كيفية استخدام GitHub في مشروعك، وكيفية التعاون مع الآخرين على قاعدة الشفرة	مقدمة في GitHub	Floor
03	البدء	إمكانية الوصول	تعلم أساسيات إمكانية الوصول على الويب	أساسيات إمكانية الوصول	Christopher
04	أساسيات JS	أنواع بيانات جافاسكريبت	أساسيات أنواع بيانات جافاسكريبت	أنواع البيانات	Jasmine
05	أساسيات JS	الدوال والطرق	التعرف على الدوال والطرق لإدارة منطق التطبيق	الدوال والطرق	Jasmine و Christopher
06	أساسيات JS	اتخاذ القرارات بلغة JS	تعلم كيفية إنشاء شروط في الشفرة باستخدام طرق اتخاذ القرار	اتخاذ القرارات	Jasmine
07	أساسيات JS	المصفوفات والحلقات	العمل مع البيانات باستخدام المصفوفات والحلقات في جافاسكريبت	المصفوفات والحلقات	Jasmine
08	Terrarium	HTML في التطبيق	بناء HTML لإنشاء تيراريوم عبر الإنترنت، مع التركيز على بناء التخطيط	مقدمة في HTML	Jen
09	Terrarium	CSS في التطبيق	بناء CSS لتصميم التيراريوم عبر الإنترنت، مع التركيز على أساسيات CSS بما في ذلك جعل الصفحة متجاوبة	مقدمة في CSS	Jen
10	Terrarium	إغلاق جافاسكريبت، التلاعب بـ DOM	بناء جافاسكريبت لجعل التيراريوم يعمل كواجهة سحب وإفلات، مع التركيز على الإغلاق والتلاعب بـ DOM	إغلاق جافاسكريبت، التلاعب بـ DOM	Jen
11	لعبة الطباعة	بناء لعبة طباعة	تعلم كيفية استخدام أحداث لوحة المفاتيح لتحريك منطق تطبيق جافاسكريبت	البرمجة القائمة على الأحداث	Christopher
12	ملحق المتصفح الأخضر	العمل مع المتصفحات	تعلم كيف تعمل المتصفحات وتاريخها، وكيفية إعداد أول عناصر امتداد المتصفح	حول المتصفحات	Jen
13	ملحق المتصفح الأخضر	بناء نموذج، استدعاء API وتخزين المتغيرات في التخزين المحلي	بناء عناصر جافاسكريبت لملحق المتصفح الخاص بك لاستدعاء API باستخدام المتغيرات المخزنة في التخزين المحلي	APIs، النماذج والتخزين المحلي	Jen
14	ملحق المتصفح الأخضر	العمليات الخلفية في المتصفح، أداء الويب	استخدام العمليات الخلفية للمتصفح لإدارة أيقونة الامتداد؛ تعلم حول أداء الويب وبعض التحسينات لجعله أفضل	المهام الخلفية والأداء	Jen
15	لعبة الفضاء	تطوير ألعاب أكثر تقدماً بلغة جافاسكريبت	تعلم حول الوراثة باستخدام الفئات والتركيب ونمط النشر والاشتراك، استعدادًا لبناء لعبة	مقدمة في تطوير الألعاب المتقدمة	Chris
16	لعبة الفضاء	الرسم على اللوحة	تعلم حول Canvas API، المستخدم لرسم العناصر على الشاشة	الرسم على اللوحة	Chris
17	لعبة الفضاء	تحريك العناصر على الشاشة	اكتشف كيف يمكن للعناصر أن تكتسب حركة باستخدام الإحداثيات الديكارتية وCanvas API	تحريك العناصر حول الشاشة	Chris
18	لعبة الفضاء	اكتشاف التصادم	جعل العناصر تصطدم وتتفاعل مع بعضها باستخدام ضغطات المفاتيح وتوفير وظيفة تبريد لضمان أداء اللعبة	اكتشاف التصادم	Chris
19	لعبة الفضاء	تسجيل النقاط	إجراء عمليات حسابية بناءً على حالة وأداء اللعبة	تسجيل النقاط	Chris
20	لعبة الفضاء	إنهاء اللعبة وإعادة تشغيلها	تعلم حول إنهاء اللعبة وإعادة تشغيلها، بما في ذلك تنظيف الأصول وإعادة تعيين قيم المتغيرات	شرط النهاية	Chris
21	تطبيق بنكي	قوالب HTML والمسارات في تطبيق ويب	تعلم كيفية إنشاء الهيكل الأساسي لموقع متعدد الصفحات باستخدام التوجيه وقوالب HTML	قوالب HTML والمسارات	Yohan
22	تطبيق بنكي	بناء نموذج تسجيل دخول وتسجيل	تعلم بناء النماذج ومعالجة قواعد التحقق	النماذج	Yohan
23	تطبيق بنكي	طرق جلب واستخدام البيانات	كيف تتدفق البيانات داخل وخارج تطبيقك، وكيفية جلبها وتخزينها والتخلص منها	البيانات	Yohan
24	تطبيق بنكي	مفاهيم إدارة الحالة	تعرف على كيفية احتفاظ تطبيقك بالحالة وكيفية إدارتها برمجياً	إدارة الحالة	Yohan
25	الكود المتصفح / VScode	العمل مع VScode	تعلم كيفية استخدام محرر الأكواد	استخدام محرر كود VScode	Chris
26	مساعدات الذكاء الاصطناعي	العمل مع الذكاء الاصطناعي	تعلم كيفية بناء مساعد ذكاء اصطناعي خاص بك	مشروع مساعد الذكاء الاصطناعي	Chris

🏫 المنهجية التعليمية

تم تصميم منهجنا باثنين من المبادئ التربوية الرئيسية في الاعتبار:

• التعلم القائم على المشاريع
• الاختبارات المتكررة

البرنامج يعلم أساسيات جافاسكريبت وHTML وCSS، بالإضافة إلى أحدث الأدوات والتقنيات التي يستخدمها مطورو الويب اليوم. سيحصل الطلاب على فرصة لتطوير خبرة عملية من خلال بناء لعبة طباعة، وتيراريوم افتراضي، وامتداد متصفح صديق للبيئة، ولعبة بأسلوب غزو الفضاء، وتطبيق بنكي للأعمال التجارية. بنهاية السلسلة، سيكون لدى الطلاب فهم قوي لتنمية الويب.

🎓 يمكنك أخذ الدروس القليلة الأولى في هذا المنهج كـ مسار تعلم على Microsoft Learn!

بضمان توافق المحتوى مع المشاريع، يصبح التعلم أكثر جاذبية للطلاب ويتم تعزيز الاحتفاظ بالمفاهيم. كتبنا أيضًا عدة دروس تمهيدية بأساسيات جافاسكريبت لتقديم المفاهيم، مرفقة بفيديو من سلسلة "سلسلة المبتدئين إلى: جافاسكريبت" من مقاطع الفيديو التعليمية، التي ساهم بعض مؤلفيها في هذا المنهج.

بالإضافة إلى ذلك، يحدد اختبار منخفض المخاطر قبل الصف نية الطالب نحو تعلم موضوع ما، بينما يضمن اختبار ثانٍ بعد الصف مزيدًا من الاحتفاظ. تم تصميم هذا المنهج ليكون مرنًا وممتعًا ويمكن أخذه ككل أو جزء منه. تبدأ المشاريع صغيرة وتزداد تعقيدًا مع اقتراب نهاية دورة الـ 12 أسبوعًا.

بينما تجنبنا عمدًا إدخال أُطُر جافاسكريبت للتركيز على المهارات الأساسية اللازمة كمطور ويب قبل اعتماد إطار عمل، فإن الخطوة التالية الجيدة لاستكمال هذا المنهج ستكون تعلم Node.js عبر مجموعة أخرى من الفيديوهات: "سلسلة المبتدئين إلى: Node.js".

قم بزيارة مدونة السلوك وإرشادات المساهمة. نرحب بملاحظاتك البناءة!

🧭 الوصول دون اتصال

يمكنك تشغيل هذه الوثائق دون اتصال باستخدام Docsify. قم بفورك لهذا المستودع، ثبت Docsify على جهازك المحلي، ثم في المجلد الجذر لهذا المستودع، اكتب docsify serve. سيتم تقديم الموقع على المنفذ 3000 على المضيف المحلي الخاص بك: localhost:3000.

📘 ملف PDF

يمكن العثور على ملف PDF لجميع الدروس هنا.

🎒 دورات أخرى

فريقنا ينتج دورات أخرى! اطلع على:

LangChain

Azure / Edge / MCP / وكلاء

---

سلسلة الذكاء الاصطناعي التوليدي

---

التعلم الأساسي

---

سلسلة Copilot

الحصول على المساعدة

إذا علقت أو كان لديك أي أسئلة حول بناء تطبيقات الذكاء الاصطناعي. انضم إلى المتعلمين الآخرين والمطورين ذوي الخبرة في مناقشات حول MCP. إنها مجتمع داعم حيث تُرحب بالأسئلة ويُشارك المعرفة بحرية.

إذا كان لديك ملاحظات على المنتج أو أخطاء أثناء البناء، قم بزيارة:

الترخيص

هذا المستودع مرخص بموجب ترخيص MIT. انظر ملف LICENSE لمزيد من المعلومات.

---

تنويه: تمت ترجمة هذا المستند باستخدام خدمة الترجمة الآلية Co-op Translator. بينما نسعى لضمان الدقة، يرجى العلم أن الترجمات الآلية قد تحتوي على أخطاء أو عدم دقة. يجب اعتبار المستند الأصلي بلغته الأصلية هو المصدر الموثوق. للمعلومات الحيوية، ينصح بالترجمة المهنية البشرية. نحن غير مسؤولين عن أي سوء فهم أو تفسيرات خاطئة قد تنتج عن استخدام هذه الترجمة.