カレンダー検索アプリを作成しました。
概要
カレンダー形式で情報を表示するウェブアプリケーションを作成しました。以下、はてなブログの記事の一覧を対象にした表示例です。
https://static.ldas.jp/calendar/?u=https://nakamura196.github.io/json/calendar.json
https://github.com/ldasjp8/calendar
以下にアクセスして、「例」ボタン、「追加」ボタンをクリックすることで、表示例をご確認いただけます。
https://static.ldas.jp/calendar/
以下のような形式のjsonファイルのURLを引数に指定します。
https://nakamura196.github.io/json/calendar.json
以下、jsonファイルの作成方法の一例として、Excelファイルからの作成方法について説明します。
jsonファイルの作成方法
Excelファイルの作成
以下に示すようなExcelファイルを作成します。「metadata」と「items」の2つのシートを用意します。
https://docs.google.com/spreadsheets/d/14myDqZTxocwOT0Mw3ZzKLO81E6r15R-49oUh2dG9Rbo/edit?usp=sharing
シート「metadata」
本シートには、A列に示す「description」「header」「footer」「link」を用意します。以下の画面に対応します。
「link」については、B列「literal」が表示文字列、C列「uri」がURLです。複数行を入力可能です。
シート「items」
本シートの以下の列が、予約済みの項目です。collectionsとdateは検索フォームに使用されます。
- collections
- date
- label
- thumbnail
- url
- description
G列以降の「Updated」などは、任意の項目です。
上記の項目は、以下のように対応します。なお、セル内に複数の値を入力したい場合には、「|(パイプ)」で区切ってください。
jsonファイルへの変換
以下のGoogle Colabを利用して、用意したExcelファイルをアップロードして、jsonファイルに変換します。
https://colab.research.google.com/drive/1aJKbJjK9Gu4SwDp6IfGCHNuhTH3pJ3hp
上記プログラムの実行後、ダウンロードされたJSONファイルをGitHub PagesやGist、レンタルサーバ等にアップロードし、そのURLを以下のカレンダー表示アプリに入力してください。
https://static.ldas.jp/calendar/
(参考)はてなブログの記事を対象とした利用例
はてなブログの記事を対象とした利用例として、はてなブログのAtomPub APIを用いて、上述したExcelファイルを生成するプログラムを作成しました。以下の記事を参考にしてください。