bibを入力とした論文読みサイトを作ってみた

はじめに

論文管理,大変ですよね.日本語や英語問わず,論文を読むようになって思うのは,「論文へのアクセスに時間かかるな」ということです.一度読んだ論文をもう一度読みたい時.

  1. タイトルや著者もしくは会議で検索

  2. 学会の論文ページに飛ぶ

  3. 論文のPDFを開く

というような工程が必要です.特に検索フェーズが煩わしいです.人類が論文管理ツールを求める気持ちが良くわかりました.

このような背景から,論文の一覧がざっと見れて,簡単に検索できて,その論文のPDFにすぐに飛べるようなものを作りたいと思いました.また,個人的な話ですが,読んだ論文情報は自分の論文を書く時に引用する可能性も高いので,とりあえずbibに突っ込むことが多いです.よって,bibをうまく使いたいと思いました.そこで,以下のようなサイトを作りました.

gotutiyan.github.io

リポジトリはこちら:
https://github.com/gotutiyan/paper_yomiyomi

公開にはGitHub Pagesを利用していますので,URLをブックマークしたり,リポジトリをクローンしてローカルで動かす事もできます.

bibの構造

bibは,論文の情報を表したものです.

@inproceedings{vaswani2017attention,
  title={Attention is all you need},
  author={Vaswani, Ashish and Shazeer, Noam and Parmar, Niki and Uszkoreit, Jakob and Jones, Llion and Gomez, Aidan N and Kaiser, {\L}ukasz and Polosukhin, Illia},
  booktitle={Advances in neural information processing systems},
  pages={5998--6008},
  url={https://arxiv.org/abs/1706.03762}
  year={2017}
}

上記のように,タイトルとか著者とか,会議名,年度,urlなどを指定できます.Texで論文を書く時には,このような形式で論文情報を管理することが一般的です.urlの情報が入っていることが大きくて,この情報を利用することで便利なサイトが作れそうだと思いました.

ざっくりとした機能

今回作ったwebサイトの機能を簡単に紹介します.論文の情報は表形式で閲覧できて,1行が1論文に対応しています.一番右のLINKは論文ページのリンクです.

f:id:gotutiyan:20200728123017p:plain
論文の表示形式

各項目は検索もできます.正規表現も利用できて,複数の欄に入力した場合,AND検索になります.

f:id:gotutiyan:20200728124838p:plain
検索欄

支える技術

言語としてはHTML,CSSjavascript,ライブラリはbootstrapです.

全体的な処理

ユーザは入力するbibファイルを選択します.その後,javascriptのFileReaderを用いて中身を一旦抽出します.この時,正規表現を使って各情報を抽出し,構造体のようにしてまとめたオブジェクトを配列に入れていく感じです.

次に,配列の中で,検索で指定された条件に合わないものを除外します.

最後に,配列に残った情報をもとに,表を構築します.論文の情報はtable要素で表示しているため,th要素やtr要素を動的に生成して追加していくような処理になります.

おわりに

こういうのを発展させていくと,ログイン機能をつけて,各ユーザーの論文情報をサーバーに保存して... みたいなことになるんでしょうね.現状そこまでするつもりはありませんが...

もし良ければ,使ってみてください^^