What is the difference between vanilla css and modular css

Question

I went through an machine test where I was allowed to convert a PSD template into a HTML using vanilla css and modular css.

I tried searching for both but couldn't find something related to vanilla css.

However searching more deep I got a very good result with modular css. Here is the link.

Any thought will be greatly appreciated.

Answer 1

There is no difference between them rather than how you structure your css. Think of modular css as a style of writing vanilla (i.e. normal) css.

In modular CSS, the CSS is grouped by modules. Robin Rendle wrote a good article about these css modules.

It's merely a set of guidelines, on how to approach your css architecture and name your classes.

The reasoning is pretty simple, if you use smacss, for instance, anyone that joins your team can learn the smacss principles and start working on all of your projects.

Have a look at BEM, SMACSS, ITCSS, or OOCSS.