概要
Browser.sandbox, element, document, applicationの違いは?どう使い分けるの?
という疑問にふんわり答えます
2回くらい聞かれたので書いておきます
詳しいことはElm Guideやpackage documentをみればいいので詳しいこともコードも、参考リンクも載せません
Elmは0.19
elm/browserは1.0.1
そもそも使い分けるものじゃない
基本的にはできることが増えていく感じだと思ってください
増える機能を使いたいなら上げる感じです
sandboxより前
実はelmのmainはHtml型でも受け入れてくれます
main : Html msg
main = Html.text "Hello, world"
コード書いちゃった…。最初にちゃんと静的ハローワールドやった人なら知ってるよって感じでしょうが意外と忘れます
Stringはだめです
sandbox
純粋な世界にようこそ!
CmdとSubが使えません。いわゆる副作用ですね
とはいえユーザーのクリックとか入力とか取れるので何もできないわけではないです。何が純粋だ
具体的には乱数とかAPIたたくとかJSとやりとりするとかができません
あなたのアプリがAPIたたくわけではないならこれでいいのでは?
element
APIがたたけるよ!
ついに外界とやり取りできるようになりました
あなたが望むのならJSで起動するときにFlagsと呼ばれる初期値みたいなものを渡すことができます。またサイコロもふれるし、ユーザーのアクションの5秒後に何か起こすことだってできます
CmdとSubの概念は最初はなじみのないものでしょうからちゃんとガイドを読むといいと思います
document
このDOMの世界はわたしのものです!
今までは起動時にあるnodeを渡すことでそのnode下をマウントしていましたが、ここからはbodyタグ直下をマウントします
ついでにtitleタグをいじれるようになります。
注意:documentとapplicationではReactアプリケーションにElmを埋め込むということができなくなります
主導権が完全にElmになるので、ElmにReactを埋め込むならできます
application
ルーティングしたい
あなたのアプリケーションでルーティングをしたいなら間違いなくこれです。
elementではルーティングはできません。つまりElmが主導権を握る必要があります。
applicationではaタグでのリンククリックがElmのランタイムに捕まえられ、updateで処理することができます。pushしてもいいですし、loadしてもいいです。あなたのコード次第です。
特別なタグ(NavLinkみたいな)を使う必要はありません
終わり
ガイドとパッケージドキュメント読んでください