Vue Fes Japanの歴代スピーカー一覧を見られるページを作った
今年の10月19日に開催されるVue Fes Japan 2024のタイムテーブルが公開されました。このタイムテーブルを眺めているときに、RubyKaigiの登壇者まとめサイトを作っている方を見かけて歴代のVue Fes Japanのスピーカー一覧を見られるページを作ってみようと思って作りました。
サイト内容自体はシンプルで、全スピーカーを一覧で見られるもの、開催年とスピーカーそれぞれの発表一覧を見られるものを用意しています。
- https://vuefes-japan-speakers.nuxt.dev/
- https://vuefes-japan-speakers.nuxt.dev/2024
- https://vuefes-japan-speakers.nuxt.dev/speakers/Evan You
現時点で以下Vue Fes Japanサイトの情報が含まれています。2019年は開催されておりませんが、スピーカー情報は公開されているので含めるようにしてみました。
- Vue Fes Japan 2024
- Vue Fes Japan 2023
- Vue Fes Japan Online 2022
- Vue Fes Japan 2019
- Vue Fes Japan 2018
スピーカーのデータ自体は特段一元管理されていなかったので、各年のサイトデータから参照して取得し、名前などは一部修正してAPIとして取得できるようにまとめています。
取得ができるようになったので現時点で公開されている発表数をまとめてみました。
| イベント | 発表数 |
|---|---|
| Vue Fes Japan 2024 | 25 |
| Vue Fes Japan 2023 | 34 |
| Vue Fes Japan Online 2022 | 34 |
| Vue Fes Japan 2019 | 17 |
| Vue Fes Japan 2018 | 11 |
中止となってしまった2019年からしばらく経ってから開催された2022年より発表数が2倍にも伸びているのがわかります。
2024年は今後公開されるであろうスポンサーセッション分を入れると31件で、すべて合算すると127件になりそうです。
今回のサイト構築で使用したフレームワークはVue関連ということでNuxtを使用しています。compatibilityVersionの設定よりNuxt4の機能を使えるようにしているため、appディレクトリを使用した構成になっています。
app
├── app.vue
├── components
├── composables
└── pages
├── [year]
│ └── index.vue
├── index.vue
└── speakers
└── [name].vue
このサイトのビルド先には以前NuxtHubを活用した事例記事を見かけていたので自分も試してみようと思い、今回のサイトをNuxtHubでデプロイしてみました。具体的な導入方法は下記記事を参考ください。
今回作成したソースも公開しておりますので、併せてご覧になってみてください。
Discussion