Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Grunt your way to Glory - SideView 2013
Search
Shaun D
November 09, 2013
Technology
3
260
Grunt your way to Glory - SideView 2013
Presentation from SideView 2013 - Grunt you way to Glory
Shaun D
November 09, 2013
Tweet
Share
More Decks by Shaun D
See All by Shaun D
The Open Metaverse - Front End Kent
shaunix
0
56
The Open Metaverse - Reactivate London
shaunix
1
80
The Open Metaverse - Fullstack Bytes
shaunix
0
130
In Your Face : WebVR
shaunix
0
93
This is for Everyone
shaunix
0
670
A11Y & React : This is for Everyone
shaunix
1
180
Make Mine Meteor - Real Time Applications, Hyperspeed Time
shaunix
1
89
Grunt your way to Glory : LDNJS - 15th July 2013
shaunix
3
170
Grunt you way to Glory : LNUG MAY
shaunix
4
320
Other Decks in Technology
See All in Technology
AIエージェント開発用SDKとローカルLLMをLINE Botと組み合わせてみた / LINEを使ったLT大会 #14
you
PRO
0
120
5分でカオスエンジニアリングを分かった気になろう
pandayumi
0
250
大「個人開発サービス」時代に僕たちはどう生きるか
sotarok
20
10k
「全員プロダクトマネージャー」を実現する、Cursorによる仕様検討の自動運転
applism118
21
11k
会社紹介資料 / Sansan Company Profile
sansan33
PRO
6
380k
新アイテムをどう使っていくか?みんなであーだこーだ言ってみよう / 20250911-rpi-jam-tokyo
akkiesoft
0
280
フルカイテン株式会社 エンジニア向け採用資料
fullkaiten
0
8.7k
20250913_JAWS_sysad_kobe
takuyay0ne
2
220
今!ソフトウェアエンジニアがハードウェアに手を出すには
mackee
12
4.8k
AI開発ツールCreateがAnythingになったよ
tendasato
0
130
20250910_障害注入から効率的復旧へ_カオスエンジニアリング_生成AIで考えるAWS障害対応.pdf
sh_fk2
3
260
OCI Oracle Database Services新機能アップデート(2025/06-2025/08)
oracle4engineer
PRO
0
160
Featured
See All Featured
Building Better People: How to give real-time feedback that sticks.
wjessup
368
19k
A designer walks into a library…
pauljervisheath
207
24k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.4k
The Straight Up "How To Draw Better" Workshop
denniskardys
236
140k
GraphQLとの向き合い方2022年版
quramy
49
14k
Done Done
chrislema
185
16k
RailsConf 2023
tenderlove
30
1.2k
Art, The Web, and Tiny UX
lynnandtonic
303
21k
Imperfection Machines: The Place of Print at Facebook
scottboms
268
13k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
188
55k
[RailsConf 2023] Rails as a piece of cake
palkan
57
5.8k
BBQ
matthewcrist
89
9.8k
Transcript
GRUNT YOUR GRUNT YOUR WAY TO GLORY WAY TO GLORY
or:how to stop doing things manually and learn to love automation
Automation isn’t about being lazy. It’s about being efficient. -
Addy Osmani
ENSIGN DEV
UGLYFY&MINFY COMPILE&CONCAT COMPRESS&OPTIMISE IMAGES LINT JS BLESS CSS GENERATE DOCUMENTATION
STICK IT IN BUILD ZIP IT&UPLOAD IT TO S3
#!/bin/sh
MAKE RAKE CAKE JAKE
MAKE RAKE CAKE JAKE
MAKE RAKE CAKE JAKE
@paul_irish
None
<target name="jshint">! <apply dir="${dir.source}/${dir.js}" executable="java" parallel="false" failonerror="true">! <fileset dir="./${dir.source}/">! <include
name="**/${dir.js}/*.js"/>! <exclude name="**/*.min.js"/>! <exclude name="${dir.intermediate}/**/*.js"/>! <exclude name="**/${dir.js.libs}/"/>! <exclude name="**/${dir.publish}/"/>! </fileset>! <arg value="-jar" />! <arg path="./${dir.build.tools}/${tool.rhino}" />! <arg path="./${dir.build.tools}/${tool.jshint}" />! <srcfile/>! <arg value="${tool.jshint.opts}" />! </apply>! <echo>JSHint Successful</echo>! </target>!
<target name="jshint">! <apply dir="${dir.source}/${dir.js}" executable="java" parallel="false" failonerror="true">! <fileset dir="./${dir.source}/">! <include
name="**/${dir.js}/*.js"/>! <exclude name="**/*.min.js"/>! <exclude name="${dir.intermediate}/**/*.js"/>! <exclude name="**/${dir.js.libs}/"/>! <exclude name="**/${dir.publish}/"/>! </fileset>! <arg value="-jar" />! <arg path="./${dir.build.tools}/${tool.rhino}" />! <arg path="./${dir.build.tools}/${tool.jshint}" />! <srcfile/>! <arg value="${tool.jshint.opts}" />! </apply>! <echo>JSHint Successful</echo>! </target>!
CODEKIT PREPROS HAMMERforMAC LIVERELOAD MIXTURE £ £ £ £ free
None
None
None
None
{! "name": "new-project",! "version": "0.0.1" }
{! "name": "new-project",! "version": "0.0.1" }
"devDependencies": {! "grunt": "~0.4.1"! } , {! "name": "new-project",! "version":
"0.0.1" ! }
Shell functions. Make it so! .bashrc / .zshrc function gi(){!
! npm install --save-dev grunt-"$@"! }! ! function gci(){! ! npm install --save-dev grunt-contrib-"$@"! }!
None
}; grunt.initConfig({ }); grunt.registerTask('default' module.exports = function(grunt) { );
}; grunt.initConfig({ }); grunt.registerTask('default' module.exports = function(grunt) { ); grunt.loadNpmTasks('grunt-contrib-jshint');
}; grunt.initConfig({ }); grunt.registerTask('default' module.exports = function(grunt) { ); grunt.loadNpmTasks('grunt-contrib-jshint');
jshint: {! options: { jshintrc: '.jshintrc' },! all: ['**/*.js']! }
}; grunt.initConfig({ }); grunt.registerTask('default' module.exports = function(grunt) { ); grunt.loadNpmTasks('grunt-contrib-jshint');
jshint: {! options: { jshintrc: '.jshintrc' },! all: ['**/*.js']! } {! "bitwise": true,! "camelcase": true,! "curly": true,! "eqeqeq": true,! "forin": true,! "immed": true,! "indent": 4,! "browser": true,! "jquery": true,! "white": false! }
}; grunt.initConfig({ }); grunt.registerTask('default' module.exports = function(grunt) { ); grunt.loadNpmTasks('grunt-contrib-jshint');
jshint: {! options: { jshintrc: '.jshintrc' },! all: ['**/*.js']! } {! "bitwise": true,! "camelcase": true,! "curly": true,! "eqeqeq": true,! "forin": true,! "immed": true,! "indent": 4,! "browser": true,! "jquery": true,! "white": false! } , ['jshint'] task name task list
}; grunt.initConfig({ }); grunt.registerTask('default' module.exports = function(grunt) { ); grunt.loadNpmTasks('grunt-contrib-jshint');
jshint: {! options: { jshintrc: '.jshintrc' },! all: ['**/*.js']! } , ['jshint' ] grunt.loadNpmTasks('grunt-contrib-uglify'); uglify: {! options: { compress: { unsafe: false } },! dist: {! options: {! banner: '/*! <%= pkg.name %> - v<%= pkg.version %> - ' +! '<%= grunt.template.today("yyyy-mm-dd") %> */\n',! }, ! src: '<%= scripts %>',! dest: paths.min! } , ,'uglify'
}; grunt }); module grunt jshint options all } grunt
uglify: {! options: { compress: { unsafe: false } },! dist: {! options: {! banner: '/*! <%= pkg.name %> - v<%= pkg.version %> - ' +! '<%= grunt.template.today("yyyy-mm-dd") %> */\n',! }, ! src: '<%= scripts %>',! dest: paths.min! } , var pkg = grunt.file.readJSON('package.json'); var scripts = ['assets/**/*.js', '!**/*.min.js'] grunt.registerTask('default' ); , ['jshint' ] ,'uglify'
Globbing! Make it so! var scripts = ['assets/**/*.js', '!**/*.min.js'] all
.js files INC sub directories ! negates the pattern match more : https://github.com/cowboy/node-globule
}; grunt }); module grunt.loadNpmTasks('grunt-contrib-jshint'); jshint options all } grunt.loadNpmTasks('grunt-contrib-uglify');
uglify options dist }, ! } , grunt.registerTask('default' ); , ['jshint' ] ,'uglify'
matchdep. Make it so! require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);
}; grunt.initConfig({ }); grunt.registerTask('default' module.exports = function(grunt) { ); jshint:
{! options: { jshintrc: '.jshintrc' },! all: ['**/*.js']! } , ['jshint'] uglify: {! options: { compress: { unsafe: false } },! dist: {! options: {! banner: '/*! <%= pkg.name %> - v<%= pkg.version %> - ' +! '<%= grunt.template.today("yyyy-mm-dd") %> */\n',! }, ! src: '<%= scripts %>',! dest: paths.min! } , require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);
None
configGrunt = function (grunt) { ! ! var taskConfig =
{! /* ALL THE GRUNT TASK CONFIGURATION */! }! ! grunt.initConfig(taskConfig);! ! grunt.registerTask('default', ['jshint', 'uglify', 'concat']});! grunt.registerTask('build', ['jshint', 'uglify', 'concat', 'S3', 'groc']});! ! }! ! module.exports = configGrunt;
YOU’RE GONNA SEE SOME SERIOUS S**T
50,000 +
1000+
None
+
Sass LESS CoffeeScript TypeScript Jade markdown
None
None
None
None
None
npm install -g grunt-init git clone https://github.com/gruntjs/grunt-init-gruntplugin.git ~/.grunt-init/gruntplugin grunt-init TEMPLATENAME
None
None
None
None
CONFIG {or} SCRIPT CONSISTENT COMMUNITY POWERFUL
USE <3 AUTOMATION PEEK @ GRUNTFILES CONTRIBUTE
niceagency.co.uk
SHAUN DUNNE SHAUN DUNNE @shaundunne || +shaundunne || github.com/shaundune www.shaundunne.com