# Gulp

Gulp is a javascript task runner which helps automate some processes involved in web development. Gulp configuration and tasks are defined in `gulpfile.js`.

## Gulpfile.js

Please open `src/gulpfile.js`. With `srcPaths` and `destPaths` variables you can configure your own src files / distribution site structure.

    /*
    AppUI Template
    Gulp Automated Tasks
    */

    // Paths to sources, raw files
    var srcPaths = {
    	templates: 'templates/',
    	sass: 'scss/',
    	js: 'js/',
    	img: 'img/',
    	fonts: 'fonts/',
    	data: './data/',
    };

    // Paths to production ready files
    var destPaths = {
    	site: '../dist/',
    	css: 'assets/css/',
    	js: 'assets/js/',
    	img: 'assets/img/',
    	fonts: 'assets/fonts/',
    };

    ...

## Gulp tasks

After installing Node.js and setting up project folder, open command prompt, `cd` to project directory and use following commands:

To compile Js files, run `gulp js`:

    gulp js

To compress images, run `gulp img`:

    gulp img

To compile Sass files, run `gulp sass`:

    gulp sass

To render HTML files, run `gulp html`:

    gulp html

`gulp html` is dependent on some other tasks, so images compression, compiling js will be runned simultaneously.

If you want to automate HTML and Sass compiling, run `gulp watch`. Files will be automatically compiled after every change.

    gulp watch

To escape watch mode, use `ctrl+c`.

Now you can step forward to Working with Nunjucks templates.