Elm SPA テンプレートを作った 2 #JavaScript

WARNING: This article is outdated and not maintained anymore.

前半: Elm SPA テンプレートを作った 1
elm-my-spa の解説を続けます。

全てのページで使用するデータの保持方法

例えばセッション情報。ログインユーザデータ、言語設定、 Ports から受け取った何らかのデータ。これらはどのページでも必要ですが、全体で共有すべきものです。どう保持したら良いでしょうか。

もう一度 Main の Model を見てみます。

Main.elm

type Model
    = NotFound Env
    | Index Env IndexPage.Model
    | View Env Id ViewPage.Model

各ページを表現していて、どのページを表示するか判断するのに使用しています。こいつに Env というモデルを渡しています。これが共有データ保管場所として機能しています。

Env.elm

type Env
    = Env Internals


type alias Internals =
    { key : Nav.Key
    }


create : Nav.Key -> Env
create key =
    Env (Internals key)


navKey : Env -> Nav.Key
navKey (Env internals) =
    internals.key

共有データを増やしたい場合は、 Internals にいくらでも突っ込めば良いんです。
Main.elm 内を env で検索すると、 Model の初期化時、Model の変更（ページ切り替え）時に、各ページの init 関数に Env を渡し、常に引き回していることが分かるかと思います。

まとめ

以上で elm-my-spa の解説を終わります。
今後もうちょっと拡張して、何かしらの API を叩くことで Http くらいは加えようかと思います。