LT駆動開発 01 gulp入門にもならない何か

LT駆動開発 01 gulp入門にもならない何か

LT駆動開発 #01で発表したLT資料です。
発表時の序盤の出落ちネタは公開するのに問題あるため、削除しております。

E527d26d27a5769bbc6cdc1fa045feed?s=128

Kazuya Matsubara

March 01, 2014
Tweet

Transcript

  1. gulp入門にもならない何か   LT駆動開発01 LT です  Mar,  1st  2014   松原和也

  2. 自己紹介   beatmania  IIDX   DanceDanceRevolu>on   REFLEC  BEAT   jubeat

      DanceEvolu>on   などをほどほどに •  松原和也   •  TwiFer  :  @Toro_kun   •  趣味   – 音ゲー  
  3. さて

  4. gulpとは •  Node.jsで動くビルドシス テム •  「ガルプ」と読む(当社調べ)   •  「ごくごく飲む」という意味  

  5. node.js  …

  6. アンケート

  7. node.js            

  8. node.js     聞いたことある人!        

  9. node.js     聞いたことある人!     知ってる人!    

  10. node.js     聞いたことある人!     知ってる人!     使ったことある人!

  11. node.jsとは     hFp://nodejs.jp/index.html

  12. Googleが開発するオープンソース のJIT  Virtual  Machine型の JavaScript実行エンジン   V8を搭載

  13. JavaScriptが動くのは何もブラウザ だけではないのです。

  14. サーバサイドのサーバプログラム として動かせるのです

  15. JavaScriptには   Threadという概念がないのです。   その代わりコールバックという概念 があるのです。

  16. JavaScriptを用いた   Non-­‐blocking  I/O環境     「イベントループ」に強い

  17. さて、話を戻して

  18. gulpとは •  Node.jsで動くビルドシス テム •  「ガルプ」と読む(当社調べ)   •  「ごくごく飲む」という意味  

  19. gulp  -­‐ビルドシステム-­‐ •  The  streaming  build   system •  Makefileみたいなもの

     
  20. ビルドシステムとは

  21. ここにファイルがあるじゃろ?
 
 (  ^ω^)     ⊃[ファ][イル]⊂  

  22. これを   
 (  ^ω^)     ⊃)[フ][イ](⊂  

  23. こうして     (  ^ω^)     ≡⊃⊂≡  

  24. こうじゃ…     (  ^ω^)   ⊃『リリースモジュール』⊂

  25. The  streaming   build  system

  26. 流れるようにビルド   できる

  27. 流れるように???

  28. Shellのパイプのように   処理の出力を   次の処理の入力と   することができる

  29. 一例

  30. LESSファイルをコンパイルしてCSSファイ ルにする場合   gulp.task(‘less’,  func>on()  {        

     gulp.src(‘public/less/**/*.less’)                  .pipe(less())                  .pipe(gulp.dest(‘public/ stylesheets’));   });
  31. LESSファイルをコンパイルしてCSSファイルにする場合     //  lessファイルを読み込む   gulp.src(‘public/less/**/*.less’)      

                   //  読み込んだファイルをCSSにコンパイル                    .pipe(less())                    //  ディレクトリに出力                  .pipe(gulp.dest(‘public/stylesheets’));
  32. gulpの使い方の説明やイ ンストール方法は   こちらが参考になります     hFp://goo.gl/w7Z7YB   hFp://goo.gl/2cWYrP  

  33. 以上、   ありがとうございました。