CSS MODULES IN REACT JS - FULL TUTORIAL + TIPS - Avoid Class Conflicts

In this video, you will learn how to work with CSS Modules in React JS.

This will ensure that your components' styles are scoped and will avoid conflicts with the styles for other components.

I'm using SASS (.scss) in this video, but it works the same way with CSS.

Link to the source code so you can follow along with me: https://github.com/ivanlourencogomes/css-modules-react

When you download the source code for the first time, run 'npm i' in the terminal to install the dependencies of the project.

CHAPTERS:

00:00:00 Introduction

00:00:16 Why Do We Need CSS Modules?

00:02:37 Getting Started with CSS Modules

00:04:20 How CSS Modules Make Class Names Unique

00:05:00 Tip #1 - Be Consistent With the Class Object's Name

00:05:39 Tip #2 - Use Class Names With Dashes

00:07:31 Tip #3 - Add Multiple Classes for an HTML Element

00:09:12 Tip #4 - Work With Dynamic Classes

00:10:33 Ending

Instructor: Ivan Lourenço Gomes