Getting Started Yeoman

Transcript

1. Getting Started Yeoman
2. はじめに 今日は「入門」です。 とりあえずYeomanを使うところを、デモ中心に見 せれたらいいなと思います。
3. はじめに Nodeインストール済で npmコマンドが使える環境を前提とします。
4. What is Yeoman? 1. 〈英〉〔12～15世紀の〕召使い、従僕◆自由民の 資格を持つ貴族の召使い。 2. 〈英〉〔15世紀の〕ヨーマン、独立自営農民、自由 農民、自作農
7. THE WEB'S SCAFFOLDING TOOL FOR MODERN WEBAPPS
8. 株式会社LIG 『「scaffold？ 何それ？」って言ったら笑わ れた』 http://liginc.co.jp/programmer/archives/555 scaffold？
9. scaffold？ Webアプリケーションのひな形となるソースコード を自動生成
10. やること > npm install -g yo grunt-cli bower > npm install -g generator-webapp > mkdir webapp && cd $_ > yo webapp > grunt serve
11. デモ うまくできるといいな
12. generators... • Web App (今デモったやつ) • AngularJS • Backbone • Ember • Polymer • Jasmine • Mocha • Karma • Chrome Apps Basic Boilerplate • Chrome Extension Boilerplate
13. AngularJS style > npm install -g generator-angular > mkdir angular && cd $_ > yo angular > grunt serve
14. AngularJS style > yo angular:route myroute > yo angular:controller user > yo angular:view user > yo angular:directive myDirective > yo angular:service myService
15. デモ うまくできるといいな
16. Backbone style > npm install -g generator-backbone > mkdir backbone && cd $_ > yo backbone > grunt serve
17. Backbone style > yo backbone:model blog > yo backbone:collection blog > yo backbone:router blog > yo backbone:view blog
18. デモ 時間があったら
19. はまったとこ • compassがエラー吐きまくる... • compassとsassの相性が問題らしい • compassとsassをgemでinstallしなおす • とりあえず以下バージョンで動作確認済 ◦ compass 0.12.2 ◦ sass 3.2.12 • http://javascript-memo2.seesaa.net/article/38459314 1.html
20. 感想 • とにかく簡単 • AngularJSとかBackboneの知識が浅くてもコマンドさえ覚 えちゃえばベースは作れそう • Gruntfileを自動で作ってくれるのとてもありがたい • 最初からGruntfileが機能モリモリで生成されるからある程 度の知識がないと何やってるか全然分かんないと思う（まあ 分かんなくても作れるけど） • “volo”っていう似たツールも気になるところ
21. リンク • yeoman official site ◦ http://yeoman.io/ • yeoman-generator ◦ https://github.com/yeoman/generator
22. ご清聴ありがとうございます。
23. What is volo? • https://github.com/volojs/volo