React comes with its own syntax to build components called JSX. In JSX you can mix up HTML and JavaScript. Additionally people often use inline styles in their elements. It is like adding CSS into the mix. This really scares me. We spent a lot of effort removing inline styling from HTML with CSS, and yet it still creeps into our HTML. We also have created a lot of "template" languages (e.g. PHP, Python, ERB, etc.) mi…
Preferably, all local concerns of a component (not referring to the React component class but the abstract component: a single unit within a larger project) would be in one place. For the front end of a web app this includes structure, styling and behavior. So it makes sense to define the structure (HTML), styling (CSS) and basic behavior (animations, different states it can exist in, etc.) in one place.
React models this using JSX, inline CSS (or CSS loaders) and the React component API.