Skip to content

wamujlb/frontend-gulp-boilerplate

Repository files navigation

frontend-gulp-boilerplate

An ES6 boilerplate with common frontend tasks using Gulp 4 as build system.

This is a work in progress. Feel free to contribute.

Install

Requirements

Node (use brew or install it from here)

brew install node

Gulp (Getting started)

npm install gulp-cli -g
npm install gulp -D

Clone this repository

OSX & Linux

git clone https://github.com/wamujlb/frontend-gulp-boilerplate

Windows

git clone https://github.com/wamujlb/frontend-gulp-boilerplate

Start a new project

npm init

Install an existing project

Then each time you clone the repo, use (yarn is better and faster):

yarn install / npm install

Usage

Tasks

Launch it

gulp dev

All the magic begins here:

  • process .html from .hbs files
  • process .css from .scss, .sass files
  • process .js files
  • create a server with BrowserSync and automatically run it
  • watch changes in /src folder
  • automatic reload on changes in /src folder

Make changes

  • Write your .hbs code in /src/templates/ folder
  • Write your .sass or .scss code in /src/sass/ folder
  • Write your .js code in /src/js/ folder
  • Add images, fonts, icons, js libraries in /src/assets folder

Licence

MIT