warpedvisions.org — Stuff to make you think

A JavaScript link mashup for Winter 2017: Things I used and liked in the JS universe this year.

2017 was a good year for JavaScript. The newer language features are now part of our daily routine. Tightly integrated CI and packaging scripts are the norm, and we have a huge sea of libraries and tools available to us. The core JavaScript frameworks have settled down and mature to the point that we can be confident in JS as the base for large-scale commercial projects.

Here are a few of the main JavaScript things that impressed me this year:

GraphQL for Node.js is the most exciting library of 2017. GraphQL (the QL stands for query language) is a natural evolution of APIs: it makes it easier to ask a web service questions without having to work as hard for the answers. While RESTful APIs provided a clean way to publish and present data, building APIs based on static object definitions force a lot of work on the things that need the data, which is wasteful and complex (as you end up with much more data than you need). And while including the concept of server-side queries isn’t new to APIs, GraphQL does it with a simple syntax that fits nicely into the JS world.

React had a great year as well, with a major feature release and some sweeping licensing changes. I think the combination of these changes and the vitality of the React ecosystem have pushed it well past AngularJS this year. Redux has gained a bunch of ground over Flux this year too, though Facebook could undo that in 2018 with their partial-kinda-sort-of replacement QL/Flux hybrid Relay. The next version of React Fiber has already landed in v16 and will be core to significant improvements to React applications in 2018.

One of the ways to gauge the success of a UI framework is in what gets built with it. This Fall I found a solid spreadsheet component. I’ve also been using SemanticUI and its React bindings, though I am a bit worried about their slow pace of updates. There are a few commercial UI kits, like ExtReact and Webix that have some legs, though I’d love a richer open kit that we could all contribute to.

I’ve worked to improve how we develop software this year with things like deeper CI, better Lint and formatting tools, and better practices. In our quest for improvement, I found Prettier, a JavaScript code formatter that is pretty smart about line lengths and readable code. You can use it in your build scripts, CI, or your favourite editor.

Speaking of editors, I switched to Visual Studio Code this year, which is built on Electron (Node, Chromium, and V8). VSC replaces both Atom and Sublime, as well as my older favs Coda and Espresso. Visual Studio Code plays well with all of the recent linters, CI, build tools, and other gizmos. It performs well for coding tasks in JS and the various web formats I use regularly. When I work with larger text files, however, I’ll still switch to the Vim of Mac (TextMate), or actual Vim (though I’m getting pretty rusty with that these days).

There was a time when I couldn’t imagine Microsoft as a leader in OSS or web tech, but they’ve found their mojo with VSC and have a steady release cadence that’s downright impressive.

One of the best things about JavaScript in 2017 was the huge selection of mature and featureful libraries.

Formatting dates in JavaScript, for example, has always been a bit of a pain, but libraries like date-fns make it a breeze. Similarly, CLI apps have always felt a bit clunky to build with NodeJS, but I found that by using Ink, a React-like library and components for CLI apps, I write a lot less fiddly console.log() code. Ink also makes it easy to write more complex CLI tools, which could be especially good for the ecosystem.

In terms of packaging tools, I haven’t sided on a single bundler this year. That said, I do find webpack easy to set up and use. It’s one of the current generation of build tools, and has simpler, clearer configuration than its predecessors. ParcelJS is on my radar as a simpler way to bundle JS applications, but I haven’t had a chance to use it on anything big yet.

And while there are too many JS libraries to mention, the exciting thing is that there are huge communities and tools for recommending great libraries, like MicroJS and JavaScript weekly.

Storybook is one of those unexpected tools: it’s a mature UI builder for ReactJS, that feels about the way a UI builder should feel these days. I didn’t find myself getting lost in a tonne of automated code generation (i.e., it felt surprisingly lightweight). I haven’t used it in production yet, but I’m looking for ways to make it part of my prototype toolchain for early 2018.

And finally: as JS matures past ES6 and ES7, the language is getting easier to teach (and learn). Here are some resources to help you learn more about the evolution of JavaScript: