igrepのブックマーク - はてなブックマーク

Elm に CodeMirror を埋め込む - Qiita

Elm で描画した要素の中に JavaScript のコンポーネントを埋め込みたくなることがたまにあります。この記事では、よくある例としてエディタを埋め込むサンプルを作ってみます。今回使うライブラリは CodeMirror です。というわけで出来たのがこちら。 DEMO コードこれだけだと分かりにくいですが、エディタはちゃんと Elm の中にいます。下手に DOM をいじると Virtual DOM がエラーを出しますが、ポイントさえ押さえれば特に問題ないようです。 Elm 側のコード #editor 要素を元に CodeMirror に初期化してもらいます。 CodeMirror 特有の事情としては、この要素のすぐ後にエディタの要素が挿入されるため、その場所に他の要素は置かないようにします。 view : Model -> Html Msg view model = div [ cl

igrep 2018/12/09

リンク

Elm の最適化オプション --optimize - Qiita

Elm 0.19 で新しいオプション --optimize が導入されました。記事を見ただけだと実際に何をしているのかがちょっとわかりにくいので説明します。関数単位のデッドコード除去（--optimize 不要）まずデッドコード除去ですが、実は --optimize フラグをつけなくてもデフォルトで有効です。このデッドコード除去は記事に解説がある通り関数単位で行われます。つまり、大量の関数を用意しているモジュールの一部だけを利用する場合にも、使った関数だけがアウトプットに含まれます。レコードのフィールド名の変更こちらは --optimize の機能です。コード上でどんなに長いフィールド名 student.mostRecentGrade でも student.m のような短い変数名に変更します。 JavaScript で同じことをやろうとしても、 student['mostRe

igrep 2018/12/06

さすが。便利になったもんだ。

elm

リンク

Elm 0.19 の初期化方法 6 種類 - Qiita

2019 年 Elm をはじめる人が次に読むページです。（いえ、どこから読んでも良いです）この記事では Elm 0.19 のプログラム初期化の方法を紹介します。（Elm コードの書き方は紹介しません）出力は HTML と JS の２種類 HTML を出力（デフォルトは index.html）。

igrep 2018/12/03

いつの間にかNode.jsから呼ぶ用のものもできてたのかー。

node
elm

リンク

create-elm-app は何をしているのか - Qiita

create-elm-app という便利なツールがあって、これを使うとコマンド一発でプロジェクトの雛形を作ってくれたり、アセットの最適化とか諸々うまくやってくれます。内部的には webpack が使われています。 create-elm-app 自体の説明はこちらの記事を参照してください。一体何をしているのか「確かに楽なんだけど、裏で何をしているのか分からなかったから調べてみた」というのがこの記事の主旨です。だいたいここに書いてありますが長くてしんどいので要点だけ並べておきます。開発効率アップ編 HMR (Hot Module Replacement) リロードしなくても画面が最新に置き換わる魔法です。プロキシ機能 Dev Server を使いつつ API サーバーも同時に使うといったことが出来ます。elm-package.json に次のように設定を追加すると有効になります。これ

igrep 2017/12/24

便利なものができてるんだなぁ。

Elm
webpack

リンク

Elm で構文解析しよう - Qiita

こうすることによって、生の文字列よりもプログラムで扱うことが簡単になります。しかし、どうすればこの構造を得ることができるのでしょうか？少し考えてみましょう。 split と trim で頑張る正規表現で頑張るループで頑張る全部つらそうですね。 Elm の構文解析器（パーサー） elm-tools/parser は、そんな構文解析を超シンプルな記述で実現してしまうライブラリです。Elm の作者である Evan 氏自身によって書かれています。例として公式のサンプルを引用してみます。ここでは ( 3, 4 ) のような文字列を２次元の座標として解釈するパーサー point を定義しています。 import Parser exposing (Parser, (|.), (|=), succeed, symbol, float, ignore, zeroOrMore) type alias

igrep 2017/12/02

よくできてるなぁ。

Elm
parser

リンク

[Elm] Effect Manager のしくみ - Qiita

Elm Advent Calendar の 19 日目です。 Effect Manager とは Effect Manager はElm 0.17から導入された新しい仕組みで、Cmd/Sub に関連する複雑な状態を管理することが出来ます。とはいえ、Effect Manager はかなり上級者向けの仕様になっており、導入から半年以上経った今でもドキュメントすらありません。また、Effect Manager を使ったパッケージは現時点では公開できないことになっています。というわけで、あまり一般ピープルが使うことは想定していないようですが、せっかくなのでどういう仕組みで動いているのかを調べてみました。（以下、非公式の解説なので鵜呑みにしないでください。） Effect Manager モジュール一覧 Effect Manager は、Effectモジュールという特別なモジュールのみ使うことが出

igrep 2016/12/28

“Cmd/Sub に関連する複雑な状態を管理する”

Elm

リンク

[Elm] Web API サポート状況 - Qiita

Elm Advent Calendar 2016 の16日目です。 Web API のサポート状況 A Farewell to FRP で触れられている通り、Elm は Web API を使ったライブラリの公開をコミュニティに許していません。（これについては議論すると長くなるので、詳しくは読みにいってください。）そこで、よく知られている Web API のサポート状況をざっくり表にまとめました。該当パッケージがない場合は、Port を使いましょう。 API 該当パッケージ補足

igrep 2016/12/16

elm-web-apiがあった頃から感じているんだけど、ブラウザのAPIをWeb APIと呼ぶことにすごく違和感を感じるのだけどどうなんじゃろ。

elm

リンク

[Elm] Html.Lazyによるパフォーマンス最適化 - Qiita

Elm Advent Calendar 2016 の10日目の記事です。今回は、Html.Lazy モジュールについて。 Html.Lazy とは Virtual DOM のパフォーマンスがいくら良いとは言え、無駄な Virtual DOM を際限なく作り続けるとコストになります。そこで、Html.Lazy モジュールはこのコストを抑え、パフォーマンスを最適化する方法を提供します。仕組み一言で言うと「モデルが変わらなければビューも変わらない」という性質を利用します。Elm の関数はすべて純粋であることが保証されているため、引数が変わらなければ返す結果はいつも同じです。そこで、Elm ランタイムはHtmlを生成する関数の引数が前回と同じであるかを見て、同じであればロジックを丸ごとスキップして前回の値を使いまわします。使い方使い方は簡単です。ビューを生成する関数の頭にlazyとつける

igrep 2016/12/10

素晴らしい。 "引数の同一性を「参照の一致」によって判定"

リンク

Elmにおけるバグ報告・機能要望の出し方 - Qiita

基本的に新しい機能に対しては慎重なので、いきなりPRを送ってもまずマージされません。特に議論が必要になりそうなものは、Issueではなくelm-discussでコンセンサスを取るところからはじめるのが良いでしょう。要望の内容は、ユースケースを一緒に書くと喜ばれます。ただ「この機能がほしい」と言っても「なぜそれが必要になるのか？」と問い詰められるので、「こういうことをする時にこの機能がなくて困るから追加してほしい」と説明するのが良いです。そうすると、今のAPIがそのようになっている理由を説明されたり、別の解決方法じゃなぜ駄目なのかという話になり、最終的に「もっともらしい」と判断されると人知れずタスクに詰まれます。例えば、「型クラス追加して欲しい」よりも、「辞書のキーにBoolを入れられるようにして欲しい」とか「回避策としてBoolをStringにシリアライズするとコード量が3倍になった」

igrep 2016/12/08

リポジトリーが細分化されてるの、結構一見さんがたらい回しされるし辛いんだよなぁ。悩ましい。

リンク

はてなブックマーク

タグ

ブックマーク / qiita.com/jinjor (9)

お知らせ

今週のはてなブックマーク数ランキング（2024年9月第4週）

今週のはてなブックマーク数ランキング（2024年9月第3週）

今週のはてなブックマーク数ランキング（2024年9月第2週）

公式Twitter

キーボードショートカット一覧

はてなブックマーク

公式Twitter

はてなのサービス