JavaScript Tooling

Intro

Web Development has gained a lot of useful tools for making it easier for developers to create great websites. However, with these tools comes a bit more complexity. Babel, CSS Preprocessors, testing frameworks, ESLint, Webpack, minifiers, and a host of other tools need to be applied to your code to gain their features. This requirement is going to show you how to install and configure a few of these tools.

Prerequisites

It is suggested that you understand the following:

• NPM
• ES6
• CSS Preprocessors

Suggested Learning

• Using NPM Scripts to run a build process
• Look at the usage instructions for several popular tools:
  • JavaScript:
    • Babel - Choose the ‘CLI’ option
    • ESLint
    • UglifyJS
  • CSS
    • LESS
    • NODE-SASS and SASS guide
    • Stylus

Requirements

• Create a project which includes ES6 JavaScript and CSS code with a preprocessor
• Wire up a package.json with sufficient scripts to use several of these tools. Include, at least, Babel and a CSS Preprocessor. Make it so each tool has it’s own command, and have a command that runs all of the tools together.
• Include a postinstall script in your package.json
• Show your project to your mentor to get passed off

Extra Learning

This list is by no means complete. Feel free to add an issue or put in a pull request to update it.