はてなブックマークのビューワーを作った
公開:
「しんぷるはてぶ」というツールを作りました。
現在の主な機能としては次のようなものがあります。
- はてなブックマークのフィードを取ってきてタブ形式で表示
- エントリー一覧から任意のエントリーを選択すると情報とブックマーク一覧を表示
- メタブックマークがある場合はブックマーク一覧をタブ形式で表示
- エントリーがメタブックマークの場合は元エントリーも探してきてタブ形式で表示
- ブックマーク一覧でIDコールがある場合はコメントの下にIDコール先、IDコール元のコメントを表示
- メタブックマークでのIDコールは、コール先アカウントの下の階のコメントも表示
- コメントにあるURLを自動リンク
Microsoft Edgeレガシ(EdgeHTML版のほう)とInternet Explorerはサポート対象外です。
また、スマートフォンというか小さい画面での閲覧も対象外です。こっちはいつか対応するかもしれませんが、いまのところやる気はありません。
2014年にも同じ名前のものを作りましたが、そちらはYQLに依存した作りになっていましたので、YQLのサービス終了とともに動かなくなりました。
これはしょうがないことなので、データを取得する部分は自前で作りました。
自前のAPIはPHPでできています。データを取りに行くのには「Guzzle」を使いました。
CORSは、許可したサイトのみOKという形を取っています。Stack Overflowにあった「Access-Control-Allow-Origin Multiple Origin Domains?」を参考にして対応しました。
フロントエンド部分は「Svelte」です。最初はVueで作っていたのですが、Svelteを覚えたかったのでそちらに移行しました。
Svelteは基本的に書きやすくて好きですが、いまのSvelte(公開時のバージョンは3.18.1)はCSSのスコープ周りに癖があってやりづらいので、CSSは全部グローバルで書いています。どういうものなのかはIssueを見るとわかると思います。
フロントエンド部分はGitHubの公開リポジトリに置いてありますので、バグとか要望とかありましたらIssue投げてもらえると助かります。
デプロイは、このサイトと同じ構成でGitHub Actionsを使っています。プレビューにはNetlify。
作っていた中でいろいろな現象に遭遇しましたので、近いうちに紹介できればと思います。