Successfully reported this slideshow.

JavaScript + Jenkins = Winning!

88

Share

Loading in …3
×
1 of 55
1 of 55

More Related Content

Related Books

Free with a 14 day trial from Scribd

See all

JavaScript + Jenkins = Winning!

  1. 1. © 2011 @eriwen
  2. 2. Eric Wendelin Blog: eriwen.com Twitter: @eriwen Code: git.io/eric
  3. 3. ( °□° ɐpuǝƃV • Tools that help your JS not suck • How to create a build for your client-side code • Automation with Jenkins • The hard part • Unicorns
  4. 4. The Situation
  5. 5. Programmers are expensive Must prevent them from doing things below their pay grade
  6. 6. How do you do that? Automate tasks that don't require mental participation
  7. 7. Programmers are clever Must force them to write code for the next engineer
  8. 8. Better for the next engineer? Must enforce conventions that make the code more understandable
  9. 9. ?
  10. 10. First things first We need automation tools
  11. 11. Static Analysis
  12. 12. JSHint jshint file.js --config config.json jshint.org
  13. 13. CSSLint csslint --rules=rule,rule2 file.css csslint.net
  14. 14. Testing
  15. 15. Unit-testing • Jasmine (pivotal.github.com/jasmine) • QUnit (docs.jquery.com/QUnit) • YUI Test (yuilibrary.com/yui/docs/test) • Mocha (visionmedia.github.com/mocha) • Lots of others...
  16. 16. PhantomJS phantomjs your-runner.js file.html phantomjs.org
  17. 17. Xvfb
  18. 18. JsTestDriver java -jar JsTestDriver.jar --tests all code.google.com/p/js-test-driver/
  19. 19. Functional testing • Selenium (seleniumhq.org) • CasperJS (github.com/n1k0/casperjs) • zombie.js (zombie.labnotes.org)
  20. 20. Documentation
  21. 21. jsduck jsduck src/js --output target/docs github.com/senchalabs/jsduck
  22. 22. Page Speed
  23. 23. Closure Compiler java -jar compiler.jar --js file.js --js_output_file file.min.js code.google.com/closure/compiler
  24. 24. YUI Compressor java -jar yuicompressor.jar -o '.css$:-min.css' *.css developer.yahoo.com/yui/compressor
  25. 25. Combine and gzip cat file1.js file2.js >> combined.js gzip combined.js mv combined.js{.gz,}
  26. 26. ?
  27. 27. The Build
  28. 28. Build Steps • Static Analysis • File Optimization (for production) • Automated Testing • Documentation • Report Results
  29. 29. Gradle
  30. 30. Don't have a build?
  31. 31. html5boilerplate.com
  32. 32. Introducing the Gradle Web Suite
  33. 33. git.io/gradlejs git.io/gradlecss git.io/gradlehtml
  34. 34. jenkins-ci.org
  35. 35. Crazy Simple Setup wget http://mirrors.jenkins- ci.org/war/latest/jenkins.war java -jar jenkins.war
  36. 36. Source Control Plugins • Git • Mercurial • Bazaar • Subversion • CVS • Lots more...
  37. 37. Build System Plugins • Gradle • Maven • Ant • Rake • Lots more...
  38. 38. Runs pretty much everything • Ruby • Python • NodeJS • Groovy • Shell • Lots more...
  39. 39. Build Health Plugins • Violations Plugin • Selenium Plugin • Cobertura Plugin • Task Scanner Plugin • ...and, of course, Chuck Norris Plugin
  40. 40. The really hard part
  41. 41. 5 Stages of JS CI • No build server • Pulls from source control and runs metrics • Runs unit tests and fails build if necessary. One button push to staging/production env • Unit and acceptance tests run. Metrics affect build stability • Code deployed on every push that passes the build
  42. 42. Helpful Tweeters @ariyahidayat works on #phantomjs @gseguin helped me with QUnit/Phantom @builddoctor general CI advocate/guru @jfroma does cool #jsci on Windows @jamescarr could've given this talk well
  43. 43. One more thing...
  44. 44. LCOV to Cobertura converter git.io/ltc
  45. 45. Code at: git.io/eric Blog: eriwen.com Twitter: @eriwen

×