際際滷

際際滷Share a Scribd company logo

Integrating grunt and bower with maven

Download as PPTX, PDF
Rahul Nanwani
Rahul Nanwani

This document discusses integrating front-end tools like Grunt and Bower with build tools like Maven to improve the front-end development workflow for Java web apps. It outlines how Maven currently uses plugins like wro4j for tasks like JavaScript minification and CSS compilation. Grunt and Bower are proposed as alternatives that offer more tasks and easier setup than wro4j. Integrating Grunt and Bower through shell commands makes them extensible to work with various build tools like Maven. Example setup and code for both development and production environments using Maven will be shared.

1 of 6
grunt + bower + mvn For A Better Front-End Workflow for Java Web Apps
Objective To see how integrating modern front end workflow tools like grunt and bower with other build tools can ease development and deployment. Maven (with wro4j plugin) has been used as an example but the idea can be extended to other build tools.
mvn Maven - A tool used for building and managing Java-based projects. Alternatives ant, gradle Uses plugins for front-end tasks o wro4j (JS/CSS file grouping/minification/uglification, lint etc.) o less4j (Less to CSS) o wro4j extensions for Sass, Google Closure, CoffeeScript etc.
grunt bower JS task runner to automate repetitive tasks Examples - JS compression/min, Less compilation, CSS min, image optimization, JS lint etc. Everything that wro4j does + a LOT more!! Front-End package manager Easy version management, no need to check in libraries http://bower.io/ http://gruntjs.com/
Advantages Easier setup from changing a few files (wro4j) to a few lines (grunt) Grunt is JS developer friendly A lot more variety of tasks with grunt Performance improvement o moving tasks like RequireJS project compilation/min, Less compliation/min saves atleast 5-10 seconds (V8 vs Rhino) Move away from Eclipse (or other IDEs) to your favorite editor in development environment Integration based on shell command execution (both bower and grunt) easily extensible to other build tools.
Setup & Code Setup and code for both development and production environment deployment will be made available in the final presentation and also on github. Maven will be used as an example

More Related Content

Integrating grunt and bower with maven

  • 1. grunt + bower + mvn For A Better Front-End Workflow for Java Web Apps
  • 2. Objective To see how integrating modern front end workflow tools like grunt and bower with other build tools can ease development and deployment. Maven (with wro4j plugin) has been used as an example but the idea can be extended to other build tools.
  • 3. mvn Maven - A tool used for building and managing Java-based projects. Alternatives ant, gradle Uses plugins for front-end tasks o wro4j (JS/CSS file grouping/minification/uglification, lint etc.) o less4j (Less to CSS) o wro4j extensions for Sass, Google Closure, CoffeeScript etc.
  • 4. grunt bower JS task runner to automate repetitive tasks Examples - JS compression/min, Less compilation, CSS min, image optimization, JS lint etc. Everything that wro4j does + a LOT more!! Front-End package manager Easy version management, no need to check in libraries http://bower.io/ http://gruntjs.com/
  • 5. Advantages Easier setup from changing a few files (wro4j) to a few lines (grunt) Grunt is JS developer friendly A lot more variety of tasks with grunt Performance improvement o moving tasks like RequireJS project compilation/min, Less compliation/min saves atleast 5-10 seconds (V8 vs Rhino) Move away from Eclipse (or other IDEs) to your favorite editor in development environment Integration based on shell command execution (both bower and grunt) easily extensible to other build tools.
  • 6. Setup & Code Setup and code for both development and production environment deployment will be made available in the final presentation and also on github. Maven will be used as an example