renancouto / front-template

A basic template for front-end development using Node.js

front-template

A basic template for front-end development using Node.js

dependencies

Make sure you have installed the following:

• node.js
• npm (node.js package manager)
• grunt
• ruby
• gem (ruby package manager)
• sass

I think there's enough installation material about all that on the web, so I won't make a how-to-install for this dependencies. After you have all that set, you can carry on.

installation

git clone https://github.com/renancouto/front-template
npm install

usage

main tasks

---

grunt {environment}

use prod or dev as environments

grouped tasks

---

views (html)

grunt views:{environment}

scripts (js)

grunt scripts

styles (css)

grunt styles:{environment}

images (jpg,gif,png)

grunt images:{environment}

all tasks

---

assemble

Generate static HTML files using Handlebars as the template engine

grunt assemble:{environment}

connect

Creates the server

grunt connect

sass

Generate the stylesheets using SASS preprocessor

grunt sass:{environment}

autoprefixer

Add vendor-prefixes for the generated CSS (postprocessor).

grunt autoprefixer

clean

Cleans the DIST folder

grunt clean:all

Only styles

grunt clean:styles

Only scripts

grunt clean:scripts

Only html files (views) no the root

grunt clean:views

Only images

grunt clean:images

copy

Copy files from SRC to DIST folder

grunt copy

prettify

Prettifies html files on the DIST folder

grunt prettify

htmlmin

Minifies html files on the DIST folder

grunt minify

verifylowercase

Verifies file's extensions and throw errors on uppercases

grunt verifylowercase

imagemin

Minify images

grunt imagemin:{environment}

watch

Watch for file changes and reload the page (livereload)

grunt watch