「イベント福井」
どの語彙を使うか迷うところですが、政府CIOポータルの「標準ガイドライン群」にある「行政サービス・データ連携モデル イベントデータモデル(β版)」と「共通語彙基盤」をベースに日本語で設定しました。
「event_fukui.csv」
ひとまずシンプルに並べて表示するこのアプリ、CSSとJavaScriptが中心のHTML1ファイル
- CSSのflexレイアウトを使用して、タイル状に並べています
- 横幅に合わせてレスポンシブに横に並べる数を変えるmedia queryを書きました
- 画像のアスペクト比を固定する aspect-ratio: 16 / 9 と、いい感じにクロップしてくれる object-fit: cover が便利です
- キーカラーにCSS変数を使っているので、イメチェンも簡単です
forkしていろいろ遊んでみてください。イベント情報の追加プルリクもOKです!
(code4fukui / event_fukui src on GitHub)
HTMLをスクレイピングしてCSVデータ化するJavaScript/Denoコードと共にGitHub Pagesでオープンデータ公開しているリポジトリはこちら。
(code4fukui / event_fukui_data - src on GitHub)