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
Reason
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
Yuki Kodama
July 30, 2017
Technology
2.5k
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Reason
Reasonのやっていき資料です。とりあえずアップした。
Yuki Kodama
July 30, 2017
More Decks by Yuki Kodama
See All by Yuki Kodama
エージェント開発におけるObservability
kuy
0
78
マイクロフロントエンドの現状確認
kuy
0
550
redux-towerでルーティングを制する
kuy
4
2.9k
Should I use redux-saga or not?
kuy
2
4.8k
redux-sagaで副作用をコントロールする
kuy
4
1.7k
Rails+webpackの落ち穂拾い
kuy
0
1.9k
なぜReduxを使うのか
kuy
25
12k
意地でもReduxを使う
kuy
1
630
Other Decks in Technology
See All in Technology
現場を動かすAIエージェント#2_製造業現場でのAI活用から見た、ハマる罠と実践知
kintotechdev
2
170
レガシーコードに対する loop engineering的なAI開発プロセス導入について
kubell_hr
0
230
AWSを利用する上で知っておきたい名前解決の話 2026
nagisa53
3
1.7k
IBC 2026 動画技術関連レポート / IBC 2026 Report
cyberagentdevelopers
PRO
2
420
Flutter Widget Previewerで始めるUIプレビューとVRTの自動化
sakusaku3939
0
210
Kiro Crew の Bot (続く役目を任せる窓口) | 目指せ Kiro マスター 12
inariku
PRO
0
180
サボる子はいねぇがー!AgentCoreハーネスの脆弱性に学ぶ、エージェントの入力バリデーション
iwamot
PRO
4
210
Content Mapper APIの応用例~CSS Modules、言語ファイル~
uhyo
2
590
2026 Apache Flink Community Checkpoint
rmetzger
0
180
Maestro MCPとClaude Code Skillsによる自律的なE2Eテスト支援
asmz
0
420
公共システムAdventCalendar2026
toru_kubota
0
190
AIがGISを代替する日:〜すべてをAIが創る時代に、私たちがFOSS4Gに関わる意味〜
lehupa
1
210
Featured
See All Featured
sira's awesome portfolio website redesign presentation
elsirapls
0
490
jQuery: Nuts, Bolts and Bling
dougneiner
66
8.7k
Principles of Awesome APIs and How to Build Them.
keavy
128
18k
Pawsitive SEO: Lessons from My Dog (and Many Mistakes) on Thriving as a Consultant in the Age of AI
davidcarrasco
0
290
The Impact of AI in SEO - AI Overviews June 2024 Edition
aleyda
6
1.3k
Producing Creativity
orderedlist
PRO
348
41k
GitHub's CSS Performance
jonrohan
1033
470k
Jess Joyce - The Pitfalls of Following Frameworks
techseoconnect
PRO
1
470
Building an army of robots
kneath
307
47k
How to build a perfect <img>
jonoalderson
1
6.2k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
141
35k
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 とかは 基本的に不要