macoblog

「ゲーム × プログラミング」で生きていく

【最新版】Vue.js・Nuxt.jsの導入事例/サービス・サイト一覧

プログラミング

WEBトマトWEBトマト

どうも、とまとです。フロントエンドで最近よく使われている、Vue.jsやNuxt.jsのサービス事例を資料にまとめる機会がありまして、せっかくなので皆さんにも情報を共有しておきたいと思います。

この記事では、Vue.jsNuxt.jsで作られているサイト及びサービス事例を紹介しています。最新のフロントエンド技術(Vue.js)で作られているサービスや企業が気になる方は参考にどうぞ。

目次【本記事の内容】 [ click ]

Vue.js・Nuxt.jsの導入事例まとめ

WEBサイト

コーポレートサイトなど動的コンテンツが少ないWEBサイトはNuxt.jsと相性が良く、サイト全体を手軽に構築できるNuxt.jsの採用が目立ちます。WEBサイトでは定番のブログ機能に関しても、Nuxt.jsではJAMスタックに開発出来るので問題なし。
WEBトマトWEBトマト

コーポレートサイトなど静的サイトを作るならNuxt.jsは最適、サイトの質も上がるし開発効率も改善されるのでメリットしかない。

WEBサービス

コーポレートサイトと比べて動的コンテンツの多いWEBサービスでは、バックエンドとの兼ね合いで部分的にVue.jsを適用させているサービスが多い印象を受けます。あと、既存のサービスに関してはリプレイスする際のリスクを考慮して部分的に適用するだけに留めている背景も少なからずあると思います。
WEBトマトWEBトマト

ちなみに、メルカリはReact系のGatsby.jsで構築されています。システム規模が大きいとReactが採用されがちですね。

ECサイト

商品がメインのECサイトはVue.jsと相性が良く、フロント部分だけ適用させている事例が多いです。リサーチしてて改めて感じたのが表示速度の速さ、Vue.jsを組み込む最大のメリットはユーザー体験の向上です。
WEBトマトWEBトマト

Vue.jsを使用していない普通のECサイトはとにかく遅い、動きがもっさりしているので離脱するユーザーも多そう。いつまでローダー回してんだよ!早く表示しろや!

終わりに

いかがでしたでしょうか。

世界的に人気なのはReactですが、国内ではVue.jsがかなり人気で、最近はNuxt.jsを使ってサイト制作する企業も増えてきました。正直なところ、今後はNuxt.jsを使ったサイト制作が主流になってくるのではと思っています、もちろん多少時間はかかるとは思いますが。

Vue.jsやReact.jsはフロントエンド界隈では以前からトレンド技術として注目されていますし、今ではもはや定番になりつつある。あと何年かすれば情報量も増えてある程度のフロントエンド人材はNuxt.jsないしNext.jsの利用がスタンダートになると思います。

ちなみに、このブログのアプリ検索機能もVue.jsを使って実装しています。本当はNuxt.jsで再構築したいけど400を超える記事と、依存コードの関係で移行できないのが本音😂

おまけ:Vue.jsが導入されているか確認する方法

Vue.js・Nuxt.jsが導入されているか確認する方法

←なし、←Vue.js、←Nuxt.js

Chromeの拡張機能からVue.js devtoolsをインストールして有効にしておくと、Vue.js・Nuxt.jsを導入しているサイトを開いた時にアイコンが変化するので、これで確認できます。

是非お試しあれ。