Do I start with vanilla JS? jQuery? Backbone? Spine? Angular? Knockout? Ember? I need to make my site responsive - how do I write that from scratch? How can I test in all browsers? Should I use Bootstrap? Foundation? Skeleton? What's a CSS compiler and which should I use? LESS? Sass? Scss? Stylus? Plain CSS? Should I still use PHP? Or is Node the new thing? My friend said something about Ruby on Rails. What the hell is a grunt? What's an asset pipeline? How do I gzip/minify/concatenate/compress/compile files? On and on...
When I got into web development ~12 years ago, I don't remember having to make many choices besides HTML and CSS. After that, it was a gradual learning process as web technologies developed. It seems that beginners today have a lot more tools at their disposal, but they also have a much broader set of technologies and practices to navigate.
There is definitely an element of analysis paralysis, but on top of that, there is the dirty little secret that many web developers don’t like to talk about: you don’t need to use any of these new tools to make a decent web page. Vanilla HTML, CSS and JS work as well as they ever did.
In fact, they are significantly better in many ways, because of course they have also moved on in the past decade. The arrival of simple but effective tools like querySelector in JavaScript negates one of the main reasons we started adopting frameworks like jQuery. There are widely supported elements of CSS3 that mean we don’t have to rely on awkward image-based techniques for basic graphic effects like rounded corners any more. We have web fonts that can handle many simple cases of headings and presentation text where again image replacement techniques used to be the only viable option.
So personally, I’m not sure introducing any novice web developer to all those other tools early on is even a good idea. Everything ultimately comes down to HTML, CSS and JS on the client side, and if you understand how those work, you can already achieve a lot. With experience, you’ll find that some things become repetitive, and others would take a prohibitive amount of effort to implement even if you understand how you would do them. Then you start to understand what kinds of tools you would find useful for your projects, and you can explore what’s out there from an informed starting point and with practical goals in mind.
Without that perspective, I think there is a very real danger of putting the cart before the horse, or in this case, the tools before the results. I’ve lost count of how many blog posts I’ve read in the past year or two advocating this combination of 12 “essential” tools or that “robust, repeatable” development process. It’s remarkable how many of them are hosted on sites that take several seconds to display the home page, struggle to scroll that page up and and down once you get there, use absurdly large fonts on my desktop screen (because they’re responsive, darling[1]), have all the design and typographical sensitivity of inch-high red Vivaldi on a bright green background, and have all the usability of a 2003 e-commerce site.
[1] What do you mean I have no idea what I’m talking about and I’ve completely missed the point of responsive design? I’ve got my responsive object-oriented dynamic grid plug-in library framework right here!