React, etc. Tech Stack

React, Flux, GraphQL, Hack, HHVM...? All of this and more!

What is the new NPM site built with? A look under the hood

NPM is the backbone (eh, eh) of the JavaScript ecosystem. The packet manager originally meant for distributing Node.js modules has grown to be a universal tool for distributing JavaScript code for the server and client, TypeScript type definitions, CSS frameworks and a whole lot of JS tooling.

In short, npmjs.com is a big deal. This is why it is interesting to see how the service itself is built. The NPM site was kind of long in the tooth as it had been around for quite a few years. With the pace that the JavaScript ecosystem it seemed downright neanderthal.

Parts of the site had been revamped, with the Next.js Universal React Framework powering the package search. However the team chose not to go with Next.js, Nuxt.js or any off-the-shelf Universal JavaScript Frameworks. Instead they assembled the whole site out of industry standard components.

The stack news comes from NPM developer Chris Dickinson, who lists the following technologies as their choice of weapons for the March 2018 renewal of npmjs.com. Here's their amazing tech stack to power the mightiest JavaScript site of all:

Webpack with Babel and Natch: Webpack and Babel continue to be the standard tools for JavaScript module bundling and code transpilation, but Natch is a more unusual tool. The library offers natural pattern matching aking to Clojure multimethods.

React: React.js is the worlds favourite (as of 2018) declarative UI library. It's Virtual DOM implementation continues to be popular from startups to corporate giants.

Redux: The functional state management that library blew our minds in 2015. It has since received some criticism, but remains a solid choice for complex apps.