WordPress + Nuxt.js でポートフォリオサイトを作る その13

WordPressサイト（https://works-wp.yuheijotaki.com/）の REST API と Nuxt.js でポートフォリオサイトを作成する。その13

GitHub: https://github.com/yuheijotaki/works-nuxt
Netlify: https://works.yuheijotaki.dev/

高速化／最適化

Chorme の Audits 使って改善できるところ改善

トップ

詳細

パフォーマンスのマイナスポイントはだいたい画像のサイズ関連、一応パンダちゃんで圧縮しているのですがたまーにこうなるのが謎..

ほかhtmlのlang属性つけたり外部リンクに rel="noopener" つけたりなど こちら でやったこと中心に対応。

htmlのlang属性付与 nuxt.config.js

  head: {
    htmlAttrs: {
      lang: 'ja'
    },

ドキュメント作成

作った。
https://github.com/yuheijotaki/works-nuxt/blob/master/README.md

ちょっとサービス図は WP REST API あたりが認識あやしい感じですがこんな感じかと思います。

まとめ

一通り見てもらえるくらいの出来になったのでポートフォリオサイトは完了です。

できていないこと

• Vue Store を使う
• Nuxt のSPAやSSRがあまり分かっていない
• nuxt generate WP以外で使うと分からなそう
• metaやSEO関係、実案件などでも通用するか？

これらありますが、全体としてはだいたいやりたいことできたかと
Vueはなんとなく使えるようになってきましたがまだまだなんちゃってな感じもしていて、基本がすっぽ抜けしてそうだったりstoreとか機能面の理解ができていないなと感じます。

なので引き続き何かサイト作ったり、既存のサイトに組み込んでいったりで使っていきたいと思っています。