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
slamdata/purescript-halogen の紹介
Search
e_ntyo
November 25, 2018
Programming
0
94
slamdata/purescript-halogen の紹介
HTML5 Conference 2018の公募LTで発表させていただきました。
e_ntyo
November 25, 2018
Tweet
Share
More Decks by e_ntyo
See All by e_ntyo
論文紹介 "My Mouse, My Rules - Privacy Issues of Behavioral User Profiling via Mouse Tracking"
e_ntyo
1
140
論文紹介 - Towards Memorable Information Retrieval (ICTIR ‘20)
e_ntyo
0
48
Introducing Type Providers
e_ntyo
0
16k
セーフティ・JavaScript・プログラミング
e_ntyo
0
210
Other Decks in Programming
See All in Programming
為醫療加裝Python的引擎
cclai999
0
270
Infrastructure as Code でセキュリティを楽にしよう!
konokenj
5
1.4k
色んなオートローダーを覗き見る #phpcon_okinawa
o0h
PRO
5
360
sqlcを利用してsqlに型付けを
kamiyam
0
230
Pythonによるイベントソーシングへの挑戦と現状に対する考察 / Challenging Event Sourcing with Python and Reflections on the Current State
nrslib
3
870
Micro Frontends for Java Microservices - dev2next 2024
mraible
PRO
0
190
Applied NLP in the Age of Generative AI
inesmontani
PRO
3
1.1k
App Router 悲喜交々
quramy
7
370
モジュラモノリス、その前に / Modular monolith, before that
euglena1215
4
530
VS Code extension: ドラッグ&ドロップでファイルを並び替える
ttrace
0
150
全方位強化 Python 服務可觀測性:以 FastAPI 和 Grafana Stack 為例
blueswen
1
360
NANIMACHI
naokiito
0
930
Featured
See All Featured
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
26
4k
How to Think Like a Performance Engineer
csswizardry
16
1k
Imperfection Machines: The Place of Print at Facebook
scottboms
263
13k
How to Ace a Technical Interview
jacobian
275
23k
A Tale of Four Properties
chriscoyier
155
22k
The World Runs on Bad Software
bkeepers
PRO
65
11k
Product Roadmaps are Hard
iamctodd
PRO
48
10k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
26
1.9k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
26
1.3k
Designing Experiences People Love
moore
138
23k
Art, The Web, and Tiny UX
lynnandtonic
295
20k
Code Reviewing Like a Champion
maltzj
519
39k
Transcript
slamdata/purescript-halogen の紹介 @e_ntyo (https://entyo.github.io)
@e_ntyo • 大学中退 → フリーター • もうすぐ誕生日 ◦ ほしいものリスト
このスライドの内容 1. そもそもPureScriptとは 2. slmadata/purescript-halogen というUIライブラリの紹介
PureScriptを 知っている方
PureScriptとは • いわゆるAltJSの1つ .purs .js compile by psc .js use
via FFI
PureScriptとは • Haskellライクな関数型プログラミング言語 ◦ 静的型による強力な型システム ▪ 型クラス, パターンマッチ, Record型, などの超便利機能
▪ 開発者支援 • コードの自動生成 • エディタでのコード補完・定義ジャンプ
PureScriptとは • Haskellライクな関数型プログラミング言語 ◦ 圏論の世界の概念を利用できる ▪ Functor, Monoid → リスト操作が便利に
▪ Applicative → フォームバリデーションが簡単に ▪ Monad → 副作用を持つ値, Nullableな値の取扱が安全に 重要: 圏論での意味合いがわかっていなくても使える(こわくない)
slamdata/purescript-halogen • VDOMを利用したPureScriptのUIライブラリ ◦ コンポーネントツリーで UIを組み立てる ▪ 個人的な印象: PureScriptの世界線でのReact.js •
React.jsのバインディングも存在
slamdata/purescript-halogen • 例 - entyo/WatchingU
slamdata/purescript-halogen • 例 - entyo/WatchingU
slamdata/purescript-halogen • 例 - コンポーネントの定義
slamdata/purescript-halogen • 例 - コンポーネントの構成要素
slamdata/purescript-halogen • 例 - コンポーネントの構成要素
slamdata/purescript-halogen • 例 - コンポーネントの動作
slamdata/purescript-halogen • 例 - コンポーネントの動作
slamdata/purescript-halogen • 例 - State -> View
slamdata/purescript-halogen • 例 - State -> View
None
SPAをつくるぞ! • Global Stateの管理はどうするの? ◦ ReaderTパターン を使うとよさそう ◦ 参考: vladciobanu/purescript-halogen-example
SPAをつくるぞ! • 〇〇はできますか? ◦ Routerは? ▪ ある ◦ Server Side
Renderingは? ▪ 未対応(対応している 別のUIライブラリはある) ◦ SVG Supportは? ▪ actively developmentが終了
まとめ • PureScript → HaskellライクなAltJS ◦ 最新の関数型プログラミング言語 ◦ 既存のJSのコードは再利用できる •
purescript-halogen → VDOMを利用したPureScriptのUIライブラリ ◦ 安全な(ランタイムエラーのない) SPAを開発できる
See Also • entyo/WatchingU • コモナドスケッチ ~ 1. DOMのコラージュ ~
◦ PureScriptでSPAを書いていく連載記事