Do What I Mean


Table of Contents

Once upon a time, Javascript was the domain of script kiddies.

No more. The last few years have been a roller coaster ride for the language and its thriving community. The result is ECMA Script 6 (ES6, ES2015) with a long list of state of the art features.

1 Toolchain

The typical Javascript (JS) toolchain consists of:

  • Node.js allows you to run JS outside your browser. It supports ES6 (and more) out of the box is the basis for all the tools below.
  • npm is the package manager that comes with node. It provides a Command Line Interface (CLI) and uses a central registry of available JS packages.
  • Babel transpiles advanced JS constructs to vanilla JS that every moderately modern browser should be able to understand.

2 Server

Typical server-side tools include:

  • express is the goto web micro-framework, but I also encounter Ember in some projects. Ember is to Express, what Django is to Flask.
  • mongodb is the quintessential noSQL database. Personally I have not been able to wrap my head around it, but I fear that may be because I am too influenced by relational databases.

Lately, I have been experimenting with Crossbar which provides me with an elegant alternative to conventional HTTP/REST solutions. Crossbar itself is written in Python but components can be written in almost any language, including JS.

3 Client

For development of the client, webpack is often added to the toolchain. This tool bundles your app with its dependencies (like assets and packages), keeping your app free of cruft and allowing you to keep source code and related files together (no more `assets` folder). It also allows you to load non-JS files (like CSS or CSV) into your JS. I find that hot reload is the killer feature for me.

On the client-side I typically use:

  • a client framework like
    • React which uses Javascript extension JSX which allows you to define and use your components like HTML tags. The result feels very elegant to me.
    • Angular was my first introduction to a JS client framework, but I find its development confusing. Angular 1 was fine for me, but it was decided that a major overhaul was needed. So Angular 2 came around, which used TypeScript and moved away from MVC in favor of services/controllers. After Angular 1, unfortunately I lost interest.
    • Vue I tried in combination with Laravel, but didn't like it very much.
  • a UI toolkit like Bootstrap, but I personally prefer Blueprint.
©2019 otech-nl