Your time saving front end workflow

Post on 29-Aug-2014

225 views 0 download

Tags:

description

A GruntJS set up to increase the happiness level on front end developers

Transcript of Your time saving front end workflow

YOUR TIME SAVING!FRONT END WORKFLOW

@kurenn

So you want to start a new website?

SASSHAML LESS

Bootstrap

BoilerplateDevices CSS

Coffeescript HTMLjQuery

Yeoman

We all know time is a key factor in staying productive

So you probably think you are really good at saving time by

Harvest App

Pomodoro

Rescue TimeBathroom time

Answer emails

Avoid long meetings

SelfControl

But we are hackers right?

We can automate repetitive tasks and !be more efficient

This is how you probably set up your environment today

Download libraries

Create the directories structure

Download templates

And the worse thing is you probably change your structure each time

Even with everything nicely set up it can take a couple of minutes to start and there

is still more…

Assets compilation

Watch for changes

LiveReload

Minify and concatenate

Deployment

Linting

Because we are all doing this right?

Helps you run repetitive tasks

Assets compilation

Watch for changes

LiveReload

Minify and concatenate

Deployment

Linting

A perfect alternative to !Rake/Make/Ant

https://github.com/andismith/grunt-responsive-images

Produces images at different sizes

https://github.com/gruntjs/grunt-contrib-concat

Concatenate files

https://github.com/gruntjs/grunt-contrib-watch

Run predefined tasks whenever watched file patterns are added, changed or deleted.

https://github.com/gruntjs/grunt-contrib-coffee

Compile CoffeeScript files to JavaScript.

https://github.com/gruntjs/grunt-contrib-clean

Clear files and folders.

https://github.com/gruntjs/grunt-contrib-uglify

Minify files with UglifyJS

https://github.com/gruntjs/grunt-contrib-compass

Compile Compass to CSS

https://github.com/gruntjs/grunt-contrib-livereload

Reload assets live in the browser

A super simple set-up

Always remember

If you are not automating your workflow,!you are probably working too hard