Tweet
Tweet

Slide 1

Slide 1 text

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

Slide 2

Slide 2 text

フロントエンドエンジニア Vue.js, Nuxt.js Laravel スー Suguru Ohki @gurusu_program 酒は人生 副業

Slide 3

Slide 3 text

https://techbowl.co.jp/techtrain/

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

入った当時の状態

Slide 6

Slide 6 text

メンバー構成 開発チーム PM兼開発全般 フロントエンド バックエンド

Slide 7

Slide 7 text

1. ページをまたがるグローバルなストアが混沌としている 2. 関係ないページ用のストアの冗長なロードが起きパフォーマンスが悪い 3. SEO が重要にも関わらずサーバーサイドレンダリングを導入できていない 4. Firebase関連で一部のユーザーが永遠にログインできない致命的なバグの発生 5. ページ遷移時の UI チラツキが頻発

Slide 8

Slide 8 text

こちらをみてピンときた方！ お目が高い

Slide 9

Slide 9 text

No content

Slide 10

Slide 10 text

No content

Slide 11

Slide 11 text

1. ページをまたがるグローバルなストアが混沌としている 2. 関係ないページ用のストアの冗長なロードが起きパフォーマンスが悪 い 3. SEO が重要にも関わらずサーバーサイドレンダリングを導入できてい ない 4. - Firebase 認証に関連し一部のユーザーが永遠にログインできない 致命的なバグの発生 5. - ページ遷移時の UI チラツキが頻発

Slide 12

Slide 12 text

これ、うちの話ですw

Slide 13

Slide 13 text

1. ページをまたがるグローバルなストアが混沌としている 2. 関係ないページ用のストアの冗長なロードが起きパフォーマンスが悪い 3. SEO が重要にも関わらずサーバーサイドレンダリングを導入できていない 4. Firebase関連で一部のユーザーが永遠にログインできない致命的なバグの発生 5. ページ遷移時の UI チラツキが頻発

Slide 14

Slide 14 text

1. ページをまたがるグローバルなストアが混沌としている a. 状態管理をNuxtとTypeScriptを導入し、Actionから必ず状態を触る 2. 関係ないページ用のストアの冗長なロードが起きパフォーマンスが悪い a. 余計なロード部分を削りまくる。 3. SEO が重要にも関わらずサーバーサイドレンダリングを導入できていない a. 導入を進め、ついこの間導入完了 4. ~永遠にログインできない致命的なバグの発生 a. そもそもロジックのミスなので修正 5. ページ遷移時の UI チラツキが頻発 a. v-cloakやloadingIndicatorの導入など

Slide 15

Slide 15 text

● ほとんど凄腕の方にやっていただいてた ● ちょっとだけ手伝ってた ● まだ課題は山積み ● なんとかサービス運用をできるようになった

Slide 16

Slide 16 text

スタートアップにはありがちなので 気をつけていただければ！

Slide 17

Slide 17 text

No content