JavaScript libraries and tools: what are the bare essentials?

question.md

Question: If a newcomer to JavaScript asked you for essential libraries and tools, what would you tell them? You don’t want to overwhelm them with too many suggestions!

Focus: language-related functionality (as opposed to browser-related functionality).

• Libraries: including, say, Underscore.js and promises libraries, but excluding jQuery et al.
• Tools: package managers, build tools, unit test tools, etc.
  • Less important: editors, IDEs. Rationale: it’s fairly obvious that you need them. There are other tools that people might not even know that they need.

Libraries

If the target is ES3 compat, [forEach, map, reduce, filter, bind]. Otherwise, I believe the JS stdlib is more than enough to solve every common problem a newcomer has, and what they really need is help understanding how to use JS and the tools that JS includes.

Tools

• An editor with non-shit JS syntax highlighting: Sublime Text 2 or Textmate
• Firefox with Firebug or Chrome for debugging
• Possibly Node.js, also for debugging, but we're bordering on "not-newcomer" territory with this

That's it.

@rauschma I totally agree with @Benvie plus the question is wrong since it's missign the context: what you need to do? would be the first counter question. JavaScript by itself is already good, there are few things that I would consider essentials and pretty sure these are different from yours ;-)

@WebReflection: good point re. context. I’ve clarified above.

more context but still too vague ... you need cross Desktop quick prototyping? Why exclude jQuery then!
Do you need performance? You, as newcomer, are kinda screwed by default but there are libraries focused on getting less things done, abstraction speaking, but in a blazing fast and reliable API way!
Do you need to learn node.js and/or server side JS ? Again, would that be node.js or something else? 'cause in Rhino world, and nowadays Ringo too, you have easy access to Java world so many other options/choices compared to node.

Then again, mobile? desktop? tablets? gnome? ChromeOS? FirefoxOS? WHC? JScript? JScript.NET? TypeScript? CoffeeScript? ... and so on ...

Long story short: JavaScript is truly adopted everywhere so, the very first welcome would be: "please tell me you are not asking thins thinking is going to work everywhere ... " :D

for tests I go wru personally. and it does, always, bloody work! always, no matter where!

For a newcomer

• an EcmaScript 5 polyfill library (https://github.com/kriskowal/es5-shim seems to do the job) - since they are starting now, they should learn EcmaScript 5 directly
• Chrome + Inspector and some links to learn how to get the best out of them
• Sublime Text 2 with a list of recommended plugins (SublimeCodeIntel and JSHint in that list),
• links to MDN to get them started (to avoid google taking them on that w3 schools site)

Then as WebReflection said, the rest depends on what they need to do

Tools

I think a newcomer can benefit enormously by looking at code posted on sites like jsFiddle. Couple that with live reloading and real-time jsHinting and you have a pretty good environment to learn and experiment. I have tried to create an environment like that on Plunker: http://beta.plnkr.co/edit/gist:1986619?p=preview

Language functionality

For a true newcomer, I think several things are necessary:

• Understanding of asynchronous programming and the specific paradigms for attacking this in javascript (callbacks vs. promises)
• Understanding chained APIs vs. functional APIs
• Understanding when Javascript code will be run (onload, inline, bottom of body, etc..) and the consequences of the timing on the availability of the DOM
• Understanding how CSS selectors work in order to identify and act on different DOM elements.
• Understanding what can be done with elements and how to effect changes

Once these items are addressed, a newcomer could be introduced to different frameworks that aim to address one or more of these elements, like:

• jQuery provides a Promise API, onload callbacks, a selector engine and chained API
• Underscore gives algorithms and shortcuts to common, lower-level requirements
• Etc...