01
de-b01MasarUX Proمبتدئ
أسس الويب لمهندسي التصميم
ابنِ إلمام التنفيذ الذي يحتاجه المصمم للعمل داخل الكود: الترميز الدلالي وبنية الصفحة، وأنظمة التنسيق من تخطيط وقواعد استجابة ورموز تصميمية في الكود، وسلوك المكوّنات وحالتها، وسير عمل git والفروق وطلبات السحب الذي يحمل التغيير عبر المراجعة حتى الإصدار.
المدة التقريبية: ١٨ ساعةعدد المستويات: ٣ · عدد الدروس: ٣٠
02
03
بنهاية هذا Course، تستطيع قراءة ملف واجهة أمامية غير مألوف، وكتابة ترميز وتنسيقات دلالية ومستجيبة تطابق التصميم، وتعديل سلوك مكوّن، واقتراح التغيير بوصفه طلب سحب قابلًا للمراجعة ومدعومًا بالدليل.
01اختيار عناصر HTML بناءً على ما يضمنه كل عنصر فعليًا — الدور والاسم القابل للوصول وقابلية التركيز والتفعيل المدمج — لا بناءً على العادة
02بناء مستند بمعالم بنيوية ومخطط عناوين صحيح وترتيب DOM يطابق ترتيب القراءة الذي يعيشه المستخدم
03كتابة النماذج والجداول والوسائط والروابط بحيث يبقى معناها قائمًا عند قراءتها دون التصميم البصري
04تنفيذ التخطيط بـ CSS الحديثة — التدفق الطبيعي و flexbox و grid والقياس الواعي بالمحتوى — بدل مواضع ثابتة منسوخة من لوحة التصميم
05التعبير عن المسافات والألوان والخطوط ونصف القطر كرموز تصميمية في الكود كي يتغير قرار التصميم في مكان واحد بالضبط
06قراءة خصائص المكوّن وحالته ومعالجة أحداثه وكتابتها بما يكفي لتعديل مكوّن حقيقي دون كسره
07استخدام فروع git والفروق وطلبات السحب لاقتراح تغيير وقراءة مراجعته وتنقيحه بشكل قابل للدفاع
08تدقيق ترميزك وتنسيقاتك قبل المراجعة وذكر ما يثبته فحصك وما لا يثبته بصدق
04
المنهج
عدد المستويات: ٣ · عدد الدروس: ٣٠التقييم
قد يتضمن كل درس اختبارًا قصيرًا
قد يتضمن كل مستوى امتحانًا
متطلبات الإتمام
أكمل الدروس المتاحة
اجتز كل الاختبارات والامتحانات المضبوطة
لا تُفتح الأنشطة المقفلة قبل استيفاء متطلباتها
05
مهارات الدورة8 مهارات دورة
Accessible Markup Structure
Component State and Props
CSS Layout Implementation
Design Token Implementation
Frontend Change Review
Git and Pull Request Workflow
Responsive Styling in Code
Semantic HTML Authoring
مجالات الكفاءة ذات الصلة
النماذج عالية الدقة والنمذجة الأولية
06
صلة الدورة بالمسار المهني
يُحتسب تقدّم الدورة المكتملة تلقائيًا ضمن المسار المهني عندما تنتمي الدورة إلى مهمة.
07
ما ستكتسبه
- يحوّل «أستطيع قراءة الكود» إلى «أستطيع تغيير الكود والدفاع عن التغيير أمام مهندس»
- يعلّم تنفيذ إمكانية الوصول وحالات التفاعل والقرارات البصرية بدل إعادة تدريس نظريتها
- يقرن كل أسلوب بالدليل الذي يثبت نجاحه وبالحد الذي لا يغطيه
- يستخدم أمثلة كود عملية وتقييمات قائمة على سيناريوهات مأخوذة من قرارات هندسة تصميم حقيقية
لمن هذه الدورة؟
- مصممو تجربة المستخدم والمنتج الذين يستطيعون قراءة الكود لكنهم لا يعدّون أنفسهم مهندسين
- المصممون الذين يسلّمون اليوم ملفات ثابتة ويريدون تنفيذ تغيير الواجهة الأمامية بأنفسهم
- المساهمون في أنظمة التصميم الذين يجب أن يقرؤوا ترميز المكوّنات وتنسيقاتها ويراجعوها ويعدّلوها
- كل من يبدأ مسار مهندس التصميم ويحتاج إلى مفردات تنفيذ مشتركة قبل الدورات اللاحقة
مميزات الدورة
- 3 مستويات متدرجة و30 درسًا ثنائي اللغة
- أمثلة كود عملية غير مترجمة في كل درس كثيف التنفيذ
- 30 Quiz للدروس تضم 10 أسئلة سيناريو لكل منها
- 3 Exam للمستويات تضم 15 سؤال نقل تعلم لكل منها
08
شهادة إتمام الدورة
تُمنح بعد استيفاء متطلبات الإتمام المضبوطة لهذه الدورة.