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: The JavaScript Task Runner
Search
Sebastiaan Deckers
February 25, 2013
Programming
8
400
Grunt: The JavaScript Task Runner
Slides for my talk at Front-end Developers User Group (Singapore)
Sebastiaan Deckers
February 25, 2013
Tweet
Share
More Decks by Sebastiaan Deckers
See All by Sebastiaan Deckers
Commons Host: Building a CDN for the rest of the world
sebdeckers
1
130
SVG Reality
sebdeckers
5
140
About Sebastiaan
sebdeckers
0
150
Frontend 100
sebdeckers
1
490
Frontend 101
sebdeckers
4
550
Frontend 102
sebdeckers
3
490
Frontend 103
sebdeckers
2
490
Frontend Testing
sebdeckers
3
340
Other Decks in Programming
See All in Programming
複数ドメインに散らばってしまった画像…! 運用中のPHPアプリに後からCDNを導入する…!
suguruooki
0
440
Go1.24 go vetとtestsアナライザ
kuro_kurorrr
2
700
PHPのガベージコレクションを深掘りしよう
rinchoku
0
250
コンテナでLambdaをデプロイするときに知っておきたかったこと
_takahash
0
160
安全に倒し切るリリースをするために:15年来レガシーシステムのフルリプレイス挑戦記
sakuraikotone
5
2.5k
フロントエンドテストの育て方
quramy
11
2.7k
Boost Your Performance and Developer Productivity with Jakarta EE 11
ivargrimstad
0
360
AI Agents with JavaScript
slobodan
0
170
Firebase Dynamic Linksの代替手段を自作する / Create your own Firebase Dynamic Links alternative
kubode
0
190
自分のために作ったアプリが、グローバルに使われるまで / Indie App Development Lunch LT
pixyzehn
1
130
Modern Angular:Renovation for Your Applications @angularDays 2025 Munich
manfredsteyer
PRO
0
150
なぜselectはselectではないのか
taiyow
2
310
Featured
See All Featured
Faster Mobile Websites
deanohume
306
31k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
GraphQLの誤解/rethinking-graphql
sonatard
70
10k
Fireside Chat
paigeccino
37
3.3k
Site-Speed That Sticks
csswizardry
4
450
For a Future-Friendly Web
brad_frost
176
9.6k
Facilitating Awesome Meetings
lara
53
6.3k
Designing for Performance
lara
606
69k
The Cult of Friendly URLs
andyhume
78
6.3k
Why Our Code Smells
bkeepers
PRO
336
57k
Measuring & Analyzing Core Web Vitals
bluesmoon
6
320
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
Transcript
The JavaScript Task Runner
What is Grunt? Grunt is like Ant, Make, Rake, SCons,
etc. but, Javascript. NPM.
build script
Automate your build So you can: ... do continuous integration,
... release to production without fear, ... work on more interesting things.
Is Grunt for me? frontend backend mixed Backbone, Ember, Angular
REST/WebSocket API Express.js
Grunt Plugins grunt-contrib: 26 and growing Community: 450+
None
Using Grunt 1. Create package.json 2. Gruntfile.js 3. Run npm
install 4. grunt [task[:target]]
package.json { "name": "hello-world", "version": "0.1.0", "dependencies": { "grunt": "~0.4.0",
"grunt-contrib-jshint": "~0.1.1", "grunt-contrib-uglify": "~0.1.1" } }
Gruntfile.js module.exports = function (grunt) { grunt.initConfig({ uglify: { build:
{ src: 'app.js', dest: 'build/app.min.js' } }, jshint: { all: ['**/*.js'] } }); grunt.loadNpmTasks('grunt-contrib-uglify'); grunt.loadNpmTasks('grunt-contrib-jshint'); grunt.registerTask('default', ['jshint', 'uglify']); };
Have it your way Declarative Imperative
Demo
Poor Man's CI $ sudo -i # crontab -e */5
* * * * cd /var/www/myapp.com && git reset --hard && git pull origin master && npm install && npm test && grunt
I am Sebastiaan I email
[email protected]
I blog ninja.sg I
work cf.sg I code git.io/seb