-
Notifications
You must be signed in to change notification settings - Fork 3
Open
1 / 21 of 2 issues completedDescription
Which feature would you like to see added or improve
【イベント】
Describe the solution you'd like
間取り編集エディタにおいては、ピクセルやテキストボックスをはじめとして様々なStateが使われている。
現状、それらはpropsを通してコンポーネント間でやりとりされており可読性に欠けているのが現状である。
また、setStateが散発的に使用されているせいで、どういう状況でどのようにstateが更新されるのかを把握しづらい。
今後、機能拡張をする際に技術負債になりえることは容易に想像できる。
この問題の解決のために、状態管理用のライブラリを検討したい。
状態管理ライブラリを用意することのメリットは以下の通りである。
- propsを通したStateのやりとりを一掃できる
- setStateで書かれている部分の一元化
ライブラリについて
以下の3択に絞れる。
- Zustand: 近年Star数が伸びてきており、Reduxをもう少し使いやすくした感がある。
- Jotai: 上記2つとは経路が異なるライブラリ(atomというのがコンセプトになっている)
- Redux: 由緒正しきライブラリ、GitHubのstar数は最多
参考:
https://risingstars.js.org/2024/ja#section-statemanagement
https://bestofjs.org/projects?tags=state
注意:本チケットでリファクタするのはstateに振る舞いだけとし、canvasとstateとの同期部については絶対に編集しないようにする。
TODO
- 状態管理ライブラリのリサーチ(Zustand or Jotai) #258
- ツール系のStateをJotaiに置き換え #264
- 【イベント】【間取り編集】選択している色のStateをJotaiに置き換え #269
- ダイアログ系のStateを置き換え
- ピクセルのStateを置き換え
- 丸オブジェクトStateを置き換え
- テキストボックスStateを置き換え
Which directory to change
- front/package.json
- front/src/component(event/venueeditに関連する部分)
- front/src/hooks/event/venueedit
- front/src/stores/event/venueedit
Describe alternatives you've considered
他のライブラリも選択肢に候補にあがりうる。
Additional context
Zustandの紹介的な記事:
https://envader.plus/article/524
Sub-issues
Metadata
Metadata
Assignees
Labels
No labels