Create Interactive Resume using world map widget (React + Recoil + d3 + ts) | by Eli Elad Elrom | Master React | Medium

atomはつくらずselectorだけ

selectorのgetの中で、asyncでデータを外部に読みに行く

たぶん初期化時に1回だけ更新されるselector

styled-componentsでsvgのcircleにアニメーションをつけている

svgの構築はjsxでやってる

可読性が、と思うけど、componentを再利用できるのは楽だなあ

しかし結局d3のapiの中でreact componentを渡せない?ので書きにくい気がしてきた

<g>にstyleをつけとくのが良いのかもしれない。d3で動的に生成したい<line>などに直接styleをつけない

うまくやるなら、<g>など静的なものをjsxにおいといて、その中身は動的にやるとかかな。全部動的にやると、それはそれで可読性が悪くてstyled componentsでつくったやつが使えなかったりする

jsxにsvgを書き、useRefでuseEffectの中でそれを参照してd3のapiで書いている