Date post: | 18-Jul-2015 |
Category: |
Software |
Upload: | brent-swisher |
View: | 762 times |
Download: | 0 times |
Hello!
Brent Swisher
Web Developer at Grand
Valley State University
You can find me at:
@brentswisher
Hello Again!
Harold
Minion at Grand Valley
State University
Likes:
Clean Code
Smooth Jazz
Dislikes:
Shirts
Leprechauns
Installation & Setup
▪ Installing Node.js
▫ https://nodejs.org/en/download/
▪ Installing Grunt
▫ npm install -g grunt-cli
▪ Setting up a project
▫ package.json
▫ Gruntfile.js
Quotations are commonly printed
as a means of inspiration and to
invoke philosophical thoughts
from the reader.
▪ Now we just need to add the
packages we are using.
▪ npm install [package] --save-dev
Installing local task plugins
Quotations are commonly printed
as a means of inspiration and to
invoke philosophical thoughts
from the reader.
npm install grunt --save-dev
Quotations are commonly printed
as a means of inspiration and to
invoke philosophical thoughts
from the reader.
npm install grunt --save-dev
Available Plugins
http://gruntjs.com/plugins
5,347
Watches files for changes, and
calls other grunt tasks when they
change.
Live Reload! - My personal favorite
use of grunt.js
Available as a chrome extension
grunt-contrib-watch
jshint allows your “minion” to
automatically test your javascript
for common errors or bugs.
For example, it can be set to throw
an error if you declare unused
variables
grunt-contrib-jshint
Javascript minification and
obfuscation
Can also be used to combine
multiple files
grunt-contrib-uglify
grunt-contrib-sass
Sass integration for grunt, allows
you to centralize your build
process
(There are also plugins for most
other pre-processors - less,
stylus, etc)
1. Copy the package.json and
Gruntfile.js to the new project
2. Run npm install
3. If necessary, update file paths
Two files and a command
Quick Note: You will want to exclude the node_modules
folder from git/version control
RESOURCES:
▪ https://github.com/brentswisher/gruntminion - The files
created during the talk
▪ gruntjs.com - Official grunt hompage
▪ http://gruntjs.com/plugins - list of available plugins
▪ https://nodejs.org/download/ - Node.js Installer
TUTORIALS:
▪ http://24ways.org/2013/grunt-is-not-weird-and-hard/
▪ http://www.html5rocks.
com/en/tutorials/tooling/supercharging-your-gruntfile/
CREDITS:
▪ “Harold” by Jake Rohdy
▪ Busy Icons by Olly Holovchenko
▪ Presentation template by SlidesCarnival