Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
LT駆動開発 01 gulp入門にもならない何か
Search
Kazuya Matsubara
March 01, 2014
Technology
570
2
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
LT駆動開発 01 gulp入門にもならない何か
LT駆動開発 #01で発表したLT資料です。
発表時の序盤の出落ちネタは公開するのに問題あるため、削除しております。
Kazuya Matsubara
March 01, 2014
More Decks by Kazuya Matsubara
See All by Kazuya Matsubara
LT駆動開発09 - Creative Commonsについてゆる〜く調べてみた
torokun
1
960
すごい合同勉強会2014 in 広島 懇親会LT
torokun
0
500
LT駆動開発08 - 無限のディスク領域を手に入れよう(妄想編)
torokun
0
130
やめよう「なるはや」
torokun
1
200
DevLOVE広島 第1回 その改善いつするの?
torokun
0
870
LT駆動開発04 5分では分からないTypeScriptのなんとか
torokun
0
1.1k
LT駆動開発 03 写真を趣味にしてから学んだこと
torokun
0
730
LT駆動開発 02 一発ネタ
torokun
0
1.1k
Other Decks in Technology
See All in Technology
AI感のないAWS構成図をAIエージェントに描かせたい!
sagochiko
2
480
Apache Iceberg が拓く AI 時代のオープンレイクハウス
tomtanaka
0
200
AI Native Platform Engineering 〜PlatformとAgileで“作る速さ”を“価値”へ〜
uya116
0
570
あなたの知らないAmazon VPC Route Server/Amazon VPC Route Server you don't know about
masakiokuda
1
200
Claude Designがめちゃくちゃ便利なので使ってほしい
diggymo
0
170
Databricksメトリクスビューはじめてのもくもく会
taka_aki
0
150
ビジネスを止めない技術的負債の返済のための戦略とその手法 - 技術的負債と向き合う / Complexity and Simplicity
soudai
PRO
2
300
KanaAI
shreyas1009
0
140
Terraformを用いたJamf Pro構成のIaC, GitOps化への挑戦
yukun
0
120
【データ横丁主催】AI Agentがコンテキストを使って仕事をした後、何が残るのか― 組織の経験を次の判断に引き継ぐ「Agent Memory」
shisyu_gaku
2
300
【Findyテック文化祭ワークショップ】新卒エンジニア&採用担当と作る、 なりたい姿と今やるべき一歩
dip_tech
PRO
0
150
1人アドミンな私はAWSアカウント申請をSlackで完結したい!
ysuzuki
0
110
Featured
See All Featured
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
signer
PRO
0
3.8k
Site-Speed That Sticks
csswizardry
13
1.5k
Tips & Tricks on How to Get Your First Job In Tech
honzajavorek
1
780
Unsuck your backbone
ammeep
672
58k
How to audit for AI Accessibility on your Front & Back End
davetheseo
0
560
Mobile First: as difficult as doing things right
swwweet
225
10k
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
greggifford
PRO
0
340
How to Build an AI Search Optimization Roadmap - Criteria and Steps to Take #SEOIRL
aleyda
1
2.2k
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
74
42k
How to Think Like a Performance Engineer
csswizardry
28
2.8k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.6k
For a Future-Friendly Web
brad_frost
183
10k
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
以上、 ありがとうございました。