- Last update:


Why Javascript is the new hotness

🕒 4 min read

Category: Code

Tags: javascript, code, web, node


Use date-fns. It is lighter than Moment.js. And it is immutable.

A word on ESlint

ESlint is probably the most popular linter for JavaScript. It is also very convenient and benefits from a large community. That is why I use it.

When I started using, I got confused by two different things: shareable configs and plugins. This thread explains the difference between the two quite well. Here is my version:

Plugins are like function definitions (a set of custom rules). Configs are like actual calls to thoses functions (pre-defined configuration of rules - like whether they're enabled or not, and how they are configured).

How to start a new JavaScript project?

If it is a simple project or a NPM package, I recommend having two distinct folders: src for sources and dist for builds.

  1. Now, do:

    git init
    git add remote origin ... # If need be
    npm init
    yarn add --dev babel-cli babel-preset-es2015
    yarn add --dev eslint
    yarn add --dev eslint-config-standard \
                   eslint-plugin-standard \
                   eslint-plugin-promise \
                   eslint-plugin-import \

    We use babel to transpile our code, to better support old versions of NodeJS.

    Regarding the last line, the config eslint-config-standard sets the configuration of these four plugins: standard, promise, import and node. That is why we need to install them alongside the shareable config. Of course it is a config for eslint, that is why we installed it on the previous line.

  2. Do:

    yarn add prettier-eslint-cli

    Normally, prettier-eslint only operates on strings, not on files. prettier-eslint-cli will provide you with a command to apply prettier-eslint on files.

    What is prettier-eslint meant for? Well, under the hood it calls prettier (probably the best JavaScript formatter to date) and then eslint --fix to format your code. Twice. But there's a reason for that.

    Now we need to configure eslint to tell it to use standard as its style.

  3. To use the standard style with ESlint, create .eslint in the root directory of your project and write:

        "extends": "standard"
  4. Add a badge to your README.md: badge.fury.io/for/js

  5. Configure package.json:

    "scripts": {
        "test": "echo \"Error: no test specified\" && exit 1",
        "build": "babel src --presets babel-preset-es2015 --out-dir dist",
        "format": "prettier-eslint \"src/*.js\"",
        "lint": "eslint src",
        "check": "npm run lint && npm run test"
  6. Set up environment variables if need be via .npmrc.

All set!



Set-up your environment



Some cool node/npm stuff/packages/tools


In loops, they are a common issue. Here is how to solve it: