• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Grunt training deck
 

Grunt training deck

on

  • 6,198 views

A brief talk introducing Grunt as a task management option for the development team.

A brief talk introducing Grunt as a task management option for the development team.

Statistics

Views

Total Views
6,198
Views on SlideShare
5,814
Embed Views
384

Actions

Likes
0
Downloads
1
Comments
0

6 Embeds 384

http://www.psyked.co.uk 325
http://188.226.254.62 27
http://blog.psyked.co.uk 16
http://feedly.com 12
http://imagesizer.psyked.co.uk 3
http://mmtdigital.sitebeam.co.uk 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Grunt training deck Grunt training deck Presentation Transcript

    • Introduction ➔ ➔ ➔ ➔ Grunt is a workflow / task automation tool. Built on top of Node.js. Primary focus is web development. Awesome range of plugins.
    • A workflow / task automation tool Build automation is the act of scripting or automating a wide variety of tasks that software developers do in their day-to-day activities including things like: ● compiling computer source code into binary code ● packaging binary code ● running tests ● deployment to production systems ● creating documentation and/or release notes
    • Built on top of It’s better than… ● Shell scripts / Batch files ● ANT ● Rake ➔ It’s written in JavaScript, and we all know that. ➔ It’s modular, and manages its own dependencies in a clean, source-control friendly way.
    • Focus is on web development
    • Enough talk. Show me some magic.
    • Let’s see what we can do with Grunt: http://bit.ly/19A7Vq7
    • This is cool, and it’s flexible. We can make it work with PHP/.NET
    • How did we achieve that? Plugins.
    • Plugins grunt-contrib-watch Watch filesystem for changes grunt-file-creator Create arbitrary files grunt-contrib-connect Start a simple web server grunt-text-replace Replace text in files grunt-open Launch a browser grunt-git-describe Get tags from Git grunt-contrib-concat Concatenate files grunt-contrib-copy Copy files grunt-contrib-sass Compile SASS files grunt-contrib-compress Create Zip/Tar/Gz files grunt-contrib-clean Empty a directory grunt-connect-rewrite Symlinks for web server assemble Generate a static website from templates grunt-karma Karma testing grunt-imageoptim Optimize images grunt-plato JS Static code analysis grunt-aws-s3 Upload/Download from AWS S3
    • Grunt does two really useful things. ➔ It ties your plugins together and runs them in a specific order. ➔ It normalises (to a certain extent) the format in which you supply options to the plugins. As an added bonus… ➔ Grunt + NPM helps manage build dependencies.
    • Time for another trick. ...installing a project from scratch.
    • Starting from scratch* ➔ Fresh directory / machine ➔ Node.js & Grunt Cli installed (but nothing more) ➔ ➔ ➔ ➔ git clone https://github.com/psyked/grunt-example-project cd grunt-example-project npm install grunt
    • What is this magic? It’s package.json
    • Introducing package.json ➔ It’s a standard part of Node.js ➔ It describes your project, including its dependencies. ➔ It gets auto-updated as you ‘install’ additional plugins for your project. ➔ Create one using npm init ➔ Auto-add dependencies by installing them with the -save-dev flag
    • Enough talk. Show me how.
    • First up, let’s get started with Grunt 1. Install Node.js 2. From the command line, run: npm install grunt-cli -g
    • Running Grunt tasks ➔ Run a default task: grunt ➔ Run a specific task: grunt taskname ➔ Run a task config: grunt taskname:config