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
Reason
Search
Yuki Kodama
July 30, 2017
Technology
1
2.2k
Reason
Reasonのやっていき資料です。とりあえずアップした。
Yuki Kodama
July 30, 2017
Tweet
Share
More Decks by Yuki Kodama
See All by Yuki Kodama
マイクロフロントエンドの現状確認
kuy
0
380
redux-towerでルーティングを制する
kuy
4
2.8k
Should I use redux-saga or not?
kuy
2
4.4k
redux-sagaで副作用をコントロールする
kuy
4
1.5k
Rails+webpackの落ち穂拾い
kuy
0
1.7k
なぜReduxを使うのか
kuy
25
11k
意地でもReduxを使う
kuy
1
540
Other Decks in Technology
See All in Technology
インフラとバックエンドとフロントエンドをくまなく調べて遅いアプリを早くした件
tubone24
1
430
Amazon CloudWatch Network Monitor のススメ
yuki_ink
1
210
安心してください、日本語使えますよ―Ubuntu日本語Remix提供休止に寄せて― 2024-11-17
nobutomurata
1
1k
Python(PYNQ)がテーマのAMD主催のFPGAコンテストに参加してきた
iotengineer22
0
500
CDCL による厳密解法を採用した MILP ソルバー
imai448
3
110
Zennのパフォーマンスモニタリングでやっていること
ryosukeigarashi
0
140
OTelCol_TailSampling_and_SpanMetrics
gumamon
1
190
誰も全体を知らない ~ ロールの垣根を超えて引き上げる開発生産性 / Boosting Development Productivity Across Roles
kakehashi
1
230
障害対応指揮の意思決定と情報共有における価値観 / Waroom Meetup #2
arthur1
5
480
Why App Signing Matters for Your Android Apps - Android Bangkok Conference 2024
akexorcist
0
130
アジャイルでの品質の進化 Agile in Motion vol.1/20241118 Hiroyuki Sato
shift_evolve
0
170
Security-JAWS【第35回】勉強会クラウドにおけるマルウェアやコンテンツ改ざんへの対策
4su_para
0
180
Featured
See All Featured
Bootstrapping a Software Product
garrettdimon
PRO
305
110k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
48k
The Invisible Side of Design
smashingmag
298
50k
Speed Design
sergeychernyshev
25
620
Building a Modern Day E-commerce SEO Strategy
aleyda
38
6.9k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
10
720
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
27
840
5 minutes of I Can Smell Your CMS
philhawksworth
202
19k
Building Your Own Lightsaber
phodgson
103
6.1k
Six Lessons from altMBA
skipperchong
27
3.5k
A Philosophy of Restraint
colly
203
16k
Java REST API Framework Comparison - PWX 2021
mraible
PRO
28
8.2k
Transcript
Reason @kuy / Yuki Kodama 2017.07.30 @ Kyoto.js 13
自己紹介 @kuy (カイ) / Yuki Kodama 株式会社ジャパンベンチャーリサーチ(株式会社ユーザベースの完全子会社) entrepedia(アントレペディア)の開発・運用 AWS, Ruby
on Rails, JavaScript (React+Redux+Saga) がメイン • redux-sagaでルーティングを制する • redux-sagaで非同期処理と戦う • ・・・など Qiita の記事
Reasonってのは・・・ • 文法 + ツールチェイン ◦ Reason → OCaml のプリプロセッサ
▪ OCaml のとっつきにくい文法を JavaScript で中和した文法 ▪ Camlp4の仕組みを使ってOCaml ASTをいじくる ▪ JSXもパースしてくれる → React 使える ◦ OCaml → JavaScript or Native のためのツール群 ▪ JSターゲットは BuckleScript のコンパイラを利用 • Ocsigen の Js_of_ocaml とのつながりはない ▪ Nativeターゲットは普通に ocamlbuild + OPAM • BuckleScriptでNativeビルドするやつは進行中みたい • https://github.com/bsansouci/bsb-native
Reasonの基本はとても素朴 • 普通のOCamlのコンパイラを使う • refmtの開発がメイン • お手軽さがない → ツールチェインの整備 参考:
https://github.com/chenglou/intro-to-reason-compilation ocamlc -pp "refmt --print binary" -o ./out -impl src/test.re プリプロセッサの使用 プリプロセッサのオプション 出力ファイル 入力ファイル 例: Reasonを実行ファイルにコンパイルする方法
Reasonの文法 基本:リテラル、演算子 型ごとに別々の演算子が定義されてい るのがポイント。JSはTSでもFlowtype でもこれが推論を妨げている。
Reasonの文法 Variants データを保持できるEnumっぽいもの。めちゃくちゃ便利! switchではEnum名だけでなく中身のデータでもパターンマッチして掘ることができる。
Reasonの文法 スコープ: ちょっとOCamlが見え隠れする瞬間 Reasonではこれがエラーにならない OCaml的にはこう展開される。let-in スコープ内 でさらに別の名前をバインドするだけ、と扱われる ので問題ない。
Reasonの文法 変数、オブジェクト、関数 OCaml のぎこちない感じが消えている 出典: https://reasonml.github.io/guide/ocaml
Reasonの文法 リスト Linked Listっぽさが消えてる 出典: https://reasonml.github.io/guide/ocaml
作ってみたもの #1(Demo) • ライフゲーム • reason-react + webpack + bs-loader
◦ ライブリロードとかwebpackまわりの設定は参考になるかも ◦ ただし、reason-jsを直接使うやり方は古いかも • StatefulのReactコンポーネントを作成 ソース: https://github.com/kuy/reason-of-life
作ってみたもの #2(Demo) • 砂山モデルの可視化 • obelisk.js の自作バインディング + webpack +
bs-loader ソース: https://github.com/kuy/nada.re
Reasonのうれしいところ • 長年培われたOCamlの強力な型推論の恩恵をそのまま受けられる ◦ JSにいろいろ足すより、OCamlに足す方が長い目で見るといいかも • 明示的に型を書くことはほとんどない • データ中心、関数型 ◦
Object Caml なのでほどよい感じ • 文法が自然(ES的な意味で) ◦ Object spread operator ◦ Destructuring assignment • 気がきいてる(次のスライド)
(最近知った)Reasonのうれしいところ ↑ これが、こう書ける ↓
Reasonのつらいところ • バインディングがまだまだ少ない ◦ BuckleTypesからreasonml-communityに組織名変更 ◦ https://github.com/reasonml-community • TypeScriptとかFlowtypeみたいに型を定義すればよい、というわけではな いことが多い
◦ Reason(OCaml)っぽいAPIを意識して書くのは楽しい • CoreもAsyncも使えない(RWO育ちの人のみ) ◦ Core: OCaml標準のもの、JS由来のもの ◦ Async: 通常の関数コールバックかJs.Promise
今後(+ Todo) • Reason: もっとES2015っぽい文法の導入 ◦ https://github.com/facebook/reason/pull/1299 • reason-react 0.2.x
での大幅変更 ◦ サンプル修正しつつキャッチアップする • Reductive はとても素直な実装で理想的な感じなので使ってみる ◦ ActionとしてVariantを使う • bs-obelisk を作りたい
おまけ: Reductive • 実装が非常に小さい ◦ redux + react-redux 相当で100行以下 •
Reduxよりもさらにシンプルに ◦ actionをVariantとして書くのでaction creatorは必須ではない ◦ OCamlの |> 演算子で関数合成できるので applyMiddlewares とかは 基本的に不要