shape-876@2x

Web Development

CSS and Sass for Web Application Developers

מספר הקורס 3132

40 סה"כ שעות אקדמיות
* מספר המפגשים והשעות למפגש עשויים להשתנות בין קורס לקורס
calendar-1.svg

המועדים הקרובים

קורס לקבוצות

הקורס נפתח במתכונת של קבוצה בלבד, בהתאמה אישית לארגונים.
לפרטים נוספים: Muzman@johnbryce.co.il

ספרו לי עוד

Overview

In the realm of web application development, single-page applications are commonly built using a variety of technologies such as Angular, React, and Vue. While the aspect of styling is often handled by UX designers, the responsibility for the application's layout and responsive design typically rests with the programmers. It's a common scenario for developers to find themselves dedicating more time to CSS styling than to the development of content and logic. This course is designed specifically for these developers, aiming to equip them

with advanced skills and knowledge in CSS and Sass, to streamline their styling process and enhance their overall development workflow.

hat.png

מטרות הקורס

kahal.png

Who Should Attend

This course is designed for Angular, React and Vue developers

structure.png

תכנית הלימודים

Course Contents

CSS Selectors in Depth

  • The various types of atomic selectors in CSS
  • Attribute selectors
  • How to combine them using CSS Combinators
  • Pseudo class and Pseudo element selectors
  • Understanding (and predicting) Specificity

CSS Box model

  • Classic displays in CSS
  • CSS Box layers
  • Size units
  • Fun with borders and outlines
  • Box sizing in CSS 3

CSS Flex boxes

  • Understanding the new CSS layout algorithms
  • Flex basics: Axes, Containers, Wrapping.
  • Flex Sizing: Grow, Shrink and Basis
  • Flex Alignment
  • Some pro techniques with Flex

CSS Grid

  • Introduction to Grid layout
  • Grid Templates sizing
  • Grid placement and generation
  • Grid Alignment
  • Pro Techniques with Grid: auto-fit, auto-fill, minmax and more

CSS Sizing and Responsiveness

  • CSS Sizing functions and constants
  • Media queries (and how to rarely use them)
  • CSS Relative and absolute position.
  • CSS Fixed and Sticky position.
  • Combining Positions with Flex and Grid

Advanced Topics

  • Image and Video sizing using object-fit
  • Custom properties and the @property rule
  • The calc function
  • The before and after pseudo elements
  • Gradients
  • Transitions
  • Animations

Sass and Scss

  • Introduction to preprocessors
  • Variables and Functions
  • Hierarchies
  • Flow control in Sass
  • Understanding Mixins
  • Using partials and modules
  • Built in modules: lists, maps, colors, and selectors
Prerequisites
  • Basic knowledge of HTML
  • Basic knowledge of CSS (optional but helpful)

Schedule Appointment

Fill out the form below, and we will be in touch shortly.

לא הצלחנו לאתר את הטופס.

בודק...