The Living Thing / Notebooks : Javascript

There is enough written about javascript on the web; I’m going to note down the tricks specific to my domain, k?

See also stream processing, UIs, audio, mathematics.

Basic Howto

Handy patterns

But don’t use any of these; simply treat it a a pure functional language as far as possible; it’s simpler anyway.

Handy tools

Packaging and workflow

ARGH! Why can’t we all just get along?

Dependencies

Build tools

webpack

We mostly use webpack, which is built on npm. webpack is a module bundler. This means webpack takes modules spread across multiple files with dependencies and a smaller number of files which include the functionality.. It’s the dominant build system right now for web apps, at least for community-supported react-based ones.

Webpack works by magic, as far as I can tell, and it has fearsomely complicated and poorly explained configuration. Nonetheless, everyone uses it and so we ignore it and just GO here.

webpack.config.js has the actual configuration, which does various things. package.json lists the various libraries (“dependencies”) that are assembled together by npm. It isn’t specific to webpack, as all npm packages use it, but we use webpack here.

npm install --save-dev --upgrade \
  babel-cli \
  babel-core \
  babel-loader \
  babel-plugin-system-import-transformer \
  babel-plugin-transform-dead-code-elimination\
  babel-plugin-transform-function-bind \
  babel-plugin-transform-object-rest-spread \
  babel-preset-es2015 \
  babel-preset-react \
  babel-preset-stage-0 \
  localforage \
  node-static \
  react \
  react-dom \
  react-redux \
  redux \
  redux-logger \
  redux-persist \
  redux-thunk \
  reselect \
  rxjs \
  serviceworker-webpack-plugin \
  source-map-loader \
  tone \
  webpack \
  webpack-dev-server \
  webrtc-adapter \
  worker-loader

complete workflow tools

kill me now

Language extensions

Online collaboration

A major selling point of javascript is that it is the native language of the web; so you should be able to take advantage of it USING the web.

JS data compresssion