Vue or Nuxt

2018.10.18 NuxtMeetup #5 @masaakikunsan

お前は誰だ?

・石岡 将明 (@masaakikunsan)

・今月から株式会社SCOUTER!!!!!!

・フロントエンドエンジニア

・Vue Fes Japn staff

・自称フロント界隈1の加藤恵オタク

Vuexの話書きました(boothで買って)

今回話さないこと

・VueとNuxtの細かい機能について

・VueかReactについて

みなさんNuxtを使ってますか?

使っている人はなんでNuxtにしたか答えられますか?

実はVueでも良かったってことないですか?

アジェンダ

・VueとNuxtの動向について

・Vueを導入するメリット

・Nuxtを導入するメリット

・どっちを導入するか

・まとめ

VueとNuxtの動向について

Vueの動向

npm trends

Vue CLI 3の登場

Vue Project Roadmap

Vue.js 入門 発売

Nuxtの動向

npm trends

Nuxt v2登場

Nuxt.js ビギナーズガイド 発売

VueもNuxtもどんどんバージョンアップし
便利に使いやすくなっていっている

どちらを導入すればいいか

Vue.jsを導入するメリット

JSでロジックを頑張る必要があるけど

jQueryは導入したくない時に気軽に導入できる

公式のエコシステムの豊富さ

・Vue Router

・Vuex

・Vue Loader

etc...

比較的に学習コストが低い

公式日本語ドキュメント

Nuxt.jsを導入するメリット

WebpackやBabelが隠蔽されてるのでその辺を知らなくても良い

SSRを比較的簡単にできる

ルーティングの自動生成で効率アップ

静的サイトジェネレーターとしての側面のおかげでSPAモードでもSEOなどを気にしなくていい

規約があることによりプロジェクトを破壊しにくい

どっちを導入する?

ここまでの話だとNuxtを使っておけば良さそうに見える

Nuxtを選んだ方がいいケースと
選ばない方がいいケースの紹介をします!

選んだ方がいいケース

SSRする必要がある

SEOを気にしないといけない

Vue.jsに精通してる人が多い

静的サイトを作成したい

選ばない方がいいケース

SEOを気にしなくていい

設計は自分でやりたい!

Vue.js初心者が多い

TSを使いたい

たまに聞く声

「Nuxtじゃないといけない理由は特にないけどルーティングを自動でやって欲しい」

それktsnさんが解決してますよ!

vue-cli-plugin-auto-routing

ちなみに...

僕は基本Nuxtしか書きません

まとめ

SEO・SSR以外の時はNuxtじゃないとダメって理由は基本ない

規約が欲しい時
SEOを気にしないといけない時

SSRする必要がある時は
Nuxtを選ぶ

初心者が多い時は書いているものがNuxtかVueなのかわからず検索に時間がかかりすぎることがあるのでその場合はVueを選んだ方が生産性が高くなる

Nuxtが便利だからって思考停止してませんか?

よく考えてVue/Nuxtでハッピーライフを!

株式会社SCOUTERでは全てのプロダクトでVue,Nuxtを使っています!

フロントエンドエンジニアを募集しているので気になる方は僕のところまで来てください!