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
gulp + React
Search
mex-ichikawa
September 25, 2014
Programming
2
400
gulp + React
Reactを含むWebプロジェクト制作環境を模索。
Project template link:
http://goo.gl/a5FsNW
mex-ichikawa
September 25, 2014
Tweet
Share
More Decks by mex-ichikawa
See All by mex-ichikawa
Three.js vs Unity5
mex_ichikawa
0
56
WebAudioAPIで(目的の)SE作れなかった話
mex_ichikawa
0
32
Bower + WebComponents
mex_ichikawa
0
36
Blob URL Scheme
mex_ichikawa
0
500
Other Decks in Programming
See All in Programming
動作確認やテストで漏れがちな観点3選
starfish719
6
1k
Lottieアニメーションをカスタマイズしてみた
tahia910
0
120
CloudNativePGがCNCF Sandboxプロジェクトになったぞ! 〜CloudNativePGの仕組みの紹介〜
nnaka2992
0
220
チームリードになって変わったこと
isaka1022
0
190
Domain-Driven Transformation
hschwentner
2
1.9k
DevinとCursorから学ぶAIエージェントメモリーの設計とMoatの考え方
itarutomy
1
640
社内フレームワークとその依存性解決 / in-house framework and its dependency management
vvakame
1
550
Pythonでもちょっとリッチな見た目のアプリを設計してみる
ueponx
1
480
Djangoアプリケーション 運用のリアル 〜問題発生から可視化、最適化への道〜 #pyconshizu
kashewnuts
1
230
JavaScriptツール群「UnJS」を5分で一気に駆け巡る!
k1tikurisu
10
1.8k
DROBEの生成AI活用事例 with AWS
ippey
0
130
TokyoR116_BeginnersSession1_環境構築
kotatyamtema
0
110
Featured
See All Featured
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.6k
Automating Front-end Workflow
addyosmani
1367
200k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
Documentation Writing (for coders)
carmenintech
67
4.6k
Build your cross-platform service in a week with App Engine
jlugia
229
18k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
29
2.2k
Rails Girls Zürich Keynote
gr2m
94
13k
Designing on Purpose - Digital PM Summit 2013
jponch
117
7.1k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Faster Mobile Websites
deanohume
306
31k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
44
9.4k
Intergalactic Javascript Robots from Outer Space
tanoku
270
27k
Transcript
gulp + React @mex-ichikawa Tsukiji.front - 2014/09/25
Reactを使うための環境構築の話
What’s React? • MVCモデルにおけるViewとして利用できるWebUIライブラリ • polymer のような WebComponents 支援ライブラリではない •
facebook/instagram サイト内で実際に利用されている • 2013年に facebook が OSS として公開
Why React? • 他の技術に依存しないシンプルなViewエンジン • 仮想DOMを利用しnode.jsでレンダリングできる • コンパイルが必要なJSXというxml埋め込みオプションがある • ある程度自動化が必要な構成
React Demo 基本的な使い方
React Demo JSXの静的コンパイル npm install -g react-tools jsx src/ build/
Automation
React Demo gulp + React gulp-react
React Demo gulp + React + CoffeeScript gulp-cjsx
Project Template http://goo.gl/a5FsNW
And more... • renderComponentToString でコンポーネントを静的生成 • react component database -
http://react-components.com/
Thank you.