こんにちは世界

Elmのインストール

http://elm-lang.org/install にアクセスして、システムに適したインストーラをダウンロードしてください。

最初のElmアプリケーション

最初のElmアプリケーションを書いてみましょう。アプリケーション用のフォルダを作成します。このフォルダで、ターミナルで次のコマンドを実行します。

elm package install elm-lang/html

これで html モジュールがインストールされます。次に、以下のコードを含む Hello.elmファイルを追加します:

module Hello exposing (..)

import Html exposing (text)


main =
    text "Hello"

ターミナルでこのフォルダに移動して、次のように入力します。

elm reactor

以下が表示されるはずです:

elm reactor 0.18.0
Listening on http://localhost:8000/

ブラウザーで http://0.0.0.0:8000/を開きます。Hello.elmをクリックしてください。ブラウザに Helloが表示されます。

mainの型アノテーションがないことに関する警告が表示されることに注意してください。これは後で型アノテーションを入力するとして、今のところ無視しましょう。

ここで何が起こっているのかを見てみましょう:

モジュール宣言

module Hello exposing (..)

Elmのすべてのモジュールはモジュール宣言で始まらなければなりません。この場合、モジュール名は Helloです。ファイルとモジュールに同じ名前を付けるのが規約です。 Hello.elmにはmodule Helloが含まれています。

宣言の exposing(..)部分は、このモジュールをインポートする他のモジュールにどのような関数と型を公開するかを指定します。この場合、すべてを (..)で公開します。

インポート

import Html exposing (text)

Elmでは、明示的に使用したいモジュールをインポートする必要があります。この場合、Htmlモジュールを使用します。

このモジュールには、htmlを扱う多くの関数があります。 .textを使用するので、exposingを使ってこの関数を現在の名前空間にインポートします。

メイン

main =
    text "Hello"

Elmのフロントエンドアプリケーションは mainという関数から始まります。 mainは、ページに描画する要素を返す関数です。この場合、 textを使って作成されたHtml要素を返します。

Elm reactor

Elm reactorは、オンザフライでコンパイルするサーバーを作成します。 reactorはビルドプロセスを種々に設定する必要なくアプリケーションを開発するのに便利です。しかし、reactorには制限があるので、将来的には適切なビルドプロセスに切り替える必要があるでしょう。

results matching ""

    No results matching ""