Vue.js 入門した時の現場がカオスだった話

Yumemi.vue #2に登壇した時の資料。
更新したりするかもしれません。
最新は以下のURLをご覧ください。
https://docs.google.com/presentation/d/1slxPpssPD0_7ss8dvqL8InYx5tMYtIX96RnjU8aaqmE/edit?usp=sharing

Transcript

1. Vue.js入門した時の現場が カオスだった話
2. フロントエンドエンジニア Vue.js, Nuxt.js Laravel スー Suguru Ohki @gurusu_program 酒は人生 副業
3. https://techbowl.co.jp/techtrain/
5. 入った当時の状態
6. メンバー構成 開発チーム PM兼開発全般 フロントエンド バックエンド
7. 1. ページをまたがるグローバルなストアが混沌としている 2. 関係ないページ用のストアの冗長なロードが起きパフォーマンスが悪い 3. SEO が重要にも関わらずサーバーサイドレンダリングを導入できていない 4. Firebase関連で一部のユーザーが永遠にログインできない致命的なバグの発生 5. ページ遷移時の UI チラツキが頻発
8. こちらをみてピンときた方！ お目が高い
11. 1. ページをまたがるグローバルなストアが混沌としている 2. 関係ないページ用のストアの冗長なロードが起きパフォーマンスが悪 い 3. SEO が重要にも関わらずサーバーサイドレンダリングを導入できてい ない 4. - Firebase 認証に関連し一部のユーザーが永遠にログインできない 致命的なバグの発生 5. - ページ遷移時の UI チラツキが頻発
12. これ、うちの話ですw
13. 1. ページをまたがるグローバルなストアが混沌としている 2. 関係ないページ用のストアの冗長なロードが起きパフォーマンスが悪い 3. SEO が重要にも関わらずサーバーサイドレンダリングを導入できていない 4. Firebase関連で一部のユーザーが永遠にログインできない致命的なバグの発生 5. ページ遷移時の UI チラツキが頻発
14. 1. ページをまたがるグローバルなストアが混沌としている a. 状態管理をNuxtとTypeScriptを導入し、Actionから必ず状態を触る 2. 関係ないページ用のストアの冗長なロードが起きパフォーマンスが悪い a. 余計なロード部分を削りまくる。 3. SEO が重要にも関わらずサーバーサイドレンダリングを導入できていない a. 導入を進め、ついこの間導入完了 4. ~永遠にログインできない致命的なバグの発生 a. そもそもロジックのミスなので修正 5. ページ遷移時の UI チラツキが頻発 a. v-cloakやloadingIndicatorの導入など
15. • ほとんど凄腕の方にやっていただいてた • ちょっとだけ手伝ってた • まだ課題は山積み • なんとかサービス運用をできるようになった
16. スタートアップにはありがちなので 気をつけていただければ！