はてな教科書JavaScript編

Kyoto.js 11で発表した資料です

Transcript

1. id:amagitakayosi
   はてな教科書
   

   View Slide

2. id:amagitakayosi
   はてなブログチー
   ム
   Kyoto.js
   主催
   

   View Slide

3. はてな教科書
   

   View Slide

4. はてな教科書
   はてなインター
   ンで利用されている
   内容
   Perl, Scala, JS, Swift
   MySQL
   基礎
   WAF
   

   View Slide

5. JavaScript
   講師やりました
   教科書のリニュー
   アルしました
   

   View Slide

6. はてなインター
   ン
   一ヶ月で講義から本番機能リリー
   スまで
   前半:
   講義と実習
   後半:
   チー
   ムに配属されて開発
   

   View Slide

7. 前半の時間割
   講義: 2
   時間
   実習: 5
   時間
   

   View Slide

8. つまり
   2
   時間 で
   「
   サー
   ビス開発できる最低限のJS」
   を
   教えないといけない
   

   View Slide

9. とはいえ
   古いJS
   のバッドノウハウとか教えたくない
   ES2016
   対応したい
   とか書いてほしくない
   

   View Slide

10. 社内プロジェクトの様子
    最近のプロジェクトは TypeScript or Babel
    どのチー
    ムも gulp
    とか使ってる
    Angular, React, Vue
    →
    配属後、 ES5
    で頑張る必要はない
    

    View Slide

11. 要件
    チー
    ムに配属されても仕事できる
    JavaScript
    未経験でも OK
    ES2015
    対応
    Node.js & npm
    対応
    フレー
    ムワー
    クにもちょっと触れる
    

    View Slide

12. できました
    講義前日まで加筆してた
    

    View Slide

13. やったこと
    従来の教科書をブラッシュアップ
    章ごとに分割
    GitBook
    で表示できるように
    

    View Slide

14. ブラッシュアップ
    2008
    年から少しずつ進化
    古びた情報ある
    不正確な情報ある
    2000
    行のmarkdown
    ファイル1
    枚
    

    View Slide

15. ES2016
    に準拠
    今年は2016
    年なので
    Symbol
    型が増えたり
    Template Literal
    が増えたり
    

    View Slide

16. ガンガンいこうぜ
    

    View Slide

17. MV*
    フレー
    ムワー
    クについて
    社内で使われてる奴を紹介
    jQuery
    でペー
    ジ作る時の方針も
    困ったら参照できるように
    

    View Slide

18. Node.js, npm
    に言及
    インストー
    ルから まで
    講義では使わないが、
    後半で使うかも
    

    View Slide

19. 気をつけたところ
    「～
    かも」
    はなるべく使わない
    仕様について書くときは出典をあたる
    資料作ってたはずが、
    仕様読んでたら一日
    終わった
    

    View Slide

20. GitBook
    を採用
    Markdown
    でオンライン書籍つくれるサー
    ビス
    azu_re
    さんの資料
    gitbook.com
    で配信までしてくれる
    

    View Slide

21. Markdown
    で書かれてるようす
    

    View Slide

22. GitHub Pages
    で公開
    ドメインがかっこいい
    GitBook.com
    に登録不要
    修正の度にビルド & push
    が必要
    

    View Slide

23. 公開
    

    View Slide

24. Pullreq
    きてる様子
    

    View Slide

25. 振り返り
    概ね好評
    モダンな内容を盛り込めた
    Promise
    の扱い等、
    教えきれない
    質問の半分が Promise
    

    View Slide

26. 今後の運用
    CI
    導入したい
    サンプルコー
    ドがちゃんと動くかテスト
    ビルド自動化
    textlint
    

    View Slide

27. 今後の講義
    もっと実践的な内容に寄せる？
    講義時間を増やす？？？？
    フロントエンドコー
    ス欲しい（
    放言）
    

    View Slide

28. 完
    株式会社はてなでは
    若者の育成や社外への情報共有に
    オー
    プンなエンジニアを
    募集しています！！！！
    

    View Slide