コンパイラかく語りき

import { Fun } from 'programming'

Elm

最小構成ではじめるElm Architecture

Elm

いわゆるリハビリ。自分用に書いたのですが、公開します。Elmのバージョンは0.17です。 なぜ書いたのか。 ググッて出てくるコードが複雑なものが多く、初心者にとって本当に必要なものを明示したかったから。 なので、0.17から盛り込まれたSubscribeについて…

Elmをインストーラ経由のものから、npm管理へと移行

Elm

半年ぶりくらいにElmを触りましたが、0.17から0.18へとアップグレードしました。0.17は公式のインストーラ経由でインストールしたのですが、これを機にnpm管理に移行しました。 インストーラ経由のElmを削除 Elmそのものを削除。 $ sudo rm /usr/local/bin/e…

ElmでHttpリクエスト

Elm

Elmのお勉強です。 公式の以下のチュートリアルの写経になります。 HTTP · An Introduction to Elm 書いたコードがこちら。 // gist.github.com 以下、学んだこと。 HttpはEffectsの1つ。 他のEffectsと同様、直接実行するのではなく、”Elmに実行させる” Ta…

Elm Architecture イントロダクション(Form編)

Elm

Elmでinputの入力を監視しつつ、軽いバリデーションを行うコードです。 公式リンクはこちら。 Forms · An Introduction to Elm 関連するドキュメントは以下のとおり。 input: いわゆるInputタグ。 http://package.elm-lang.org/packages/elm-lang/html/1.0.0…

ElmでつくるTodoList(5)

Elm

引き続き、ElmでTodoListをつくっていきます。 chuckwebtips.hatenablog.com ここで、ちょっと修正を行います。 Elmのプロの方からブログにコメントをいただけたので、そのフィードバックを反映します(嬉しい!) 型のimport TodoListを作り始めた頃、親子…

ElmでつくるTodoList(4)

Elm

ひきつづき、TodoListをつくっていきます。 chuckwebtips.hatenablog.com 今回はちょっとした機能追加をします。 現在、Todoを追加する際には、空文字でも追加できてしまいます。 (2つめのTodoが空文字) そこで、空文字の場合はAddボタンを押せないように…

Elm-Architecture入門(6)

Elm

ちょっと間が空きましたが、Elm-Architectureの学習のつづきです。 前回の学習はこちら。 chuckwebtips.hatenablog.com この間に何をしてたかというと、TodoListを作っていました。 ずっと写経ばかりだったので、手を動かしてみようかなと。 chuckwebtips.ha…

ElmでつくるTodoList(3)

Elm

ひきつづき、ElmでTodoListをつくっていきます。 前回は、Todoに任意の文字列を入力できるようにしました。 chuckwebtips.hatenablog.com 今回は、それぞれのTodoに終了機能をつけていきます。 終了機能の実装 チェックマーク まず、見た目から追加します。 …

ElmでつくるTodoList(2)

Elm

ひきつづき、ElmでTodoListをつくっていきます。 前回までで最小構成ができたので、ここからはTodoListらしい肉付けをしていきます。 chuckwebtips.hatenablog.com テキスト入力 現在、Todoの追加はボタンのクリックのみです。 ボタンをクリックすると、do s…

ElmでつくるTodoList(1)

Elm

今回から、ElmでTodoListを作っていきます。 ちなみに、elmでtodolistを作成する場合、以下のレポジトリが参考になるかもしれません。 github.com チュートリアルというほどではないですが、学習の参考になるはずです。 ただし、ただの写経になってしまいそ…

Elmシンタックス(3)

Elm

引き続き、Elmのシンタックスのお勉強。 前回は再帰関数について学びました。 chuckwebtips.hatenablog.com 今回は、union typeのうちeitherというものについて学びました。 union typeってなんやねんと思ったのですが、要は直和型っぽいです。 ただ、こんな…

Elm シンタックス(2)

Elm

Elmのシンタックスについて、ひきつづき勉強していきます。 前回は基本的な関数の用法について学びました。 chuckwebtips.hatenablog.com 今回は関数の中でも、再帰を使った処理について学びました。 http://elm-lang.org/examples 写経したコードがこちら。…

Elm シンタックス(1)

Elm

Elmのシンタックスについて、軽く勉強しました。 まだまだ記法に慣れておらず、公式のサンプルを写経しました。 今回は、以下のCore > functionsを消化。 http://elm-lang.org/examples 書いたコードがこちら。 gist35a6ce778af8c49457a0df837d20f579 Elmで…

"魅惑のElm標準ライブラリ"を読んだ

Elm

Qiitaのこちらの記事を読みました。 qiita.com Elmで定義されているデータ型とその内部実装について、解説がなされています。 以下、読みながらのメモとなります。 直和型 基礎知識としまして、Elmにおいて直和型は以下の様にctorフィールドを持つObjectとし…

Elmのコンパイルにウォッチ機能がないから外部ファイルを作った

残念ながらElmのコンパイルにはwatchオプションがありません。つまり、「ファイルの変更を感知してコンパイルを行う」といったことができません。 そこで、Nodeの標準パッケージを利用して、擬似的なwatch機能を作ってみました。 gist8b7482df27f3e1b80f4823…

Elm-Architecture入門(5)

Elm

引き続き、ElmArchitectureの勉強をしていきます。 chuckwebtips.hatenablog.com 前回は動的にカウンターを作成する方法を学びました。 今回は、削除機能を改良して、それぞれのカウンターに削除ボタンをつけるようにします。 github.com レンダリング関数の…

Elm-Architecture入門(4)

Elm

引き続き、Elm-Architectureのサンプルを見ていきます。 chuckwebtips.hatenablog.com 前回は、複数のカウンターを作成しました。 今回は動的なカウンターを作成します。 github.com カウンターモジュール カウンター自体は前回作成したものを再利用します。…

Elm-architecture入門(3)

Elm

前回までは、Elm-architecturの基本について学びました。 chuckwebtips.hatenablog.com 今回はちょっとだけ自分で手を動かしてみます。 トリプルカウンター 作成するのは3つのカウンターです。とはいえ、前回2つのカウンターを作ったのでホントにカンタン…

Elm-architecture入門(2)

Elm

前回に引き続き、Elm-architectureの例を消化していきます。 chuckwebtips.hatenablog.com 例2 ペアカウンター 前回は単一のカウンターを作成しましたが、今回はペアのカウンターを作成していきます。 github.com カウンターが2つということは、カウンター…

Elm-architecture入門(1)

Elm

前回まではElm入門と題して、Elmの基本について学びました。 chuckwebtips.hatenablog.com 今回からは、Elmの重要概念となるElm architectureについて学びます。 ここからの学習は、以下のレポジトリに沿って行います。 github.com Elm-architectureとは Elm…

Elmに入門する(3)

Elm

引き続き、Elmの入門記事です。 前回は恒例のHello Worldをしました。 chuckwebtips.hatenablog.com 今回はスタートガイドの残りの部分を消化しつつ、新しいことを学びます。 スタートガイド elm-repl REPLってなんか聞いたことがありますね。 ”値や関数に直…

Elmに入門する(2)

Elm

前回は、Elmという言語について簡単に学びました。 chuckwebtips.hatenablog.com 今回は、Elmをインストールして実際に書いてみます。 インストール インストールします。 公式:http://elm-lang.org/install Mac用のinstallerをクリック。 エディタ用にシン…

Elmに入門する(1)

Elm

今日から何回かに分けて、Elmに入門してみます。 AltJSの一種で、関数型リアクティブプログラミングであるElm。非常に楽しみです。 Elmとはなんなのか 1. HTML/CSS/JSにコンパイルされる AltJSの一種ということで、HTML/CSS/JSにコンパイルされるようです。…