Simple Intro to Node.js, npm, and webpack

This was originally written for fellow Duolingo employees and therefore assumes that the reader is familiar with Python.

What’s Node.js? Why are we using it?

Node.js bills itself as “server-side JavaScript” and is the most widely used JS equivalent of Python’s python terminal command. Running node without arguments will start an interactive JS shell, and running node foobar.js will execute the contents of foobar.js, printing any output to stdout.

Node.js is not a webserver, a web app framework, or the name of a file.

What’s the point of having a JS interpreter outside of your browser? Many web development tools (e.g. Less) are written in JS. Why weren’t those tools written in C++, Python, etc.? Approximately 100% of the open-source web community knows JS; no other language comes close.

What’s npm? Why are we using it?

npm (“node package manager”) is the most widely used JS equivalent of Python’s pip. Main differences:

What’s webpack? Why are we using it?

Webpack is a build system like Make or Gradle. At a minimum, we need it for combining hundreds of JS source files into a few that we send to the browser. It does so by implementing a module import system—a fairly universal language feature that vanilla JS doesn’t yet provide.

The other main feature of webpack that we currently use is webpack-dev-server, a companion tool that can automatically build our JS and serve it from localhost:9091. This separation from the Paste server drastically reduces the time wasted on local server reloads because: