Styling Angular 14 Applications
When it comes to CSS and Angular, you must transform how you apply styles within your applications or be left behind. In this course, you'll learn how styles work in angular, how to apply maintainable systems using CSS and SASS, and more.
What you'll learn
Angular revolutionizes the way that you architect CSS for modern web applications. But before you can become Angular styling ninjas, you need to take a step back and consider the many different ways that things can be done. In this course, Styling Angular 14 Applications, you'll explore how the framework aligns with web components and what that means for adding styles to components and apps in general. Throughout this course you'll develop systems geared towards organization, scale, and maintainability for HTML and CSS within Angular apps. As you get more comfortable adding and styling components within these systems, you'll consider component themes and the ways that you can transform their look under certain circumstances. By the end of this course, you'll have a strong knowledge of how Angular processes CSS and the many different ways it can be leveraged as part of an overall design system for creating beautiful, organized, maintainable, and future proof web applications.
Table of contents
- Introduction 2m
- Global Styles: A Traditional Approach 5m
- Global Styles: A More Modular Approach 12m
- Simplifying Global Imports for Preprocessors 2m
- Naming Conventions 7m
- Predictable Sizing with Relative Units 4m
- CSS Selectors & Style Overrides 6m
- Component CSS Structure & Organization 5m
- Local Mixins & Variables 3m
- Styling the Pre-boostrap Loading Screen 2m
- Summary 2m