Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
LT駆動開発 01 gulp入門にもならない何か
Search
Kazuya Matsubara
March 01, 2014
Technology
2
500
LT駆動開発 01 gulp入門にもならない何か
LT駆動開発 #01で発表したLT資料です。
発表時の序盤の出落ちネタは公開するのに問題あるため、削除しております。
Kazuya Matsubara
March 01, 2014
Tweet
Share
More Decks by Kazuya Matsubara
See All by Kazuya Matsubara
LT駆動開発09 - Creative Commonsについてゆる〜く調べてみた
torokun
1
720
すごい合同勉強会2014 in 広島 懇親会LT
torokun
0
440
LT駆動開発08 - 無限のディスク領域を手に入れよう(妄想編)
torokun
0
94
やめよう「なるはや」
torokun
1
170
DevLOVE広島 第1回 その改善いつするの?
torokun
0
790
LT駆動開発04 5分では分からないTypeScriptのなんとか
torokun
0
980
LT駆動開発 03 写真を趣味にしてから学んだこと
torokun
0
640
LT駆動開発 02 一発ネタ
torokun
0
980
Other Decks in Technology
See All in Technology
あなたの知らない Function.prototype.toString() の世界
mizdra
PRO
2
310
Platform Engineering for Software Developers and Architects
syntasso
1
520
Flutterによる 効率的なAndroid・iOS・Webアプリケーション開発の事例
recruitengineers
PRO
0
120
障害対応指揮の意思決定と情報共有における価値観 / Waroom Meetup #2
arthur1
5
490
RubyのWebアプリケーションを50倍速くする方法 / How to Make a Ruby Web Application 50 Times Faster
hogelog
3
950
Lambda10周年!Lambdaは何をもたらしたか
smt7174
2
130
B2B SaaSから見た最近のC#/.NETの進化
sansantech
PRO
0
920
Engineer Career Talk
lycorp_recruit_jp
0
190
SRE×AIOpsを始めよう!GuardDutyによるお手軽脅威検出
amixedcolor
0
200
LINEヤフーにおけるPrerender技術の導入とその効果
narirou
1
120
テストコード品質を高めるためにMutation Testingライブラリ・Strykerを実戦導入してみた話
ysknsid25
7
2.7k
データプロダクトの定義からはじめる、データコントラクト駆動なデータ基盤
chanyou0311
2
350
Featured
See All Featured
Site-Speed That Sticks
csswizardry
0
33
XXLCSS - How to scale CSS and keep your sanity
sugarenia
246
1.3M
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
33
1.9k
A Philosophy of Restraint
colly
203
16k
How To Stay Up To Date on Web Technology
chriscoyier
788
250k
Optimising Largest Contentful Paint
csswizardry
33
2.9k
How to Ace a Technical Interview
jacobian
276
23k
The Language of Interfaces
destraynor
154
24k
Music & Morning Musume
bryan
46
6.2k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
226
22k
Building Better People: How to give real-time feedback that sticks.
wjessup
364
19k
What's in a price? How to price your products and services
michaelherold
243
12k
Transcript
gulp入門にもならない何か LT駆動開発01 LT です Mar, 1st 2014 松原和也
自己紹介 beatmania IIDX DanceDanceRevolu>on REFLEC BEAT jubeat
DanceEvolu>on などをほどほどに • 松原和也 • TwiFer : @Toro_kun • 趣味 – 音ゲー
さて
gulpとは • Node.jsで動くビルドシス テム • 「ガルプ」と読む(当社調べ) • 「ごくごく飲む」という意味
node.js …
アンケート
node.js
node.js 聞いたことある人!
node.js 聞いたことある人! 知ってる人!
node.js 聞いたことある人! 知ってる人! 使ったことある人!
node.jsとは hFp://nodejs.jp/index.html
Googleが開発するオープンソース のJIT Virtual Machine型の JavaScript実行エンジン V8を搭載
JavaScriptが動くのは何もブラウザ だけではないのです。
サーバサイドのサーバプログラム として動かせるのです
JavaScriptには Threadという概念がないのです。 その代わりコールバックという概念 があるのです。
JavaScriptを用いた Non-‐blocking I/O環境 「イベントループ」に強い
さて、話を戻して
gulpとは • Node.jsで動くビルドシス テム • 「ガルプ」と読む(当社調べ) • 「ごくごく飲む」という意味
gulp -‐ビルドシステム-‐ • The streaming build system • Makefileみたいなもの
ビルドシステムとは
ここにファイルがあるじゃろ? ( ^ω^) ⊃[ファ][イル]⊂
これを ( ^ω^) ⊃)[フ][イ](⊂
こうして ( ^ω^) ≡⊃⊂≡
こうじゃ… ( ^ω^) ⊃『リリースモジュール』⊂
The streaming build system
流れるようにビルド できる
流れるように???
Shellのパイプのように 処理の出力を 次の処理の入力と することができる
一例
LESSファイルをコンパイルしてCSSファイ ルにする場合 gulp.task(‘less’, func>on() {
gulp.src(‘public/less/**/*.less’) .pipe(less()) .pipe(gulp.dest(‘public/ stylesheets’)); });
LESSファイルをコンパイルしてCSSファイルにする場合 // lessファイルを読み込む gulp.src(‘public/less/**/*.less’)
// 読み込んだファイルをCSSにコンパイル .pipe(less()) // ディレクトリに出力 .pipe(gulp.dest(‘public/stylesheets’));
gulpの使い方の説明やイ ンストール方法は こちらが参考になります hFp://goo.gl/w7Z7YB hFp://goo.gl/2cWYrP
以上、 ありがとうございました。