تعلم البرمجة بأحدث التقنيات
ستتعلم في هذه الدورة كيفية تطوير المواقع من الصفر وحتى الاحتراف
بإستخدام لغة برمجة واحده يمكنك بناء موقع متكامل
تعلم أحدث المكاتب البرمجية في مكان واحد
في هذة الدورة ستتعلم على الواجهات Frontend و أيضا على الخوادم Server باللغة العربية، الهدف من هذه الدورة هو زيادة الوعي البرمجي لدينا نحن العرب، محتوى الدورة تم شرحة في الفيديو التالي
12
فصل
131
درس
1102
دقيقه
ماذا ستتعلم؟
يقدم الدورة رحلة شاملة في عالم تطوير الويب، مصممة للمبتدئين والمطورين ذوي الخبرة على حد سواء. سنبدأ الأمور من خلال تعلم أساسيات البناء: الغمر في HTML لفهم بنية صفحات الويب، ثم التوجه إلى عالم CSS الملون لإحياء تلك الصفحات. مع التقدم، ستكتشف قوة Bootstrap، مما يسهل التصميم الاستجابي.
لكننا لن نتوقف هناك. سيتم الكشف عن الطابع الديناميكي لمحتوى الويب عندما تدخل في JavaScript، حيث ستستكشف كل شيء من الأساسيات إلى البرمجة غير المتزامنة. سيسلط قسم DOM الضوء على التلاعب بعناصر صفحة الويب بسلاسة، معززًا التفاعلات المستخدم.
سنتطرق أيضًا إلى فن النشر، لضمان أن تجد مشاريعك المكان المناسب على الإنترنت. ثم ينتهي الدورة مع مقدمة في Sass، معالج الذي يعزز قدرات الأناقة الخاصة بك.
بحلول نهاية هذه الرحلة، ستكون مجهزًا بفهم عميق لأدوات تطوير الويب هذه وستكون على استعداد لبدء مشاريعك الخاصة. وكإضافة إلى ذلك، ستحصل على رؤى حول إنشاء وإدارة هياكل المشروع بكفاءة.
02
Html
لكل موقع أساسيات، لوضع تلك الأساسيات نحتاج لغة تسمى HTML وهي لغة،
01 | Introduction To Html | free | 01:55 |
02 | File Layout | free | 10:17 |
03 | Headers And Paragraph | free | 06:20 |
04 | Text Formating And Lists | free | 06:24 |
05 | Multimedia | free | 14:12 |
06 | Links | free | 09:48 |
07 | Forms | free | 12:02 |
08 | Tables | free | 06:03 |
09 | Project | 12:37 |
04
Deployment
بعد أن تنتهي من بناء موقعك يجب أن تنشره على الإنترنت ليتمكن الجميع من الوصول إليه
01 | Introduction | free | 01:09 |
02 | Internet | free | 04:20 |
03 | Netlify | 08:17 |
06
Javascript
لغة الجافاسكريبت هي لغة برمجة تساعدنا على إضافة تفاعلية للمواقع، و تستعمل في جميع المواقع الحديثة، والمنصات المختلفة.
01 | Introduction | free | 01:05 |
02 | Install | 01:22 | |
03 | Variables | 07:03 | |
04 | Types | 05:28 | |
05 | Strings | 08:30 | |
06 | Arithmatic Operators | 09:58 | |
07 | Arrays | 07:05 | |
08 | Objects | 07:36 | |
09 | Relational Operators | 07:40 | |
10 | Logical Operators | 05:45 | |
11 | Conditional Statements | 08:51 | |
12 | Loops | 14:45 | |
13 | Functions | 08:37 | |
14 | Functions Return | 08:34 | |
15 | Functions Scopes | 10:58 | |
16 | Project Car Showroom | 14:21 | |
17 | Functions Arrow | 09:45 | |
18 | Functions Higher Order | 09:33 | |
19 | Complex Data | 09:48 | |
20 | Array Methods Foreach | 07:58 | |
21 | Project Coffeeshop Total | 09:23 | |
22 | Array Methods Map | 08:14 | |
23 | Array Methods Filter And Find | 08:18 | |
24 | Destructure | 09:33 | |
25 | Asynchronous Programming | 11:10 | |
26 | Promises | 14:20 | |
27 | Timers | 04:43 | |
28 | Require | 08:06 | |
29 | Project Pokedex | 18:54 | |
30 | Promises Internally | 12:29 | |
31 | Try Catch | 07:10 | |
32 | Spread Rest | 11:15 |
08
Git
طريقة إستخدام نظام الـGit و ربطة بموقع Github
01 | Introduction | free | 02:32 |
02 | Install | free | 05:16 |
03 | Commits | free | 08:53 |
04 | Push and Pull | 08:11 | |
05 | Merge and Conflicts | 05:43 | |
06 | Branches | 09:09 | |
07 | Forks and Pull Requests | 11:17 | |
08 | Collaboration Project | 05:11 |
10
Nextjs Intermediate
مميزات المستوى المتوسط من Nextjs
01 | Frontend vs Backend | free | 04:04 |
02 | أساسيات API | 09:13 | |
03 | Clientside vs Serverside | 09:25 | |
04 | Dynamic Routes | 13:12 | |
05 | تثبيت Backend بسيط | 04:09 | |
06 | Modals | 06:28 | |
07 | Forms باستخدام Formik | 15:05 |
12
Sass
(إختياري) لغة ال SASS هي عبارة عن لغة برمجة تساعدنا على كتابة ال CSS بشكل أسرع و أكثر تنظيماً
01 | Introduction | free | 02:37 |
02 | Install | 05:09 | |
03 | Variables | 03:29 | |
04 | Nesting | 03:21 | |
05 | Partials & Modules | 04:42 | |
06 | Mixins | 04:57 | |
07 | Maps | 02:34 | |
08 | Bootstrap Customizations | 20:24 |
03
Css
المواقع تحتاج إلى لغه تسمى CSS وهي لغه تساعدنا على تنسيق الموقع وجعله جميل ومرتب
01 | Introduction To Css | free | 01:10 |
02 | CSS Linking | free | 09:40 |
03 | Selectors | free | 08:30 |
04 | Specificity | free | 07:57 |
05 | Colors | 09:11 | |
06 | Fonts | 09:16 | |
07 | Margins | 12:16 | |
08 | Chrome Devtools | 06:28 | |
09 | Display | 06:12 | |
10 | Sizing | 04:07 | |
11 | Heights | 05:55 | |
12 | Position | 08:44 | |
13 | Borders | 07:07 | |
14 | Shadows | 05:20 | |
15 | Text Align | 01:53 | |
16 | Flexbox | 11:47 | |
17 | Flexbox Practices | 15:04 | |
18 | Backgrounds | 13:14 | |
19 | State Selector | 06:44 | |
20 | Transitions | 06:26 | |
21 | Animations | 11:17 | |
22 | Media Queries | 08:37 | |
23 | Project Linktree | 24:00 |
05
Tailwind
شرح مكتبة Tailwind المميزه بتوفيرها جميع الكلاسات لتغطية جميع التصاميم
01 | Introduction | free | 01:46 |
02 | Install | free | 02:54 |
03 | Documentation | 03:40 | |
04 | Containers | 05:08 | |
05 | Layout | 10:40 | |
06 | Spacing | 08:28 | |
07 | Colors | 07:42 | |
08 | Typography | 05:55 | |
09 | Sizing | 08:10 | |
10 | Psuedo | 08:36 | |
11 | Animations | 06:15 | |
12 | DaisyUI | 05:30 | |
13 | Project | 15:09 |
07
Dom
لربط الجافاسكريبت مع ال HTML نحتاج إلى ما يسمى DOM وهي أداة تساعدنا على التعامل مع ال HTML
01 | Install | free | 01:48 |
02 | Docoument | free | 06:40 |
03 | Queryselector | 05:13 | |
04 | Html Element | 07:43 | |
05 | Events | 06:21 |
09
Nextjs Fundamentals
فصل تعريفي عن مكتبة Nextjs و أساسياتها
01 | Introduction | free | 02:23 |
02 | NPM | free | 05:38 |
03 | Install | free | 10:33 |
04 | Typescript | 06:47 | |
05 | TSX | 07:28 | |
06 | Import & Export | 08:42 | |
07 | Props | 13:29 | |
08 | Events | 10:41 | |
09 | State Basics | 10:16 | |
10 | State Objects & Arrays | 13:28 | |
11 | Arrow Functions | 14:26 | |
12 | Routing & Links | 10:09 | |
13 | Fetching Data | 11:30 | |
14 | Project: Products | 36:02 |
11
Bootstrap
(إختياري) مكتبة تساعدنا على بناء مواقع سريعة وجميلة ومتجاوبة مع جميع الشاشات
01 | Introduction | free | 05:25 |
02 | Install | 02:55 | |
03 | Documentation | 09:27 | |
04 | Layout | 19:42 | |
05 | Examples | 10:57 | |
06 | Icons | 05:28 | |
07 | Project Linktree | 18:19 |
أهلا انا
مناور
مهندس حاسوب من جامعة الكويت شغفي هو البرمجة بشتى مجالاتها، و التعليم البرمجي ,عملت على العديد من المشاريع اللتي تتعلق ببرمجة المواقع.
قمت بتجربة العديد من اللغات البرمجية منPHP, Java, Javascript, C-Sharpو غيرها الكثير، و ذلك لأنني أحب تجربة الأشياء الجديدة و التعلم منها. من برمجة المواقع والألعاب و التطبيقات
في نهاية المطاف اخترت ال Javascript و مكتبة React للواجهات او ما يسمى ب Frontend و مكتبة AdonisJS للخوادم او ما يسمى Backend
في سلسلة هذه الدروس سأقوم بتعليمك خلاصه اكثر من ١٠ سنوات من البرمجة
المشاريع
الأسئلة الشائعة
ان لم تجد ما تبحث عنه، ارسل لي بريد الكتروني وسأقوم بالرد عليك في أقرب وقت ممكن
ماهي المتطلبات؟
كل الذي عليك هو توفير جهاز كمبيوتر وانترنت
هل يمكنني الحصول على خصم؟
السعر المخصص للدورة تمت دراستة ليكون منخفض ومناسب للجميع، مقارنة بالمحتوى الذي ستحصل عليه
هل أحتاج أن انهي الدورة كاملة لأتمام مشروعي؟
لا، يمكنك إختيار الفصول التي تهمك، فالمحتوى كبير و يغطي الكثير من المواضيع