BitTorrent TechTalks_yeoman_021113
•
0 likes•392 views
A short overview of Yeoman for front-end workflow.
Recommended
More Related Content
Similar to BitTorrent TechTalks_yeoman_021113
Similar to BitTorrent TechTalks_yeoman_021113 (20)
BitTorrent TechTalks_yeoman_021113
- 1. TECH TALKS Yeoman-powered web development | Patrick Williams http://yeoman.io BitTorrent, Inc / 2013 Tech Talks 01 Monday, February 11, 13
- 2. INTRODUCTION GOAL? Everyone have Yeoman installed yet? ‘yeoman--help’ BitTorrent, Inc / 2013 Tech Talks 02 Monday, February 11, 13
- 3. WHAT DO YOU GET FOR FREE? Project scaffolding Package manager Auto-reloading Automated testing/linting Fancy compression/build stuffs BitTorrent, Inc / 2013 Tech Talks 03 Monday, February 11, 13
- 4. SHOULDERS OF GIANTS BitTorrent, Inc / 2013 Tech Talks 04 06 Monday, February 11, 13
- 5. ‘YEOMAN INIT’ Require.js? Compass (is it sass/scss)? Bootstrap plugins? ‘app’ directory is where the magic happens ‘test’ is where more magic should happen ‘yeoman init -- help’ BitTorrent, Inc / 2013 Tech Talks 05 Monday, February 11, 13
- 6. HIDES THE UGLY <!DOCTYPE html> <!--[if lt IE 7]> <html class=”no-js lt-ie9 lt-ie8 lt-ie7”> <![endif]--> <!--[if lt IE 7]> <html class=”no-js lt-ie9 lt-ie8”> <![endif]--> <!--[if lt IE 8]> <html class=”no-js lt-ie9”> <![endif]--> <!--[if gt IE 8]><!--> <html class=”no-js”> <![endif]--> BitTorrent, Inc / 2013 Tech Talks 06 Monday, February 11, 13
- 7. ‘YEOMAN TEST’ Look in ‘test/index.html’ Jasmine vs. Mocha? Grunt task using phantomjs BitTorrent, Inc / 2013 Tech Talks 07 Monday, February 11, 13
- 8. (function() { describe(‘Give it some context’, function() { describe(‘maybe a bit more context here’, function() it(‘should run here few assertions’, function() { //YoU sHould RUn me On TRAVIS-ci? }); }); }); })(); BitTorrent, Inc / 2013 Tech Talks 08 Monday, February 11, 13
- 9. ‘YEOMAN SERVER’ Crack open another terminal window...this can just stay open Let’s take this opportunity to fix the bootstrap <link> BitTorrent, Inc / 2013 Tech Talks 09 Monday, February 11, 13
- 10. ‘YEOMAN INSTALL’ Defers to Bower Tinyurl for git repos... just dumps them into a directory BitTorrent, Inc / 2013 Tech Talks 10 Monday, February 11, 13
- 11. component.json { “dependencies”: { “underscore”: “1.4.3” Looks for git tag “v1.4.3” } } Same as package json for npm... just a different package manager. Uses ‘Semantic Versioning” BitTorrent, Inc / 2013 Tech Talks 11 Monday, February 11, 13
- 12. BROWSER Did it work? Is ‘_’ available yet? Did you have to reload? BitTorrent, Inc / 2013 Tech Talks 12 Monday, February 11, 13
- 13. DEPLOYMENT... WHATTODO? Images compression Minification Concatenation Closure compiler? BitTorrent, Inc / 2013 Tech Talks 13 Monday, February 11, 13
- 14. SHOULDN’T HAVE TO HOME ROLL! ‘yeoman build’ BitTorrent, Inc / 2013 Tech Talks 14 Monday, February 11, 13
- 15. DOES THE BUILT VERSION WORK? ‘yeoman server:dist’ *Still does reloads on your built files... try rebuilding* BitTorrent, Inc / 2013 Tech Talks 15 Monday, February 11, 13
- 16. GITHUB PAGES (DETOUR) Just use the gh-pages for static file serving! Stuff your ‘dist’ directory into your gh-pages branch BitTorrent, Inc / 2013 Tech Talks 16 Monday, February 11, 13
- 17. GH PAGES AS A SUB-MODULE? (Still detouring) ‘git add submodule -b gh-pages git@REPO.git site’ WARNING! Can’t use dist as submodule location because .git files will be deleted during build BitTorrent, Inc / 2013 Tech Talks 17 Monday, February 11, 13
- 18. ROUND TRIP COMPLETE! QUESTIONS? BitTorrent, Inc / 2013 Tech Talks 19 Monday, February 11, 13
- 19. OTHER YEOMAN TIDBITS Alternate Yeoman project generators (chrome extension, etc) Additional grunt tasks? .bowerre (change where your ‘components’ folder is placed BitTorrent, Inc / 2013 Tech Talks 20 Monday, February 11, 13