Skip to content

Instantly share code, notes, and snippets.

@ababup1192
Last active July 29, 2020 10:54
Show Gist options
  • Star 11 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ababup1192/f24cb76e43212588bc3555067c4fbef0 to your computer and use it in GitHub Desktop.
Save ababup1192/f24cb76e43212588bc3555067c4fbef0 to your computer and use it in GitHub Desktop.

Elmロードマップ

(なんでロードマップが必要なのか書く)

Elm Guideをさらっと一周

Elm Guideをさらっと一周しましょう。

Elm Syntaxを読む

Elm Syntaxで文法を学びましょう。JSに慣れている人は、Syntax vs JSを見ても良いかも。

文法がなんとなく抑えられたら、Elm Coreを見てREPLやElm Reactorでいじってみましょう。特にBasic, Listパッケージなどを触っておくと良い。

HTMLをガチャガチャ組んでみる

とにかくElmをやっていく上で、Htmlと仲良くする必要がある。ネストさせたり分岐させたり、関数に分けたり感覚を掴んで。直前に学んだCoreの簡単な関数を使ってみると良いかも。Listを使えるようになっておくと後々楽。

Exampleをいじってみる

ExamplesはPlayGround上で動く小さなサンプル。ちょこちょこコードをいじってみよう。

ここですかさ、Elm Guideをもう一周

今度は、Elm Guideをじっくり一周してみましょう。The Elm Architecture(TEA)を意識すること。

副作用を使わない小さいアプリを作ってみる

Elm ReactorやParcelなどを使って腕試ししてみましょう。Elm Coreのパッケージのいろんな関数を意識して使ってみると良いかも。Listパッケージは必修。

乱数でCmdと仲良く

Randomパッケージを覗いて、小さなアプリを作ってみよう。

カスタム型とパターンマッチとこんにちは

Elmガイドのカスタム型パターンマッチを使ってみよう。MaybeResultパッケージはとてもよく使うカスタム型なので、ここで使い方をしっかり抑えておこう。mapやandThenなどの高階関数の使い方を覚えておくとなおよし。

いろいろなイベントと戯れてみる

MDNを見ながら、JSONを駆使していろんなイベントをハンドリングしてみよう。Htmlパッケージのソースコードを参考にしながらセレクトボックス・ラジオボタンなどを触ってみると良い。

HTTPでCmdと仲良く

HTTPJSONパッケージを使って、GitHubやQiitaなどのAPIを叩いたWEBアプリを作ってみよう。Taskを使ってみると刺激的かもしれない。

Time(Task)

Webアプリで時間をいじるのは必須テク。TimeパッケージでTaskのことを少し学んでみよう。Timeは筋力を要求されるので慣れておこう。

Sub

直前に学んだTimeパッケージなどを利用して、定期購読(Sub)を使ってみよう。Examplesを参考にいじくると良い。

ports

portsでJSと会話しよう。初級編は、Local Strage。Firebaseとかを使えると実践的な力が付くかも。

モジュール分割

既に穴が開くほど見ているであろうElmガイドのモジュールのところを見てみよう。また公式ライブラリなどのソースコードを見てモジュール分割の例を学ぼう。

SPA(モジュール分割なし)ジャブ

既に穴が開くほど(ry ElmガイドのURLをパースするを見よう。Urlパッケージを学びながら、簡単なルーティングを試してみよう。

SPA(モジュール分割あり)にチャレンジ

package.elm-lang.orgelm-spa-exampleなどを参考にモジュール分割を含んだSPAを作ってみよう。これが実質ラスボス。何度も何度もチャレンジして絶望しながら体得しよう。SPAは難しい。

パフォーマンスを気にしてみよう

HtmlのKeyedLazyパッケージを覗いて、パフォーマンスをチューニングしてみよう。

Elmパーサを使ってみよう(おまけ)

唯一いろんな記号を使える公式ライブラリelm/parserをいじってみよう。

Elm コンパイラを覗いてみよう(おまけ)

Elmのコンパイラを覗きながら、Elm Effect Managersの仕組みとかを抑えてみよう。

@negiboudu
Copy link

自分の場合はほぼguideを見て試す、でしたが、何を作ったらいいのかわからない問題にぶつかりました。
よくある「TODOリストを作る」とか、具体的な課題があると迷いが少なくなるかもしれません。

あとは、自力で頑張って作るのではなくて、パッケージを探してきて使うということをし始めたら、道が開けた気がします。

つまずいたところは、関数型をやってこなかったので、高階関数の理解で立ち止まったり、カスタム型の使い道がわからなかったり。

理解できるまで立ち止まるよりも、使っていく中で覚えた方が早いんじゃないのというのは、abさんとみやもさんから学びました。

あと、ロードマップに載る話ではないかもしれませんが、meet upのときにいずみさんが紹介していたような、elmの学び方いくつかがあると、初学者にとっては参考になると思います。

@IzumiSy
Copy link

IzumiSy commented Feb 18, 2020

Meetupで僕が話した「elmの歩き方2019」のスライドを貼っておきます✊
https://speakerdeck.com/izumisy/elmfalsebu-kifang-2019

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment