In frontend engineering where there is a separation of logic and presentation you end up with flimsy, broken code. We used to write websites in html and then add some js that targeted specific elements and that was impossible to maintain.

Component based frameworks do away with all that because it doesn’t work. In react you’re mixing logic with your html too through jsx and this framework (and others like vue/svelte) go a step further and put everything related to a fragment of html in a single file.

This works really well, it means your styles don’t leak unless you want them to, your js usually only affects the html in the same file it’s written and you can build robust apps.