In this 13-video course, discover the browser features that are important to full stack developers and how CSS (Cascading Style Sheet) preprocessors make adding styles to a web page and web site easier, especially when the site becomes large. Begin with custom elements and creating new HTML tags. Then take a look at the Shadow DOM (Document Object Model), and avoid conflict by creating separate DOM elements. Next, explore HTML templates, and writing markup that is not rendered. Learn about Cross-Origin Resources Sharing (CORS), which leads to setting up and installing Sass preprocessor, and using variables and nesting to speed up CSS development. Learn how to set up and install LESS, a CSS preprocessor, and then examine workings of LESS variables and mixins (functions allowing reuse of properties). Discover how to use LESS Scope to confine variables, add an operation, and implement a function. Then learn how to install Stylus by using Node.js, and then write simple markup with Stylus. Close the course with an exercise on using LESS mixins to combine styles into a nest pattern.
FSD Front-end Development: Advanced CSS Browser Features