The truth is, yes, you’re missing a few pieces to the puzzle.
But also, the current state of the art in frontend development is actually crazy.
It’s not just you.
First step is to get your local development environment up and running. So Gulp, no wait Grunt, no … NPM scripts!
Webpack or Browserify? (Sheepishly) Require.js? Make the leap to ES6? Or is adding Babel to your preprocessing too much?
BDD or regular unit testing? What assert framework should you use? It sure would be nice to run tests from the command line, so maybe PhantomJS?
Angular or React? Ember? Backbone?
Let me help you understand why this all seems insane. We’ll start with an example and then move on to pretty pictures.
This is React’s “Hello, world!” application.
Not quite done.
There are actually a few missing steps in here, like installing browserify or what to actually do after you’re done here to make it run on a web page, because it’s not like this actually produces a web page that does anything. ¯\_(ツ)_/¯
After you’re done with that you end up with a file called bundle.js that contains your new React Hello World application coming in at 19,374 lines of code. And you only had to install browserify, babelify and react-dom, weighing in at some unknown tens of thousands of lines of code.
So basically this …
Marc was almost ready to implement his "hello world" React app pic.twitter.com/ptdg4yteF1— Thomas Fuchs (@thomasfuchs) March 12, 2016
That’s the whole thing. 18 lines of code. You can copy/paste that into a file called index.html, double click and load it in your browser. Done.
Now for that picture I promised.
And that is why everything is crazy. Most of these tools you think you have to have are solving problems you don’t have NOR WILL YOU EVER HAVE.
Here’s that picture again: