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