🏓

Next.js で Node.js の API がいつ入ったのかわかる表を作る

2021/06/04に公開

Node.js の API がいつ入ったのかを調べる必要が出てきた。

もちろんリリースノートを見たり、ドキュメントの History を見れば調べられることが多いが、普通に面倒くさいので、いい感じの表とかを自動で生成できたら嬉しい。

どうやら公式ドキュメントは Markdown で管理されており、Added の情報はその Markdown の中のコメントに YAML として書かれているらしい。

なので、Markdown の内容を fetch して Markdown としてパースし、その中の特定のコメントをさらに YAML としてパースすることでデータがとれそうだった。

そして、そのデータをビルド時にひっぱってくる静的サイトがあればいつでも見れて便利だし、ビルド時にしか fetch しないので比較的行儀も良い。

ということで作ったみた。

https://github.com/sosukesuzuki/nodejs-api-table

実際のサイトはこちら https://nodejs-api-table.netlify.app/

こんな感じの表になっており、入ったバージョンとバックポートされたバージョン、そしてドキュメントが見れるようになっている。また、モジュールごとにフィルタリングができる。

また、今回は要件的に Node.js 10 以降のみを表にしたが、もっと古いのが知りたくなったら変更できるようにしようと考えている。

技術的には、Next.js の SSG でビルドし、ビルド時に対象のドキュメントの Markdown を fetch してパースし、props としていい感じに渡す。UI のことをあまり考えたくなかったので Chakra UI でざっと作った。

fetch したりパースしたりする実装は https://github.com/sosukesuzuki/nodejs-api-table/blob/77d1918367428bf24f880a8473d7e643a6e1b04d/src/libs/get-module-records.ts にある。本家のドキュメントの HTML を生成する実装を真似た。

Markdown のパースにはmdast-util-from-markdown、AST のトラバースにはunist-util-visit-parentsを使っている。

正直こんなこともしたくないので、公式から良いのが提供されてるよとか知ってる人がいたら教えて下さい。

Discussion