Let me introduce you to Block Element Modifier (BEM) methodology. The variable naming convention that we’ve been doing is a modification of BEM along with camelCase. This naming may cause the linters to yell back at us. Therefore, we are going to refactor the naming to comply with BEM. First though let’s walk through and look at what it is.
While you may wonder why we are doing this, it’s good to stop and consider the quality of your code and then reassess. It’s a natural trajectory as you are advancing towards craftsman. Embrace refactoring as it helps you to continually improve and make your codebase even better.
Once upon a time, there was a developer... You! This is going to be a good story...
Total Lab Runtime: 01:19:50
- 1 Introducing BEMpro 07:28
- 2 Apply BEM to Typography Variablespro 10:50
- 3 Apply BEM to Color Variablespro 10:57
- 4 Refactor Colorspro 04:00
- 5 Apply BEM to Dimensions Variablespro 07:47
- 6 Apply BEM to Screen Sizes Variablespro 02:26
- 7 Neat Breakpointspro 16:10
- 8 Main Stylespro 13:54
- 9 Git Commit and Congratulationspro 06:18