Compiler Theory

[FlatAssembler]

Yesterday evening, I've published a video in which I try to explain the basic concepts of the compiler theory: https://youtu.be/Br6Zh3Rczig
What do you think about it?
Also, what do you think, does studying compiler theory help with programming in general? If you asked me this a year ago, I would say it certainly does. Now I am not so sure. I see that many people, most of which haven't studied the compiler theory, learn programming a lot faster than I do. I sometimes ask myself if it is because I've studied some compiler theory, rather than in spite of it. When trying to learn a programming language (such as MatLab or VHDL), I often find myself thinking "Wait, that seems impossible. How can that possibly be implemented in the compiler? I must have misunderstood something.", only to find that I didn't misunderstand it, and that the compiler somehow manages to compile that (even though I have no idea how I'd implement something like that in my compiler). Maybe I waste a lot of time on that and maybe I somehow need to turn off that kind of thinking in order to be a good programmer?
For example, I recently tried to learn some ReactJS and, of course, some advanced JavaScript. I thought it would be relatively easy, because I already knew some JavaScript, I've made a PacMan in JavaScript and a compiler for my language targeting x86 in JavaScript. But it wasn't easy for me. Soon after starting learning ReactJS, I bumped into something like this:

Code:

const header=<h1>Hello world!</h1>;

I thought "Aha, that's some new syntax in JavaScript.". So I tried typing that into NodeJS, only to get a bunch of syntax errors. So I was thinking "What? If JavaScript engines can't parse the code when the ReactJS framework is not included, how can they possibly parse it when it is included? A framework can't possibly modify how the parser behaves, it starts executing only after the parsing phase has long passed. I don't get it.". Then came some importing CSS into JavaScript. I thought "What? How can that possibly work? JavaScript engines don't know anything about CSS. If you include a CSS file in JavaScript, it won't even tokenize (an identifier can't contain a '#' in JavaScript, but it can do so in CSS), yet alone parse and semantically analyze. I don't get it.". Then I saw the syntax for declaring properties of classes in JavaScript. In the example I saw, the declarations are separated with nothing but a new-line character. I thought: "What? But JavaScript is not a whitespace-sensitive language. How could this possibly work? How can the parser know where one declaration ends and where another declaration starts if they are not separated by a semicolon or a comma?". I thought it was too much for me, so I gave up.
So, maybe thinking about compiler theory is a very wrong way to think about the programming language you are studying. I was wondering what you thought about it.