انتقل إلى المنهج

CT-WP02

معسكر تصميم وبرمجة الواجهة الأمامية لتطبيقات ومواقع الويب

يهدف هذا المعسكر إلى إعداد مصممين ومبرمجين محترفين للواجهة الأمامية لمواقع وتطبيقات الويب، وأن تكون لديهم القدرة على تصميم وبناء تطبيقات ويب ضخمة باستخدام أشهر التقنيات HTML - CSS - JavaScript - ReactJS - BootStrap
المستوى
متقدم
اللغة
عربي
السعر
مجانًا
المواد
7
الدروس
418
المشاهدات
653

عن المعسكر

Front-end web design and development "مصمم ومبرمج الواجهة الأمامية"

هذا ما ستكون عليه بعد دراستك لهذا المعسكر !

يهدف هذا المعسكر إلى إعداد مصممين ومبرمجين محترفين للواجهة الأمامية لمواقع وتطبيقات الويب، وأن تكون لديهم القدرة على تصميم وبناء تطبيقات ويب ضخمة باستخدام أشهر التقنيات HTML - CSS - JavaScript - ReactJS - BootStrap

المسار

مسار تعلّم مرتب

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

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

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

طبّق ما تتعلمه

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

وفي كل مرحلة من مراحل هذا المعسكر سيتم توجيهك خطوة بخطوة بدايةً من دراسة المواد الأساسية وعمل التطبيقات حتى تكتسب الآتي:

  • فهمًا متكاملًا للواجهة الأمامية لمواقع وتطبيقات الويب
  • القدرة على حل المشكلات والعقبات
  • القدرة على تصميم الواجهة الأمامية لمواقع وتطبيقات ويب حقيقية
  • القدرة على برمجة الواجهة الأمامية لمواقع وتطبيقات الويب
  • الخبرة في عمل المشاريع الحقيقية
  • الخبرة في التعاون والعمل ضمن فريق عمل
  • سابقة أعمال احترافية

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

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

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


المحتوى الدراسي

المواد التعليمية التي سيتم دراستها في معسكر تصميم وبرمجة الواجهة الأمامية لتطبيقات ومواقع الويب

Front-End

تصميم وبرمجة الواجهة الأمامية لمواقع وتطبيقات الويب

تكنولوجيا الويب

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

عرض المادة ↗

الأجهزة الافتراضيةVirtual Machine

6 درس

الشبكاتNetwork

28 درس

تطوير الويبWeb Development

5 درس

بروتوكول نقل النص التشعبيHTTP

12 درس

لغة HTML

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

عرض المادة ↗

بناء جملة HTMLHTML Syntax

3 درس

البدءGet Started

2 درس

أساسيات HTMLHTML Basics

4 درس

روابط HTMLHTML Links

4 درس

صور HTMLHTML Images

4 درس

جداول HTMLHTML Tables

4 درس

قوائم HTMLHTML Lists

6 درس

عناصر HTMLHTML Elements

3 درس

نماذج HTMLHTML Forms

12 درس

وسائط HTMLHTML Media

3 درس

HTML متقدمHTML Advanced

3 درس

لغة CSS

تركز مادة CSS على معرفة كيفية التحكم في الألوان والخلفيات وترتيب عناصر HTML على المتصفح بواسطة لغة CSS، فأهم ما يميز هذه اللغة هو تقسيم صفحة الويب إلى أقسام "sections"، وعرض كل section بطريقة منظمة وجذابة؛ مما يؤدي في النهاية إلى تصميم حديث وجذاب لصفحة الويب.
عرض المادة ↗

بنية CSSCSS Syntax

6 درس

نصوص CSSCSS Text

8 درس

تنسيق نصوص CSSCSS Text Decoration

5 درس

خطوط CSSCSS Fonts

5 درس

خلفيات CSSCSS Backgrounds

7 درس

حدود CSSCSS Borders

7 درس

الإطار الخارجي في CSSCSS Outline

6 درس

نموذج الصندوق في CSSCSS Box Model

4 درس

أبعاد CSSCSS Dimensions

7 درس

تموضع العناصر في CSSCSS Position

7 درس

أنماط CSSCSS Style

5 درس

التنقل باستخدام CSSCSS Navigation

3 درس

التخطيط المرن في CSSCSS Flex Box

13 درس

نظام Grid في CSSCSS Grid System

3 درس

أعمدة Grid في CSSCSS Grid Columns

5 درس

صفوف Grid في CSSCSS Grid rows

6 درس

منطقة Grid في CSSCSS Grid Area

2 درس

فجوات Grid في CSSCSS Grid Gaps

3 درس

شبكة CSSCSS Grid

3 درس

CSS المتجاوبCSS Responsive

9 درس

تأثيرات نصوص CSSCSS Text Effects

3 درس

CSS المتقدمCSS Advanced

18 درس

محددات CSSCSS Selectors

2 درس

جافا سكريبت

تركز مادة JavaScript على تعلم كيفية عمل صفحات ويب ديناميكية تتفاعل مع المستخدم، كما يمكن استخدامها لإضافة تأثيرات حية لصفحات الويب مثل: التحقق من البيانات التي يدخلها المستخدم؛ فمن أهم ما يميز لغة JavaScript هو القدرة على استخدامها لبناء صفحات ويب متقدمة ومتعددة الوظائف.
عرض المادة ↗

بنية JavaScriptJavaScript Syntax

5 درس

تخزين البيانات في JavaScriptJavaScript Store Data

4 درس

العوامل في JavaScriptJavaScript Operators

9 درس

مصفوفات JavaScriptJavaScript Arrays

5 درس

كائنات JavaScriptJavaScript Objects

4 درس

تدفق التحكم في JavaScriptJavaScript Control Flow

3 درس

حلقات JavaScriptJavaScript Loops

5 درس

دوال JavaScriptJavaScript Functions

10 درس

أساسيات DOM في JavaScriptJS HTML DOM Basics

9 درس

أحداث JavaScriptJavaScript Events

6 درس

التنقل في JavaScriptJavaScript Navigation

10 درس

BOM المتصفح في JavaScriptJavaScript Browser BOM

12 درس

إصدار ES6 من JavaScriptJavaScript ES6

8 درس

الكائنات المتقدمةOBJECTS Advanced

10 درس

أصناف JavaScriptJavaScript Classes

3 درس

JavaScript غير المتزامنJavaScript Async

4 درس

واجهات Web API في JavaScriptJavaScript Web APIs

7 درس

AJAX في JavaScriptJavaScript AJAX

6 درس

JSON في JavaScriptJS JSON

11 درس

موضوعات أخرىOthers

3 درس

DOM المتقدم في JavaScriptJS HTML DOM Advanced

12 درس

Bootstrap

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

أساسيات BootstrapBootStrap Basics

1 درس

التقسيم في BootstrapBootStrap Division

2 درس

تنسيق النصوص في BootstrapBootStrap Typography

1 درس

CSS الأساسي في BootstrapBS Base CSS

17 درس

JavaScript في BootstrapBS JavaScript

13 درس

ReactJS

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

عرض المادة ↗

التثبيتInstallation

1 درس

Version Control

تركز مادة Git على معرفة كيفية استخدام Git لإدارة إصدارات المشروعات في بيئة عمل متكونة من أشخاص مختلفين يعملون معًا على نفس المشروع، وذلك من خلال تتبع التغييرات وبعد الانتهاء منها يتم دمج تلك التعديلات؛ مما يسهل التعاون على المشاريع البرمجية المشتركة.
عرض المادة ↗

دورة Git التعليميةGit Tutorial

1 درس

دعنا ننير لك الطريق!

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

ماذا ستتعلم

  • ستتعلم كيفية بناء هيكل صفحة الويب باستخدام عناصر HTML المختلفة.
  • ستتعلم كيفية استخدام أنماط وتنسيقات CSS المختلفة لتنسيق وتصميم العناصر على صفحات الويب.
  • ستتعرف على مفاهيم الـResponsive Web Design لتجعل الصفحات تستجيب لأحجام الشاشة المختلفة.
  • ستتعلم كيفية استخدام JavaScript لإضافة وظائف تفاعلية إلى صفحات الويب.
  • ستتعلم كيفية بناء وتطوير واجهات المستخدم الديناميكية باستخدام ReactJS.
  • ستتعلم كيفية استخدام Bootstrap لتسريع عملية تصميم وتنسيق صفحات الويب.
  • ستتعلم كيفية استخدام Git لتتبع التغييرات في الكود، والتعاون مع الآخرين، وإدارة الإصدارات.

المتطلبات

  • الرغبة في التعلم.
  • جهاز computer شخصي.
  • نظام تشغيل، مثل: Macintosh, Linux, Windows.
  • الاتصال بشبكة انترنت قبل الدخول في هذه الدورة.
  • إنهاء معسكر أساسيات علوم الحاسب أو اجتياز اختباراته.

المسمى الوظيفي

  • مطور مواقع الويب
  • مصمم مواقع الويب
  • مطور تطبيقات الويب
  • مصمم تطبيقات الويب
  • مطور مواقع الويب باستخدام React JS
  • مطور الواجهة الأمامية لمواقع وتطبيقات الويب

جاهز تبدأ؟

ابدأ أول درس في المعسكر دلوقتي.

المنهج مرتّب خطوة بخطوة: ابدأ من أول درس متاح وكمّل بالترتيب، وكل مادة بتبني على اللي قبلها.