Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
Cycle.jsを使ってみた話 / Introductory talk about Cycle.js
tipo159
October 02, 2017
Programming
1
370
Cycle.jsを使ってみた話 / Introductory talk about Cycle.js
Cycle.jsの概要紹介
tipo159
October 02, 2017
Tweet
Share
More Decks by tipo159
See All by tipo159
ReasonReactとReactのAPIの違い / The Difference between ReasonReact API and React API
tipo159
2
350
REASONの紹介 / Introductory talk about REASON
tipo159
1
320
PWAで何ができるようになるのか / What does PWA do
tipo159
1
760
HNPWAの紹介 / Introductory talk about HNPWA
tipo159
2
370
fetchのCancel Abort方法標準化の変遷 / A History of Cancel Abort Method Standard
tipo159
1
360
ES2015 Proxyを使ってみた / Introductory talk about ES2015 Proxy
tipo159
1
430
Webコンポーネント関連の最新動向 / Recent Topics on Web Components
tipo159
0
470
SlackはどうやってBrowserViewに乗り換えたのか / How Slack move from webview to BrowserView
tipo159
2
3.5k
コンポーネント再利用ってどこまでするの? / How to reuse components
tipo159
0
820
Other Decks in Programming
See All in Programming
Web API連携でCSRF対策がどう実装されてるか調べた / how to implements csrf-detection on Web API
yasuakiomokawa
2
470
Why Airflow? & What's new in Airflow 2.3?
kaxil
0
120
JetPackComposeは宣言型プログラミングパラダイムって実はよくわかってないんですが、別に使ってもいいんですよね、
conigashima
0
190
Terraform Plan/Apply結果の自動通知
ymmy02
0
280
無限スクロールビューライブラリ 二つの設計思想比較
harumak
0
250
Android Compose Component - mapping.
taehwandev
0
140
1時間半で克服するJavaScriptの非同期処理/async_javascript_kokufuku
marchin1989
2
620
Modern Android Developer ~ 안내서
pluu
1
640
模組化的Swift架構(二) DDD速成
haifengkao
0
390
Node-RED 3.0 新機能紹介
utaani
0
140
Get Ready for Jakarta EE 10
ivargrimstad
0
780
[월간 데이터리안 세미나 6월] 스스로 성장하는 분석가 커리어 이야기
datarian
0
240
Featured
See All Featured
Three Pipe Problems
jasonvnalue
89
8.7k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
151
13k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
315
19k
Testing 201, or: Great Expectations
jmmastey
21
5.4k
Streamline your AJAX requests with AmplifyJS and jQuery
dougneiner
127
8.5k
StorybookのUI Testing Handbookを読んだ
zakiyama
5
2.3k
Imperfection Machines: The Place of Print at Facebook
scottboms
253
12k
Building Flexible Design Systems
yeseniaperezcruz
310
34k
The MySQL Ecosystem @ GitHub 2015
samlambert
238
11k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
655
120k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
269
11k
Art Directing for the Web. Five minutes with CSS Template Areas
malarkey
196
9.4k
Transcript
Cycle.jsΛͬͯΈͨ We Are JavaScripters! @12th 2017.10.2 tipo159
Cycle.jsͱ • ϦΞΫςΟϒϓϩάϥϛϯά(Observable)ͰԾDOMΛૢ࡞͢Δϑ ϨʔϜϫʔΫ • xstreamͱ͍͏ϦΞΫςΟϒϓϩάϥϛϯάͷϥΠϒϥϦΛ༻ • xstreamRxJSͷܰྔ൛ • RxJSͱmost.js(Monadic
Streams)༻Մೳ 2
ԾDOM • SnabbdomΛ༻ • HyperScript HelpersͰDOMੜΛهड़ div('.myClass', {style: {color: 'red'}},
[]) 3
Cycle.jsͷߟ͑ํ • Cycle.jsͷΞϓϦέʔγϣϯͰɼ७ਮؔ(෭࡞༻ͷͳ ͍)main()͕ɼ֎෦͔ΒͷೖྗΛSources͔ΒಡΈࠐΈɼ ֎෦ͷ࡞༻ΛSinksॻ͖ग़͢ɽ 4 main() Sources Sinks DOMHTTPͷ෭࡞༻
७ਮؔ
σϞ 5
ιʔείʔυ 6
ϋϚͬͨϙΠϯτ • hyperscript helperͰͷselect()(<select>ͷ<option>)ͷ هड़ํ๏͕͔Βͳ͍ • html-to-hyperscript.paqmind.comͱ͍͏HTML͔Β hyperscriptʹม͢ΔαΠτͷग़ྗ௨Γʹهड़ͯ͠ ಈ࡞͠ͳ͍ •
ηϨΫλ༻ؔ(DOM.select())ͷݕࡧ݁Ռ͕ଟ͗͢ ͯɼ<select>ͷαϯϓϧΛݕࡧͰ͖ͳ͔ͬͨ 7
ࠂ We Are PureScripters #3 • ॳ৺ऀܴ ؔܕJavaScript LTେձ •
PureScriptElmͳͲͷؔܕϓϩάϥϛϯάݴޠ͚ͩͰͳ ͘ɺImmutable.jsLodashͳͲͷJavaScript༻ؔܕϥΠϒ ϥϦͳͲؚΊͨLTେձ • ࣌: 2017.10.20 19:30ʙ21:30 • ձ: ະఆ • LTొஃऀ ืूத 8