Upgrade to Pro — share decks privately, control downloads, hide ads and more …

b-html 〜怒りのテンプレート〜

9890843c055488de704d85ef1ae1b893?s=47 bouzuya
August 30, 2015
210

b-html 〜怒りのテンプレート〜

2015-08-30 の ng-kyoto Angular Meetup #2 ( http://ng-kyoto.connpass.com/event/17663/ ) での LT 資料の PDF 版です。

HTML 版は次の URL (暫定)
https://ng-kyoto-2-b-html.herokuapp.com/

9890843c055488de704d85ef1ae1b893?s=128

bouzuya

August 30, 2015
Tweet

Transcript

  1. b - h t m l 怒りのテンプレー ト bouzuya 0

  2. ぼくのこと

  3. b o u z u y a twitter.com/bouzuya github.com/bouzuya

  4. もっと b o u z u y a

  5. ( 神戸|FaithCreates Inc.|RALLY|Hubot| ぼうず) の bouzuya rallyapp.jp

  6. RALLY → CoffeeScript + AngularJS

  7. しつもん

  8. A n g u l a r J S のテンプレート

    どうしていますか?
  9. m o d u l e . e x p

    o r t s = c o n t r o l l e r : c l a s s C o n t r o l l e r @ $ i n j e c t : [ ] c o n s t r u c t o r : - > c o n t r o l l e r A s : ' c ' s c o p e : { } t e m p l a t e U r l : ' m e s s a g e . h t m l ' # t e m p l a t e : ' ' ' # < p > < s p a n n g - b i n d = " c . m e s s a g e " > < / s p a n > < / p > # ' ' '
  10. HTML Jade Slim Haml

  11. RALLY → HTML

  12. 例 < m y - s p e c i

    a l - d i r e c t i v e m e s s a g e = " ' H e l l o , n g - k y o t o ! ' " > < / m y - s p e c i a l - d i r e c t i v e >
  13. 冗長じゃね?(おこ

  14. ぼくは CoffeeScript ユー ザー ( もはや利点はオフサイドルー ル)

  15. こちとら } ) ; さえ許せねえ!

  16. H T M L やめよう!

  17. 他の選択肢は…… Jade → 文法が……。 Haml, Slim → クライアントサイドで?? テンプレー トエンジン不要

    もっとシンプルなものを!
  18. 諦め→ つくろう

  19. つくった

  20. b - h t m l

  21. b-html.org

  22. b-html = HTML + オフサイドルー ル

  23. これが < p @ c l a s s u

    s e r < s p a n @ c l a s s u s e r - n a m e @ n g - b i n d c . u s e r . n a m e
  24. こうなる < p c l a s s = "

    u s e r " > < s p a n c l a s s = " u s e r - n a m e " n g - b i n d = " c . u s e r . n a m e " > < / s p a n > < / s p a n > (formatted)
  25. いいとこ オフサイドルー ル < / x x x > も

    = " " も不要 表記ブレしない
  26. マンメンミ!( ナイス)

  27. ツールとか

  28. Atom, Vim → あるよ CLI, gulp, browserify → あるよ Emacs,

    WebStorm, webpack → カモン Mithril, React 対応→ いま進めてる
  29. 機能要望、 ここがゴミ、 ダサい…… → 歓迎! 元気いっぱい 0.x!!

  30. ター ゲット: AngularJS, Vue.js のテンプレー ト → The ニッチ。 まず使ってほしい(

    切実)
  31. ぜひ試してください! → b-html.org

  32. おしまい