The layers of the Web

The web browsers only know 3 languages, and those are HTML, CSS and Javascript. No matter which framework, library or module you are using, chances are that the module compiles to a couple of files that every browser can understand and run in every OS.

Those 3 technologies are many years old and they have been transformed over and over to satisfy the historically important needs (and continue to do it today).

Many of the features that were useful in the past, are now likely an annoyance or uncomfortable to work with and maintain with good quality.

That’s why there are so many tools that “ease” the work with the browser-native languages.

Every framework compiles to one or many of the triad:

• ReactJS makes repeatable components so you don’t have to manually manage JS in states with logic and helps you to stay DRY.
• Sass is a preprocessor that converts special .scss or .sass files into .css files, so you can use more advanced techniques like variables, mixins, functions, and more. Special note: CSS got upgraded and now supports some of the features that Sass brought to the table a while ago
• typescript is a superset of javascript that adds support to types and type checking in your IDE. So you know something is wrong even before you try in the browser.

As another layer of complexity, not every browser support the same HTML, CSS and javascript features, there are sites to show you compatibility by browser type and version.

This post comes from github, view it here.