Home > Vue.js/Nuxtを採用した事例勉強会に参戦しました!

Vue.js/Nuxtを採用した事例勉強会に参戦しました!

Vue.js/Nuxtを採用した事例勉強会に参戦しました!

Sun Feb 03 2019

Nuxt.jsでモダンWeb設計

技術構成は、Next + Laravel + Firebase (Chat) = SPA

感じたメリットは以下の通り、一方でデメリットは現時点で存在しないとのこと。

  1. ルーティング周り
  2. ミドルウェアを使ったレンダリング処理の柔軟さ
  3. 自由に使えるプラグイン

強いて言えばビルド時にブラックボックス化(よく分からないエラーでコケる)

ビルド時間が長いことを挙げられましたが、

私も分かりみ深いなぁ、と言った感じでした。

TABETEのフロントエンドをNuxt.jsでリプレイスする話

Rubyの改修、Vueでリプレイスの選択肢が存在する中で、

綺麗なAPI、サービスに必要なAPI全て揃っている観点から後者(リプレイス)を選択。

Vueの良さは入りやすさ、コミュニティでの親切さは凄く感じました、とのこと。

Nuxt.jsでプロダクトを開発して得た知見

規約やミドルウェアなど、最初の登壇ネタとほぼ被りました!

技術以外でブランディング向上を実現。PC/SP対応やキャッシュ、といった自身の経験外の話もされ参考になりました。

mixinsで動的にComponentを分けた

工夫した点はnuxtendを採用して、asyncDataでPC/SPを分けた。

Client/Serverでキャッシュの扱いを変更した

Clientでuniversal-cookie、Serverでcookie-universal-nuxtを採用した。

Vueと共に走ったフロントエンドリプレイス1年間

データ駆動周りやテスト(Karma)など、ロジックを中心に詳しく書かれているスライドでした!

明らかに登壇時間が足りていないなぁと。

Atomic Designを流用した

routerLayoutsは画面レイアウトを共通化したものという話のようですが、

templatesの代わりのように見えました。

ルーティングの肥大化

router-viewを使うこと前提のvue-routerだからこそ、起こり得る問題。

結論、Nuxtを採用しておけばもう少しマシになったかもしれません。

LTセッション

当日朝一大阪より飛んで、かなり歩き回ったせいか、非常にお疲れでございました。

折角の機会にもっとお話できれば良かったですが。😅

とはいえ今回、Vue.js/Nuxtの採用事例について、

生のお話を聞けたのは良い機会となりました。(関西でもやりたいなぁ)

コメントを残す

※ 返信が必要な方はメールアドレスも入力してください