30 KiB

Raw Blame History

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

قم بعمل Fork للمستودع: انقر على
استنسخ المستودع: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
انضم إلى Discord الخاص بـ Azure AI Foundry وتواصل مع الخبراء والمطورين الآخرين

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

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

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

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

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

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

قم بزيارة https://aka.ms/genai-js-course للبدء!

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

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

التوجيه وهندسة التوجيه
إنشاء تطبيقات نصوص وصور
تطبيقات البحث

قم بزيارة https://aka.ms/genai-js-course للبدء!

🌱 البدء

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

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

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

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

📋 إعداد بيئتك

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

إنشاء مستودعك الخاص

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

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

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

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

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

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

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

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

استنسخ مستودعك إلى جهاز الكمبيوتر الخاص بك. يمكنك القيام بذلك بالنقر على زر Code ونسخ الرابط:

ثم افتح Terminal داخل Visual Studio Code وقم بتشغيل الأمر التالي، مع استبدال <your-repository-url> بالرابط الذي نسخته للتو:
```
git clone <your-repository-url>
```
افتح المجلد في Visual Studio Code. يمكنك القيام بذلك بالنقر على File > Open Folder وتحديد المجلد الذي قمت باستنساخه للتو.

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

Live Server - لمعاينة صفحات HTML داخل Visual Studio Code

Copilot - لمساعدتك على كتابة الكود بشكل أسرع

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

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

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

🗃️ الدروس

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

🏫 التعليم

تم تصميم منهجنا بناءً على مبدأين تربويين رئيسيين:

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

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

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

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

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

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

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

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

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

📘 PDF

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

🎒 دورات أخرى

فريقنا ينتج دورات أخرى! تحقق من:

الترخيص

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

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

30 KiB Raw Blame History