Posts /

Gridsomeを使用して@myuunewsの説明ページを作成しました

Twitter Facebook Google+ Mastodon
30 Apr 2020

2020 年 9 月 1 日追記

Gridsome でビルドできなくなってしまったので FullCalendar をやめました。つらい。

この記事は 何か作るぞ!(GW Advent Calendar 2020) の 2 日目の記事です。1 日目は絵を途中まで描きました。

こんにちは!

こんにちは!ておりあです!声優 高木美佑さんの情報を集約する Twitter bot @myuunews というのをやっています。よろしくおねがいします。

さて

Gridsome というのを使って @myuunews の説明とかを書いておくページを作りました

Gridsome の選定理由

GatsbyJS というのがあります。

これはなんか React で雑にサイトを作るときに便利なやつ(静的サイトジェネレーター)で、これで作られているサイトに yoppinews.github.io とかがあります。

べんりそ~と思ったものの、React なんもわからん。

そこで Gridsome です。 Vue.js です。

逆張りオタクなので React に触らず Vue をやっていたためこっちの方がわかるやろとなって選択。Nuxt は?

やったこと

Gridsome のデフォルトスターターを基に色々書きました。実物を見てください。

カレンダー

myuunews の予定を Google Calendar で管理しているので、カレンダーを埋め込みました。

デフォルトの見た目が好きでないので(カスタマイズが難しい)、今回は FullCalendar を使いました。

便利ですね。

他

あとは Twitter タイムラインの埋め込みとか普通に。

終わりです。

そんな感じです。カレンダーを見たいときとかに開いてください。

記載漏れ等ありましたらご連絡いただけると幸いです。よろしくお願い致します。

何か作るぞ!(GW Advent Calendar 2020) の 2 日目の記事でした。明日もなにか作るぞ!


Twitter Facebook Google+ Mastodon