はじめに
Python歴１年の人がElmに入門する様子を記す。
情報系の知識はほとんどないため初心者friendlyな記事になる予定。
間違い等あったら優しく教えてください！
参考
基礎からわかるElm (ISBN: 9784863542228)
An Introduction to Elm
環境
MacOS Mojave 10.14.4
エディタ: VSCode
インストールとエディタの設定
- 公式からインストーラーをダウンロードして来てインストールした。
- VSCodeの左端のExtensionsというアイコンを押す→elmで検索→elmというプラグインがあるのでそれをインストール
- terminalに
npm install -g elm-formatと打って実行 - VSCodeのCode(Macだと画面左上のリンゴマークの隣にある)→Preference→Settings→VSCodeのウィンドウ右上の
{}マークを押す→
"[elm]":{
"editor.formatOnSave": true
}
と書く。
わたしの場合はこう↓なりました。
{
"python.pythonPath": "pythonのパス",
"[elm]": {
"editor.formatOnSave": true
}
}
Hello World!
- 適当な場所に適当な名前のディレクトリを作る（今回はホームディレクトリにelm_beginnerという名前のディレクトリを作った）。
- elm_beginnerに移動する。
-
elm initを実行すると必要なファイル等が作成される。途中でyes/no聞かれるので元気よくyを押そう！ - srcディレクトリが出来ているのでsrc内に、hello.elmを作成する。
hello.elm
module Main exposing (main)
import Html exposing (text)
main =
text "Hello, World!"
-
elm make src/hello.elmでコンパイル。 - index.htmlというファイルが出来ている。
- ブラウザで開いてみると「Hello World!」出来ている。
- （ページのソースを検証したらなんかいっぱい書いてある。よく分からないけどHello World!の文字が確認できる。）
今回の学び
作業用ディレクトリ新しく作ったときにelm initするの忘れそうだから忘れないように気をつけよう！