Task Runners

🤔

Tasks in Frontend

Minifying JS and CSS files

Optimizing Static Images

Compiling TypeScript to JavaScript

Compiling CSS Pre-processors (SASS) to CSS

 

What is a task runner?

Task Runners in Frontend

• grunt
• gulp
• module bundlers: (webpack, rollup, parcel)
• custom npm scripts

Example

• We want to compile pug to HTML
• We want to compile SASS to CSS
• We want to have auto-reload enabled

Gulp Demo

Webpack Demo

Parcel Demo

Minification