دورة تدريبية لتعليم الأطفال البرمجة باستخدام HTML5 - CSS - JavaScript
مرحبًا أصدقائي! هل تحلم بأن تصبح مطور ويب رائعًا يبني مواقع ويب ممتعة وملونة؟ إذا كنت تحب أن تكون مبداعًا، فهذه الدورة التدريبية تناسبك! في "Web Adventure Magic"، ستتعلم كيفية استخدام HTML5 وCSS و JavaScript لإنشاء صفحات ويب تفاعلية ومثيرة.
HTML : مثل أساس المنزل، سيساعدك HTML5 في وضع النصوص والصور والألعاب على صفحة الويب الخاصة بك.
CSS: مثل الساحر الذي يضيف الألوان والأشكال، سيساعدك CSS في جعل صفحتك تبدو جميلة وممتعة بألوان زاهية وتصميمات رائعة.
JavaScript: مثل عقل الصفحة، سيعلمك JavaScript كيفية تحريك الصفحة والتفاعل معك، مثل الألعاب أو الأزرار التي تعمل عند النقر عليها.
سنلعب بألعاب ومشاريع ممتعة، مثل تصميم صفحة لألعابك المفضلة أو صفحة عن نفسك! وفي النهاية، ستتمكن من إنشاء موقع الويب الخاص بك وتكون مستعدًا لتصبح بطلًا خارقًا في البرمجة. فلنبدأ المغامرة!
Course Outline:
Track 1: HTML and CSS in depth
1- HTML
- Introduction to the Program
- Introduction to HTML and CSS in depth
- How are HTML and CSS used in the real world?
2- Semantic HTML
- Semantic HTML
- Semantic tags and why we need them
- Semantic tags in action
3- Metadata
- Metadata
- UX with meta tags
- Setting up a social media card
- Social media cards
4- Layout design
- Layout design
- Bare bones layout
5- Forms
- Forms and validation
- Creating a form
- Create and test a form (solution)
- Create a complex form (solution)
- Making the most of client-side validation
- Input types
- Radio buttons
- Using interactive form elements
- Interactive form elements
- Form submission
- Submit
- Glossary: HTML form elements
6- Multimedia
- Images
- Video and audio
- Embedded players
- iFrames
- iFrame as a picture
- iFrame sandbox
- Rate the media (solution)
- The canvas element
7- Tools
- Visual Studio Code on Coursera
- Browser differences
- Additional resources
8- assignments
Track 2 CSS Course Components
1- Introduction and Web Layout
- CSS web layout
- Case study: How Meta creates responsive builds
2 -Flexbox
- Basic flexbox
- Flex charts
- Understanding flexbox
3- CSS Grids
- CSS grids
- Grid showcase
- Grid template area
- Create a grid layout (solution)
- Grids and flexbox cheat sheet
4- Selectors
- Selectors
- Widely used selectors
- Combination selectors
- All selectors and their specificity
- Targeted CSS (solution)
5-Pseudo-classes and Pseudo-elements
- Pseudo-classes
- Practical use of pseudo
- Pseudo-elements
- CSS Pseudo cheat sheet
6- Effects and Text
- What is an effect
- Text effects
- Text effects cheat sheet
7- Transforms & Transitions • CSS Transforms and transitions
- Transforming and transitioning elements (solution)
8-Animations
- CSS animation
- Animation examples
- CSS keyframes
- Animation and effects cheat sheet
9- Measurement Units and Tools
- CSS units of measurement
- Preprocessors: sass, scss, Stylus
10- Debugging and Testing
- Common errors
- Handling errors
- Debugging tools
- Debugging the front-end
- Installing a third-party Linter in VS Code
- Browser-specific CSS
- UI testing
- Case study: How Meta performs front-end testing
Track 3: JavaScript
Introduction to JavaScript
- The Building Blocks of a Program
- Programming Paradigms
- Testing
- End-of-Course Graded
- Assessment
معلومات إضافية:
- مدة التنفيذ : 36 ساعة.
- عدد المحاضرات: 13 محاضرة.
- عدد ساعات المحاضرة: 3 ساعات.
- سعر الدورة : لفترة محدودة 1200 جنيه.