ざくざくツール開発

Transcript

1. ざくざくツール開発 2015/11/25    yu0819ki@CyberZ
2. Intro. Name:    木村 幸弘 a.k.a  yu0819ki   Birthday:    1985.08.19   Age:      30   Birthplace:  北海道   Job:    Web屋   Hobby:  音ゲー、読書、作曲   MoIo:  パンが無ければ作ればいいじゃない    
3. 今回はツールを自作する話 【要件】   勉強会の発表内容を一覧化してブログ記事にする     【出力】   公開時に以下のようになるMarkdownを出力したい   hIp://engineer-­‐blog.cyber-­‐z.co.jp/entry/2015/11/19/173203     【入力】   •  発表タイトル   •  発表者   •  参加者（執筆者）の感想コメント   •  スライドまたは発表風景写真
4. テキストエディタで直接書きました •  やることは決まっていた   •  スライドと画像は先に揃えた   •  コメントは都度考えた   •  案外重複する部分が多かった   •  3時間かかった
5. テキストエディタで直接書きました •  やることは決まっていた   •  スライドと画像は先に揃えた   •  コメントは都度考えた   •  案外重複する部分が多かった   •  3時間かかった 目次作って   アンカー付けたせい 効率化しないと   業務に支障が出そう この辺を建前理由にツールを作る
6. Handlebarsでモック作りました 【仕様】   •  JSON  を  AJAX  で取ってきて  Handlebars  テンプレートにぶっこむ   •  pre  要素の中身が  Markdown  になっている   【メリット】   •  寝ぼけた頭でも書ける（よく慣れている・・・30分で組んだ）   •  jQuery  と  Handlebars  を  CDN  から取ってくれば管理ツール(  bower  とか)い らない     【デメリット】   •  改行とか  HTML  タグの入ったコメントを含む  JSON  ファイルを作るのがだる い
7. 解説
8. AngularJSで書き直しました 【仕様】   •  データをフォームから取得して  Handlebars  テンプレートにぶっこむ   •  pre  要素の中身が  Markdown  になっている   •  フォームへの入力が発生する   【メリット】   •  POST  も  GET  もしなくていい   •  書いた内容をプレビューできる     【デメリット】   •  時間がそれなりに掛かる（結局6時間くらいかかった）  
9. 解説
10. まとめ •  思いついた時にすぐ出力できる技術・手段を持っておくとよい   –  モックを作るにあたっては技術選定を極力しない   –  手癖で作る（そのために数をこなしておく）   –  エクセルでもいいし、紙とペンでもいい   •  効率が良くなったか？はKPIを置いて追いかける   –  作りたかっただけじゃねぇかと言われて終わるのは悲しすぎる   –  使われなくなるのも悲しすぎる   –  継続大事   •  成果物：hIps://github.com/yu0819ki/seminor-­‐blog-­‐generator  
11. ご清聴ありがとうございました