Elmが予想以上に楽しかったので紹介したい

Transcript

1. Elmが予想以上に楽しかったので紹介したい 俺の話を聞け！！ LT大会 #7 / Jan 19, 2018 ponday (@ponday_dev)
2. Profile Honda, Yusuke (@ponday_dev) chibi-developer ng-fukuoka organizer Community TypeScript / JavaScript / Kotlin RxJS / Angular Like
3. Elm、知ってますか？
4. Elm - 純粋関数型プログラミング言語 - Haskellに由来する構文 - 変数が存在せず、全てがimmutable - 静的かつ強力な型付け - コンパイル結果はJavaScript（AltJS） - 高品質なWebアプリケーション開発を目的に開発 - 静的かつ厳格な型チェック - Webアプリケーション開発用のDSLという面が強い - 「事実上、一切の実行時例外が起こらない」がウリ - エコシステムが充実 - コンパイラ - パッケージマネージャ - コードフォーマッター
5. 触る前の印象
6. むずかしそう...
7. Elmはむずかしい？ - Elmは純粋関数型言語 - 副作用の取り扱いがあまり得意ではないはず - フロントエンドは副作用だらけ - そもそも画面の描画が副作用では...？ - 相性悪い気しかしない - またモナド使えとか言われるの...？（震え）
8. 触ってみた感想
10. Elmの良いところ
11. 良いところ①　とにかくコンパイルが強力 - 静的コンパイル言語のメリット - 以下のようなパターンはコンパイルエラー - 型の不一致 - 未使用のimport - case式※で考慮されていないパターンがある - nullableのような仕組みが組み込み（Maybe） - null参照が起こる可能性が大きく下がる - 本当に実行時例外は少ない ※ JavaScriptでいうswitch文のような構文。パターンマッチができる。
12. 良いところ②　言語構文がシンプル - 構文自体が少ない - if - case ~ of … - let ~ in … - ほぼこれだけ - 関数一つ一つが小さいので読みやすい - 小さい関数をたくさん作って組み合わせるスタイル - 標準関数はたくさんあるので最初は探すのに苦労するかも - Elm Architectureで使う関数はチュートリアルで大まかに網羅できる
13. 良いところ③　副作用の扱いが比較的簡単 - The Elm Architecture - Elmのコアに組み込みのWAF - Reactなどと同様に、仮想DOMを使用する - Reduxにアイデアとして取り込まれた部分 - Model, View, Update※1を定義 - 各種イベントや関数などは戻り値としてユーザ定義のメッセージ※2を発 行するようにすると、あとは自動でUpdate関数が呼び出されて画面更新 される - 画面の更新など非同期的な部分は上記が勝手にやってく れる ※1 ReduxでいうReducerに相当 ※2 ReduxでいうActionTypesに相当
14. 良いところ④　文法の揺れが少ない - フォーマッターが標準で提供 - 以下は自動的に補正される - オブジェクト定義の書き方 - 改行の位置 - 改行の数 - インデント - The Elm Architectureの利用が前提 - 「参考になりそうなコードだったけどフレームワークが...」なんてことは起こ らない - 公式だけでなく、一般の人のコードを見ても書き方がほぼ 一定になるため非常に読みやすい
15. Elmの微妙なところ
16. 微妙なところ①　独特な構文 - Haskellに似た構文なのでJSなどとは大きく異なる - 文法の違いや読み方に慣れるまでは少し大変 - 関数型言語に少しでも触ったことがあれば何となく読める - これはしょうがない。慣れましょう。 - コードの行数は増えやすい（気がする） - 感覚的なもので数値的には未検証 - 横には短く、縦に長い - 関数1つ1つはせいぜい10〜20行なので読みにくくはない - 公式も「1ファイルあたりの行数が増えるのに対しては寛容」とアナウンス してるので間違ってはないはず - ボイラープレート的な構文もやや多い - create-elm-appとか使うと幸せになれるかも - 個人的には好き
17. 微妙なところ②　JavaScriptとの相互運用性が微妙 - port - 相互に処理の呼び出しや値の受け取りは可能 - 非同期的に実行される - JavaScript as a Service - portを使用する場合、API呼び出しのように別のサービスを呼び出すイ メージで利用するべき - JavaScriptは実行時例外が抑制できないので、Elmアプリケーションの一 部とみなして利用するべきではない - JavaScriptのAPI呼び出しを含むElmパッケージは、Elmの Community Packageに公開できない - 堅牢性を重視しての制約 - ある程度は公式から提供されているが、LocalStorageなどのパッケージ が標準にないのでちょっと困る - npmのパッケージとして公開すれば使えなくはないけど微妙...
18. プロダクト採用はあり？
19. 個人的な意見 なしではない。が、よく検討してから。
20. 最後に
21. 少ないですがサンプルコードを公開してます。 https://github.com/ponday-dev/elm-sample https://github.com/ponday-dev/elm-routing-sample 興味を持たれた方がいらっしゃれば、ぜひ https://github.com/ponday-dev/elm-call-api-sample