bittorrent techtalks_yeoman_021113
DESCRIPTION
A short overview of Yeoman for front-end workflow.TRANSCRIPT
![Page 1: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/1.jpg)
TECH TALKSYeoman-powered web development | Patrick Williams
BitTorrent, Inc / 2013 Tech Talks 01
http://yeoman.io
Monday, February 11, 13
![Page 2: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/2.jpg)
BitTorrent, Inc / 2013 Tech Talks
INTRODUCTION
02
Everyone have Yeoman installed yet?
‘yeoman--help’
GOAL?
Monday, February 11, 13
![Page 3: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/3.jpg)
BitTorrent, Inc / 2013 Tech Talks
WHAT DO YOU GET FOR FREE?
03
Project scaffolding
Package manager
Auto-reloading
Automated testing/linting
Fancy compression/build stuffs
Monday, February 11, 13
![Page 4: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/4.jpg)
BitTorrent, Inc / 2013 Tech Talks 06BitTorrent, Inc / 2013 Tech Talks
SHOULDERS OF GIANTS
04
Monday, February 11, 13
![Page 5: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/5.jpg)
BitTorrent, Inc / 2013 Tech Talks
‘YEOMAN INIT’
05
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’
Monday, February 11, 13
![Page 6: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/6.jpg)
BitTorrent, Inc / 2013 Tech Talks
HIDES THE UGLY
06
<!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]-->
Monday, February 11, 13
![Page 7: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/7.jpg)
BitTorrent, Inc / 2013 Tech Talks
‘YEOMAN TEST’
07
Look in ‘test/index.html’
Jasmine vs. Mocha?
Grunt task using phantomjs
Monday, February 11, 13
![Page 8: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/8.jpg)
BitTorrent, Inc / 2013 Tech Talks 08
(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?
});
});
});
})();
Monday, February 11, 13
![Page 9: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/9.jpg)
BitTorrent, Inc / 2013 Tech Talks
‘YEOMAN SERVER’
09
Crack open another terminal window...this can just stay open
Let’s take this opportunity to fix the bootstrap <link>
Monday, February 11, 13
![Page 10: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/10.jpg)
BitTorrent, Inc / 2013 Tech Talks
‘YEOMAN INSTALL’
10
Defers to Bower
Tinyurl for git repos... just dumps them into a directory
Monday, February 11, 13
![Page 11: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/11.jpg)
BitTorrent, Inc / 2013 Tech Talks 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”
Monday, February 11, 13
![Page 12: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/12.jpg)
BitTorrent, Inc / 2013 Tech Talks
BROWSER
12
Did it work?
Is ‘_’ available yet?
Did you have to reload?
Monday, February 11, 13
![Page 13: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/13.jpg)
BitTorrent, Inc / 2013 Tech Talks
DEPLOYMENT... WHATTODO?
13
Images compression
Minification
Concatenation
Closure compiler?
Monday, February 11, 13
![Page 14: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/14.jpg)
BitTorrent, Inc / 2013 Tech Talks
SHOULDN’T HAVE TO HOME ROLL!
14
‘yeoman build’
Monday, February 11, 13
![Page 15: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/15.jpg)
BitTorrent, Inc / 2013 Tech Talks
DOES THE BUILT VERSION WORK?
15
‘yeoman server:dist’*Still does reloads on your built files... try rebuilding*
Monday, February 11, 13
![Page 16: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/16.jpg)
BitTorrent, Inc / 2013 Tech Talks
GITHUB PAGES (DETOUR)
16
Just use the gh-pages for static file serving!
Stuff your ‘dist’ directory into your gh-pages branch
Monday, February 11, 13
![Page 17: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/17.jpg)
BitTorrent, Inc / 2013 Tech Talks
GH PAGES AS A SUB-MODULE?
17
‘git add submodule -b gh-pages [email protected] site’
WARNING! Can’t use dist as submodule location because .git files will be deleted during build
(Still detouring)
Monday, February 11, 13
![Page 18: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/18.jpg)
BitTorrent, Inc / 2013 Tech Talks 19
ROUND TRIP COMPLETE!QUESTIONS?
Monday, February 11, 13
![Page 19: BitTorrent TechTalks_yeoman_021113](https://reader034.vdocuments.net/reader034/viewer/2022042521/547d5a26b379596a2b8b5276/html5/thumbnails/19.jpg)
BitTorrent, Inc / 2013 Tech Talks
OTHER YEOMAN TIDBITS
20
Alternate Yeoman project generators (chrome extension, etc)
Additional grunt tasks?
.bowerre (change where your ‘components’ folder is placed
Monday, February 11, 13