إنشاء موقع الويب تطوير الواجهة الأمامية - دورة مجانية من مدرسة البرمجة عبر الإنترنت للأطفال Hello World، التدريب 44 ساعة، التاريخ: 3 ديسمبر 2023.
Miscellanea / / December 06, 2023
كيف يعمل الإنترنت
دعونا نتحدث عن المفاهيم الأساسية للإنترنت وبنيتها. دعنا نكتشف ما هو المجال والاستضافة وبنية خادم العميل. لنقم بإعداد بيئة العمل والتحدث عن الركائز الثلاث لتطوير الواجهة الأمامية - HTML وCSS وJavaScript.
لغة البرمجة
هيكل مستند HTML
لنقم بإنشاء صفحات HTML الأولى ونلقي نظرة على أمثلة لصفحات الويب البسيطة والمعقدة. دعونا نتعرف على الكتل التي يجب أن تكون على صفحتنا. لنجعل صفحاتنا مرتبطة ببعضها البعض، ونكتشف كيف يختلف النص عن النص التشعبي وما هي العلامات والسمات.
العمل مع النص
دعونا نتعلم كيفية التعامل مع النص في HTML بشكل صحيح: تقسيمه إلى فقرات، والإشارة إلى العناوين والعناوين الفرعية. دعونا نتعلم كيفية إنشاء قوائم مرقمة ورقمية ونقتبس الكلاسيكيات.
الروابط والصور
فلنتعرف على الروابط بمزيد من التفصيل، ونتعلم أيضًا كيفية إدراج الصور واستخدامها كروابط.
تخطيط الجدول
لنقم بإنشاء جدولنا الأول ومعرفة العلامات التي يتكون منها. دعونا نتعلم كيفية دمج الخلايا وتغيير عدد الصفوف والأعمدة ومحاذاة النص وغير ذلك الكثير. سنتعلم أيضًا النصائح الأساسية من المصمم حول كيفية جعل طاولتك جميلة.
مقدمة إلى النماذج
لنقم بإنشاء النموذج الأول، ونتعلم كيفية التعامل مع حقول الإدخال، والقوائم المنسدلة، ومربعات الاختيار، وبالطبع الأزرار. دعونا ندرس عناصر النموذج الأخرى التي ستكون مفيدة لنا في المستقبل.
CSS
مقدمة إلى CSS
دعونا نتذكر ما هو CSS وكيفية استخدامه. دعونا نتعلم كيفية استخدام CSS عند العمل مع صفحات HTML. دعونا ندرس بناء جملة CSS وما هي المحددات والوراثة والأولوية التي يتم بها تطبيق أنماطنا على مستند HTML.
محددات
دعونا ندرس المحددات بمزيد من التفصيل. دعونا نتعلم كيفية الوصول إلى عنصر واحد أو أكثر، ما هو الفرق بين فئة وفئة زائفة وعنصر من عنصر زائف. دعونا نلقي نظرة على إرشادات CSS ونتعرف على ما يحب الناس طرحه حول CSS في المقابلات.
الميراث والتتالي والأولوية
نتعلم أن التقزم والبهلوانيين ليسا من نفس المجال. دعونا نفهم المبادئ التي يتم من خلالها تطبيق أنماط CSS على عناصر HTML.
زخرفة النص
لنعد إلى حيث بدأنا - إلى النص. دعونا نتعلم كيفية جعل النص جميلًا وسهل الاستخدام باستخدام خصائص CSS: الخط الغامق والمائل والحجم واللون والخلفية وغيرها.
نموذج مستند الكتلة
دعونا نتعلم علامات div وspan، بالإضافة إلى كيفية تعيين أحجام العناصر والحشو والحدود. دعونا نفهم كيفية تشكيل نموذج الكتلة للمستند وما هي الإمكانيات التي لدينا لتحديد موضع العناصر.
جافا سكريبت
تقديم جافا سكريبت
دعونا نتعرف على الركيزة الثالثة لتطوير الواجهة الأمامية - JavaScript. دعونا نتعرف على المتغيرات وأنواع البيانات وسبب الحاجة إليها. وبالطبع سنكتب برنامجنا الأول.
شروط
دعونا نتذكر العمليات المنطقية والمنطقية ومجموعاتها. نرجو أن تكون القوة والسيطرة معنا.
دورات
دعونا نتعلم كيفية القيام بالكثير أثناء كتابة القليل من التعليمات البرمجية. دعونا نفهم أن دورة داخل دورة بسيطة، ولكن عليك أن تكون حذرا.
المصفوفات
هناك كتل جليدية، وغابات، وهناك مصفوفات في البرمجة. وسوف ندرس ما هو مشترك بينهم وكيف يختلفون في هذا الدرس. تلميح - ستساعدنا حلقات الدرس السابق كثيرًا.
المهام
إذا كانت المتغيرات والاسم المناسب لها هو أبجديات البرمجة، فإن القدرة على العمل مع الوظائف واختيار الأسماء المناسبة لها هي بالفعل وصفة. سوف نتعلم كيفية تقسيم البرنامج إلى كتل منطقية وسبب أهمية ذلك في هذا الدرس.
أشياء
سوف نتعرف على مفهوم الأشياء والأساليب ونبدأ في التعرف على مبادئ OOP.
مقدمة إلى DOM
ستكون JavaScript عديمة الفائدة إذا لم تتمكن من التفاعل مع مستند HTML. سوف نتعلم ما هو DOM (نموذج كائن المستند)، ولكن الأهم من ذلك، سوف نتعلم كيفية العمل مع HTML وCSS من خلال JavaScript.
التعامل مع الحدث
سننتقل الآن إلى المستوى التالي ونتعلم كيفية التفاعل مع المستخدم باستخدام JavaScript. سنتعلم أيضًا لماذا يمكن لأحداث JavaScript أن تطفو على السطح ثم تغرق.
HTML5 وCSS3
HTML5: ما الجديد ولماذا؟
دعنا نتعرف على التغييرات التي حدثت في HTML5 ولماذا. دعونا ندرس العناصر الجديدة ونحلل حالات استخدامها الصحيح.
تحديد المواقع العناصر والشبكة
دعونا نلقي نظرة على طرق جديدة لتنظيم الصفحات ووضع العناصر عليها.
نماذج HTML5
دعنا نستكشف الجانب المظلم للقوة ونتدرب على النماذج الجديدة في HTML5، بالإضافة إلى التغييرات التي تم إجراؤها على النماذج القديمة. دعونا نعمل مع أنواع جديدة من الحقول لإدخال التواريخ والألوان والأرقام وكيفية مطالبة المستخدم بجعل حياته أسهل قليلاً.
صوت و فيديو
في هذا البرنامج التعليمي، أنت DJ وكذلك المحرر. لن يكون لدينا الوقت الكافي لإنشاء موقع Youtube الخاص بنا خلال هذا الدرس، ولكننا سنحاول جاهدين إنشاء نموذج أولي يتضمن الوظائف الأساسية.
العمل مع النص في CSS3
دعنا نتعرف على الفرص المتاحة والتوصيات المتعلقة بتنسيق النص في الإصدار الأحدث من المعيار.
تأثيرات الانتقال والتحويل في CSS3
دعونا نتعلم كيفية إنشاء الرسوم المتحركة والتأثيرات المختلفة باستخدام CSS3. دعونا نتعرف على المزالق عند إنشاء مثل هذه التأثيرات.
تخطيط التكيف
دعنا نتعرف على سبب حاجتك إلى التخطيط بشكل تكيفي، ومتى يكون ذلك غير ضروري ويمكن أن يسبب ضررًا. دعونا نلقي نظرة على بناء الجملة الأساسي، وبالطبع، ممارسة التخطيط التكيفي.
شبكة Flexbox وCSS
سوف نتعرف على الأساليب الحديثة لتخطيط الكتل، بالإضافة إلى الصعوبات الموجودة في استخدامها.
معالجات CSS المسبقة: LESS وSASS
هل تريد استخدام المتغيرات في CSS؟ بسهولة! اكتشف الأشياء المثيرة للاهتمام التي يمكنك القيام بها باستخدام معالجات CSS الأولية.
جافا سكريبت على مستوى جديد
إس-2015+
ما هو جافا سكريبت الحديث، "الوضع الصارم" وكيفية التعايش معه جميعًا.
OOP في جافا سكريبت
دعونا ندرس كيفية تنظيم الفئات في جافا سكريبت الحديثة ولماذا يتم استخدامها إذا كان من الممكن القيام بكل شيء باستخدام الوظائف. كيف يعمل الميراث وما هي الطرق الأخرى لإنشاء الفئات الموجودة في JS.
الوظائف بالتفصيل
دعنا نكتشف ما هو تعريف الوظيفة والتعبير الوظيفي، وتعلم كيفية استدعاء دالة بدون اسم. دعونا نلقي نظرة على عبارة "ربط السياق".
أجاكس وJSON
لنأخذ أنفسنا إلى مستوى جديد كمطورين، ونتعلم كيفية تقديم طلبات HTTP، ونتعلم كيف يمكن للخادم والعميل التواصل مع بعضهما البعض وعدم الشجار.
التعبيرات العادية
"إذا كانت لديك مشكلة وتريد حلها باستخدام التعبيرات العادية، فلديك مشكلتان بالفعل." دعونا نتعلم كيفية تجنب إطلاق النار على قدمك باستخدام التعبيرات العادية.
البناة ومشغلو المهام وإدارة التبعية
Bower وnpm وgulp وGrunt وwebpack and co. لا يوجد شيء معقد في هذا الأمر، لكن عليك أن تفهمه.
اختبار في جافا سكريبت
حيث يوجد رمز، هناك دائمًا أخطاء. سوف تتعلم كيفية تقليل عددهم وما هي الممارسات والأدوات التي ستساعدنا في ذلك.
الخوارزميات
سوف نتعلم كيفية كتابة التعليمات البرمجية بحيث لا يواجه المعالج والمتصفح لاحقًا ألمًا مؤلمًا عند تشغيل البرنامج.
ReactJS
مقدمة إلى ReactJS
دعونا نتعرف على ReactJS، ونتعلم كيفية كتابة مكونات بسيطة ومقارنتها مع الأطر الشائعة الأخرى. دعونا نتعرف على مفهوم Virtual DOM.
هندسة وتكوين تطبيقات React
دعونا نتعرف على الإجراءات التي نحتاج إلى تنفيذها ليس فقط للكتابة في React، ولكن أيضًا للقيام بذلك بأكبر قدر ممكن من الكفاءة والراحة.
إنشاء التطبيق الأول في ReactJS
دعونا نلقي نظرة فاحصة على وظيفة JSX وReactComponent وReactDOM.render وRender. نقوم بتكوين التطبيق الأول وتشغيله، وإقامة العلاقات بين المكونات وأحداث العملية.
التوجيه و ReactJS
ما هو التوجيه؟ دعونا نتعرف على ReactRouter ووظائفه؛ نحن ننظم التوجيه في تطبيقنا.