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
Designing for humans not robots
tammielis
247
25k
Building a Scalable Design System with Sketch
lauravandoore
457
32k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
84
45k
Bootstrapping a Software Product
garrettdimon
PRO
302
110k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
41
4.5k
Optimizing for Happiness
mojombo
371
69k
How to name files
jennybc
65
94k
Automating Front-end Workflow
addyosmani
1357
200k
Six Lessons from altMBA
skipperchong
22
3k
Keith and Marios Guide to Fast Websites
keithpitt
408
22k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
22
1.4k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
123
39k
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
ご静聴ありがとうございました!!