みずぴー日記

陽気なプログラマが世界を廻す

📋Trello.md

TrelloボードをMarkdownに変換してクリップボードに書き込むChrome拡張を作った。

ボードの例

f:id:mzp:20170613223211p:plain

変換後のMarkdownの例(esaで変換した)

f:id:mzp:20170613223222p:plain

📦インストー

Trello.md - Chrome Web Store

Trelloのボードを開いた上で画面右上のアイコンをクリックすると、Markdown化されたボードの内容がクリップボードに書き込まれる。

f:id:mzp:20170613224109p:plain

💞動機

ふりかえりのKPTを書くのにTrelloを使っていると、内容のスナップショットを保存したいことがある。 その際、ボードの内容をMarkdownに変換してesaなどに保存すると便利である。

この用途のためにYusukeKokubo/trello2md: Export Trello Cards to Markdown formatというのがあるが、CLIツールで若干起動が面倒だったのでChrome拡張にした。

✨Reason

ソースコードhttps://github.com/mzp/trello.md/にある。

見ると分かるが、実装はReason + Bucklescriptで行なった。 ソースコードの割合をみても大半がOCamlになっている。

f:id:mzp:20170613225138p:plain

JavaScriptのような文法

Dawn of reasonにあるようにReasonはJavaScriptに文法を寄せようとしているらしい。

f:id:mzp:20170613225519p:plain

実際、いくつかの箇所でそのようになっていた。 例えば、OCaml(Bucklescript)ではレコードの構築、オブジェクトの構築、JSONの構築はすべて違う文法で行なうが、Reasonでは見た目を似せようとしていた。

// レコードの構築
let x = {
  x : 0, y : 1
};

// オブジェクト < x : int, y : int> の構築
let x = {.
  x: 0, y: 1
};

// JSON(Js.Json.t)の構築
let x = {
  "x": 0, "y":: 1
};

ただすべての行末に ; をつける制約はなくてもよかったんじゃないかな、とは思う。

Chromeバインディング

ChromeAPIに対するバインディングは必要な分だけ、自分で定義した。

わりと自然に書けた気がするがやはり大変。

module Tabs = {
  type tab = Js.t { .
    url : Js.Null.t string,                                                    
    id : int
  };

  module OnUpdated = {
    external add_listener: (int => unit => tab => unit) => unit = "addListener"
[@@bs.val] [@@bs.scope ("chrome", "tabs", "onUpdated")];
  }
};

vim-reason

https://github.com/reasonml/vim-reasonをいれたが、なぜか一部のキーワードがハイライトされなかった。

syntax fileを見てみたら “Forked from Rust” と書いてあり、 box などがキーワード扱いされてておもしろかった。

その他所感

  • しっかりと型がつくのはいいなぁ。
  • Reasonのビルドより、Webpackによるビルドのほうが時間かかってる気がする。
  • Reasonだけだと文法がわからず、Discordで聞いたりソースコードを読んだりしてた。