Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Jotaiをプロジェクトに導入してみた
Search
Shogo
December 10, 2022
0
14
Jotaiをプロジェクトに導入してみた
Shogo
December 10, 2022
Tweet
Share
More Decks by Shogo
See All by Shogo
フロントエンド UIコンポーネント Shadcn/uiの良さを伝えたい!
shogo4131
0
28
本業 + 副業2社で働くエンジニアの時間術
shogo4131
0
110
スタートアップで学ぶフルリモート開発の進め方
shogo4131
0
410
フリーランスエンジニア辞めてみた!
shogo4131
0
470
激戦区東京でフリーランスとして生き残った方法3選
shogo4131
0
9
MUIは不要? React次世代コンポーネントライブラリ Mantine!!!
shogo4131
0
21
Featured
See All Featured
Raft: Consensus for Rubyists
vanstee
133
6.3k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
20
1.8k
Art, The Web, and Tiny UX
lynnandtonic
290
19k
Designing the Hi-DPI Web
ddemaree
276
33k
What's new in Ruby 2.0
geeforr
338
31k
In The Pink: A Labor of Love
frogandcode
138
21k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
14
1.5k
No one is an island. Learnings from fostering a developers community.
thoeni
16
2.1k
Fireside Chat
paigeccino
22
2.7k
Faster Mobile Websites
deanohume
300
30k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
14
8.4k
Testing 201, or: Great Expectations
jmmastey
30
6.4k
Transcript
Jotaiをプロジェクトに導 入してみた @react_nextjs 2022/12/10
自己紹介 ・フロントエンドエンジニア(フリーランス) ・経験2年8ヶ月 ・React Next.js TypeScript ・大手決済サービスのフロントエンド開発 ・技術ブログ(https://react-uncle-blog.netlify.app/) ・Twitter(https://twitter.com/react_nextjs)
アジェンダ ・Jotaiってなに? ・プロジェクトに導入した経緯 ・サンプルソースの紹介
皆さん!! Jotaiって知ってますか??
Reactの状態管理ライブラリです!! 公式: https://jotai.org/
JavaScript Rising Starsで堂々の3位 参考: JavaScript Rising Stars 2021
詳しくは技術ブログで!! Reactの状態管理ライブラリを比較してベストな選択肢をしよう!
なぜプロジェクトで導入したのか?
要件 ・複数のページ間で保持しないといけない値が多かっ た ・グローバルで管理する状態を永続的に管理しないと いけなかった
その他候補に上がった状態管理ライブラリ ・Recoil ・Zustand 候補には上がりましたが、次の理由で選定から外しました。
• Recoil ◦ 正式リリースじゃないので破壊的変更がくる可能性があった ◦ パッケージサイズがやたらと重い(2.2MBくらい) ◦ 永続化するにはrecoil-persistというライブラリを別で導入しない といけない •
Zustand ◦ Reduxよりは簡潔に記述できるが、プロジェクトが始まった当初、 他メンバーのスキル感があまり高くなかったので学習コストがか かると感じた
消去法ではあったがJotaiに決まった ・学習コストがとても低く、React HooksのuseStateのように状態管理が できるので最低限のReactの知識があれば問題ないと感じた ・Recoilは状態の永続化をするのに別ライブラリを導入しないといけな かったが、Jotaiであれば標準搭載しているAPIがあるのでライブラリを 導入する必要がなかった ・作者が日本人なので日本語の情報が豊富
Jotaiのコードを簡単に紹介!!
None
None
ご静聴ありがとうございました!!