I think my question may best be explained by some examples...
Example 1: I open up the developer tools in chrome and select the console. I wonder how in the world the developers of chrome are showing compiler/interpreter output in the console window, or something as simple as console.log being redirected to a GUI window.
Example 2: I find a site like dot net fiddle
C# Online Compiler | .NET Fiddle[
^] and I want to find out how a compiler can be included in a website, but I think I could look up every web development tutorial in the world and never find something that would come close to even giving me a hint of how to make something like dot net fiddle.
Example 3: I consider an API like JavaFX and wonder how that translates to GUI elements and functionality on the platform it's running on. I understand it's compiled to bytecode, and run by the JVM, but I can't trace it deep enough through the abstraction hierarchy. Same thing with something like the HTML5 Audio api, etc...
I could come up with dozens of more examples, but I think everyone reading this gets the point. I feel like I'm hunting and pecking to figure things out, github repos, articles, blog posts, Operating System books, etc... computing journals, etc... I find little bits of information that help, but not enough to build and understand such things. What background education or approach should I take to understand things like this, and then eventually innovate? Thank you.
What I have tried:
Searching repos, reading computer science books, searching blogs, looking at university computer science course materials.
Submit an article or tip