こんにちは、だいちゃんです。

このブログはNuxt.jsで作られているのですが、僕の手抜き工事のせいで どの記事でもdescriptionがデフォルトのままな状態 で放置していました（汗）

SEO的にも問題ありますし、Twitterなどでシェアされるときもタイトル以上の情報を伝えられなかったので、改善するべくアップデートを行いました！

やったこと

やったことは簡単です。もっと早く実装すればよかったと後悔していますw

これまでは、全ページ分の header の内容を全て nuxt.config.js で指定していたのですが、今回からは、そこでは共通のmeta情報などのみに留めて、ページごとに可変の部分に関しては各ページのベースとなる単一ファイルコンポーネント（ .vue ファイル）に書くように変更しました。

元々、記事ページの大元になっている src/pages/article/_dateId/_slug/index.vue で header の内容を書き換える処理を書いているつもりだったのですが、うまく機能せず重複したりしていたようなので、素直に可変部分は nuxt.config.js に記述せず、それぞれで指定するだけにしました（知ってたけど放置してた）。

descriptionが指定されていたらそれを、指定されていなければデフォルトの文を出しています。

他に良い方法が恐らくあると思うのですが...。 mixinであんまり変数定義しないほうがいい （正確にはmixinで宣言しすぎるとトラップが多くなるから避けよう）みたいな記事も読んだので、今回は実装優先ということで各ページで指定させています。いまのところ、TOPと記事の2ページしかなく、わざわざ共通化しなくてもツラくなかったので。

実装は出来たものの...

実装自体はすぐに完了しましたが、久しぶりに改めて自分の書いたコードを読むとなんだかなぁという気分になりますw

Javascript自体まだまだ初心者の域を出ないので、Nuxt の良さや醍醐味を1ミリも活かせてないような気持ちです。 なんなら何でこのコードでブログが成り立ってるのかすらよく分かっていませんwww

とはいえ、そのためにNuxt.jsでブログを始めた側面もあるので 今後もこのブログのアップデートを通してフロントエンドのスキルを少しでも磨いていきます！