Install dependencies

1. Download and install Node.js if it's not installed on your machine
2. Install the Gulp command line tools, gulp-cli, with npm install gulp-cli -g
3. Navigate to the root directory of your project and run npm install to install dependencies
4. Run gulp serve.

With the above command, a static web server starts in your browser which points to /src directory. It watch your files to reload the browser upon change to the HTML files, or JS and CSS files. Also, it watch your SCSS and JS files to compile them to page.min.css and page.min.js upon each change.

Write code

Time for development. Now you're ready to create your HTML files and writing your custom CSS and JS codes.

- HTML
Since most of the websites have a global layout for whole of the application, you might want to start modifying index.html file and create a global layout for your website. Check available layout features such as navbar, header, cover, footer, etc. as well as all the blocks and UI Kit.

- SCSS
Write your additional styles inside /assets/scss/_style.scss. Feel free to create more scss files and even subdirectories inside /scss folder to split your code to smaller chunks and import them inside /scss/page.scss file. Our Gulp task is watching all of the scss files inside /scss directory and recompile the page.min.css upon each change.

- JavaScript
Your additional JavaScript codes should be write inside /assets/js/src/script.js. Again, if you need to split your code to several JS files, simply create them inside /js/src directory and require them inside the /js/src/page.js. Our Gulp task is watching all of the JS files inside /js/src directory and recompile page.min.js after each change using Webpack.

Distribute

Done with development? Run gulp dist to deploy your code inside /dist directory. This task simply remove unnecessary files (scss files, scss folder, unminified css and js files, etc.) in the /dist folder. Now you can use the /dist folder in your server side coding or upload to your web server.