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
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
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