Skip to content

Javascript

https://stateofjs.com

CLI utilities

Installation

  • Bokeh documentation has good info on how to build, install, and mix npm packages with conda.
  • Install packages using npm install.
  • Make those packages available for the browser using WebPack or Browserify.
    • Alternatively, you can use Bower instead of the npm + WebPack / Browserify configuration.

Packages

Asset management

  • WebPack (★★★) - Bundles assets (used with npm).
  • Browserify - Similar to WebPack, but simpler (used with npm).
  • Bower - Manage frontend packages (can use npm + WebPack / Browserify instead).

Bioinformatics

  • ngl - Molecular viewer. MIT

Development

Charts

  • [bokeh] - Mostly for Python.
  • [c3]
  • charts.js - Most popular. [Canvas]
  • [d3.js] - Requires a lot of boilerplate for basic charts. [SVG]
  • [highcharts] - Not free for commercial use.
  • [nvd3]
  • [plotly] - Large footprint.
  • [victory] - Usable with ReactJS only.

See also:

Linting

  • ESLint - The best linting framework. Run eslint --init to generate the initial config file.
  • Flow - Adds static typing to javascript.

Example .eslintrc.yml file:

extends: google
rules:
  camelcase:
    - off
  max-len:
    - warn
    - 99

Web development

Basic webserver using express.js:

var express = require("express");
var app = express();
var path = require("path");

// viewed at http://localhost:8080
app.get("/", function (req, res) {
  res.sendFile(path.join(__dirname + "/index.html"));
});

app.listen(8080);

Transpilers

  • CoffeeScript - Cleaner syntax than JavaScript. - Atom, etc.
  • TypeScripp - Developed by MicroSoft. Type checking.
  • ES6 - JavaScript with additions. Will probably develop the largest community. Use this!