Vue
Vuex
DI
Class Based Store Option
シングルトンインスタンスへの一切の依存を排除
kahirokunn
@kahirokunn 又は k-okina の名前で活動
たまにQiitaでVue.jsやフロント全般設計に関して投稿してます
・新しい事をするのと、型が強いのが好きです。
・最近のマイトレンドは関数型プログラミング。なのでElm好き
・実は漫画とゲームと昼寝が何より好き
綺麗な設計とは?🤔
綺麗な設計 => 翻訳 => Clean Architecture
本来のクリーンアーキテクチャの事を1ミリも伝えられない言葉ですが、凄いざっくりレイヤードとの違いを言うと、外部通信への依存をOOPのDIPを利用して逆転させ、ロジックがそのままの意味でコードの一番深い所に持ってこれるようにする事.
クリーンアーキテクチャ自体を学びたい方はこちらを
外部通信への依存がなければstorybookに全てをマウントできるし、外部通信モジュール以外の全てのコードを単体テストも結合テストもモック無しでできるし、画像回帰テストも余裕のよっちゃん🤗
実際にはどうやって追い出すの?
Class Based Store Option
DIはInversifyJS任せ
恩恵: テスト辺
typescript-fsa-vuex
VuexのAction, Mutation周りの秩序とタイプセーフ、凡ミス等の問題を解決
じゃあGetter側は?
Reactのselectorパターンライクなのを実現できるヘルパー関数
サジェスチャデモ
フロントだってやればちゃんとクラスベースのオブジェクト指向もできるんです!
ありがとうございました!
Vueの話
By kahirokunn
Vueの話
- 1,814