ここ2年ほど、すっかりフロントエンド開発者になっている藤田です。以前、Reactフロントエンドの状態管理ライブラリRecoilについて記事を書きました。 Recoilで快適フロントエンド開発 Recoil Syncでさらに快適フロントエンド開発 その後どうなったかというと、実はRecoilからJotaiに乗り換えていて、半年ほど経ちましたので、Jotaiについて書きたいと思います。 サイトの一行目から「Recoilにインスパイアされた」と言ってるとおり、Recoilの良いところを受け継ぎ、不便なところを無くしたような状態管理ライブラリです。 Jotaiの基本 基本はRecoilとほとんど同じで、React.useStateを便利にしたような感覚で非常に簡単に使えます。3ステップで見てみましょう。 1. Providerで囲む アプリケーション全体を<Provider>で囲みます。 impo
最近知り合いのエンジニアから「Jotai」という状態管理ライブラリがRecoil より軽くてつかいやすいよ！と教えてもらったので早速「Jotai」をさわってみみました 🐣Jotaiとは？ パッケージ名は日本語の「状態」から名付けられた Recoil にインスパイアされたatomモデルを採用しReactの状態管理を行える atom依存関係に基づいてレンダリングが最適化されるためReactコンテキストの余分な再レンダリングの問題を解決し、メモ化技術の必要性を排除している ミニマルなAPIを提供している TypeScriptで開発されている 📝使い方 *https://jotai.org/ より引用 import { atom, useAtom } from 'jotai' // Create your atoms and derivatives const textAtom = atom(
GitHub - pmndrs/jotai: 👻 Primitive and flexible state management for React
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
JotaiとRecoilは似てます。一方で、細かい違いは多くあります。決定的な違いを一つ挙げるとすれば、stringをkeyにしているRecoilに対して、Jotaiはatomのobject referenceをkeyにしています。表面的にはstring keyを指定しなくて良い手軽さが売りになっています。 よくある比較： // Recoil const greeting = atom({ key: 'greeting', default: 'hello' }); // Jotai const greeting = atom('hello'); では、表面的ではない違いは何でしょうか。もう一つのポイントは内部実装に Map ではなく WeakMap を使っていることです。つまり、atomのreferenceが無くなればJotaiのstoreからもそのうち消えるということです。
【海外記事紹介】フロントエンドの状態管理ライブラリを比較する ー Redux/MobX/NgRx/Pinia/Recoil/Jotai
2月3日、LogRocketが「TypeScriptの状態管理ソリューションを比較する」と題した記事を公開しました。この記事は海外で非常に好評を博しており、日本のエンジニアにも有益な情報となると考え、概要を紹介します。 2月3日、LogRocketが「TypeScriptの状態管理ソリューションを比較する」（Comparing TypeScript state management solutions）と題した記事を公開しました。 この記事は海外で非常に好評を博しており、日本のエンジニアにも有益な情報となると考え、概要を紹介します（詳しくは元記事をご覧ください）。 この記事では、フロントエンド開発における状態管理に焦点を当て、特にReact、React Native、Vue、およびAngularなどと合わせて使用するTypeScriptライブラリについて詳しく紹介されています。 Redux
Fully compatible with React 18 and the upcoming use hook. Now with a store interface that can be used outside of React. Jotai takes an atomic approach to global React state management. Build state by combining atoms and renders are automatically optimized based on atom dependency. This solves the extra re-render issue of React context, eliminates the need for memoization, and provides a similar de
JotaiはReactの新しい小粒な状態管理ライブラリ
Spring BootによるAPIバックエンド構築実践ガイド 第2版 何千人もの開発者が、InfoQのミニブック「Practical Guide to Building an API Back End with Spring Boot」から、Spring Bootを使ったREST API構築の基礎を学んだ。この本では、出版時に新しくリリースされたバージョンである Spring Boot 2 を使用している。しかし、Spring Boot3が最近リリースされ、重要な変...
Introduction If someone has already looked into package.json in the jotai library, they may find "exports" field. https://github.com/pmndrs/jotai/blob/v1.6.4/package.json#L18-L31 "exports": { "./package.json": "./package.json", ".": { "types": "./index.d.ts", "module": "./esm/index.js", "import": "./esm/index.mjs", "default": "./index.js" }, "./utils": { "types": "./utils.d.ts", "module": "./esm/u
祝！Jotai v2リリース
それだけだと怒られそうな気もするので、一応👇 リンク集 雑多なメモ v2 API自体はv1.11.0からpre-releaseしていたので、今回の変更は古いコードを消しただけ Webサイトがリニューアルされたことの方が意味が大きいかも v2 APIはRecoil互換の決別とも言える ずっとやりたかったstate branchingはあきらめた、Reactから機能が提供されないと無理で、その見込みがないため その結果、store APIを作ることができ、zustandに近づいた store APIは乱用されそう、できるだけ使わない方が良い Jotai Labsのorg nameをjotaijsにした
はじめに 本記事ではJotaiというReactのライブラリを紹介します。名称は日本語の「状態」から来ています。最近、Zustandというライブラリのメンテナスを任されているのですが(紹介記事)、その議論の中でZustandの枠には収まらないアイデアが出てきて、じゃあもう一つ作ればいいじゃん、となりました。Zustandはドイツ語の「状態」なのですが、誰かが日本語の「状態」を調べて、Jotaiって言うんだ、npmでもまだ使われていないパッケージ名だ、となりました。 そんなこんなで9月にリリースしました。リリース時のツイートがこちら we are releasing JŌTAI today https://t.co/T66zQVyKcz 🎉 this is @dai_shi 's take of the atomic state model. quite similar to recoil
React 用状態管理ライブラリ「Jotai」に入門
こんにちは．株式会社ゆめみの Keeth こと桑原です． 今回は Jotai という React 用の超軽量な状態管理ライブラリを触ってみたので勉強ログとしてまとめました．軽く使ってみた感触としては非常にシンプルで分かりやすく，導入も簡単でしたのでしたね． ただ，既に Jotai リリース後ある程度時間が経っており，Google で検索していただくとわかるかと思いますが，Jotai に関する記事もいくつかありますので，二番煎じな内容もありますことをご了承頂ければと思います． ※一応自分が手を動かしたコードのリポジトリも載せておきます 👇 https://github.com/kkeeth/my-jotai-demo TL;DR とにかく軽量で簡単 Redux が冗長に感じ，もっとライトなものを探している人にオススメ 軽量な分ルールが少ないのでカオスにならないように注意 Jotai の概要
導入 Reactive ProgrammingではSignalという概念があるらしいですが（実はもっと古くからある概念）、SolidJSが導入してReact Hooksとの差が明確になったのかと思います。 「Signal」は Solid のリアクティビティの基礎となるものです。これらには、時間とともに変化する値が含まれており、Signal の値を変更すると、それを使用しているすべてのものが自動的に更新されます。 とのことです。ObservableとかStreamとかも似たようなものですかね。 SolidJSのポイントはSignalを使ってfine-grained reactivityを実現しているところだと思います。ReactのようにVirtual DOM（とはもう呼ばないらしい、DOMじゃないので。でも、以下VDOM）を使わずに局所的にDOMを直接更新するのでパフォーマンスが良いとのこと
Reactの状態管理ライブラリであるRecoil, Jotaiは宣言的かつシンプルにデータフローグラフを構築するライブラリです。 原始的な機能の集合体であり、直感的に状態管理を実装できる反面、潜在的に壊れやすいコード(Reactの哲学と反するコード)もかけてしまいます。 コンポーネントとAtomが密結合になっている例 Atomを外部に公開してしまうと、途端に状態管理が無秩序となります。 内部データの取り扱いや更新ロジックなどの解釈が利用者へ委ねられるためです。 これによって、状態の不整合が発生しやすくなります。 行儀よく状態を扱うには、DIKWピラミッドの考え方が参考になるかもしれません。 DIKWピラミッド DIKWピラミッドは情報をデータ、情報、知識、知恵の4階層構造に分ける考えで、情報に関するものであればどのような分野でも応用の効く考え方です。 データや情報だけでは、文脈がわからない
Jotai vs. Recoil: What are the differences? - LogRocket Blog
Yaroslav Lapin I'm a self-taught software engineer with over 10 years of experience. I like Elixir/Erlang and React/TypeScript. You can follow me on Twitter @JLarky. It’s practically a meme at this point that React has too many state management libraries, but no one is going to stop creating new ones anytime soon. It looks like apart from using plain old React state, approaches for state managemen
Jotaiは手軽に使える状態管理ツール
株式会社パルケの手を動かすCTO、みつるです。 この記事は先日ツイートしたものを加筆修正したものとなります。 少し前まで、Reactの状態管理ツールはZustandがファーストチョイスでした。 今は考えが変わってJotaiがファーストチョイスとなっています。 以前、状態管理ツールの沼にハマって試行錯誤した経緯はこちらの記事に書きました。 この後、状態管理ツールに対する考えに変化があり、今は私にとってJotaiがファーストチョイスとなっています。 状態管理ツールの責務が軽減された TanStack Queryを積極的に使い始めてから、サーバーと同期するようなトランザクションデータはTanStack Queryのキャッシュ任せになりました。 そうすると、状態管理ツールが担っていた役割がどんどん少なくなっていきました。 結果として残ったのは、コンポーネントのPropsで受け渡しをするには面倒な、
よく誤解されるのですが、atomはステートの定義であって、atomオブジェクト自身は値を持ちません。ObservableやSignalとの違いはそこにあるかもしれません。 atomが単なる定義だとするとどういうメリットがあるでしょうか。再利用性が高くなります。以前作った簡単な例がこちら： 複数のProvider配下で、atomはそれぞれ別の値を持ちます。 ちなみに、Jotai v2によってstoreの存在が明確になったので、説明はしやすくなりました。atomの値はstoreで保持されます。storeはざっくりatomとその値のWeakMapです。
を見ました。これめっちゃ面白い。再帰selectorかっこいい、ほれました。Loadableの使い方も素敵。 Jotai版を作ってみたくなりますよね、はい。作りました。 ほとんどコードの中身を理解せずに移植して、あとからコード読みました。ちなみに、移植で大変だったのは、型の付け方が微妙に違うことです。それ以外はほぼ単純な変換。ここまで互換性があったとは。 出来上がったもの コード Recoil版からそのまま使えるものはimportしてます。 import { Suspense, useEffect, useRef } from "react"; import { Atom, atom, useAtomValue, useSetAtom } from "jotai"; import { atomFamily, loadable } from "jotai/utils"; import { Q
Welcome to the Jotai v2 documentation! Jotai's atomic approach to global React state management scales from a simple useState replacement to an enterprise application with complex requirements. FeaturesMinimal core API (2kb)Many utilities and extensionsTypeScript orientedWorks with Next.js, Gatsby, Remix, Waku, and React NativeCoreJotai has a very minimal API, exposing only a few exports from the
はじめに 本記事では、Reactの状態管理ライブラリであるJotaiにおける、リクエスト処理など非同期処理の基本的な方法を紹介します。 概要 Read-Only Atom の復習 <- Jotai初学者向け 非同期処理を持つ Read-Only Atom の扱い方の紹介 <- Suspense と Async atomの基本 非同期で配列表示する例 一覧画面の例 <- ページネーション無し 注意点 Dependency Atom と Async Atom、 jotai/utis の紹介 <- 実践向きな使い方の紹介 Dependency Atom って何？ <- Jotai初学者向け ページネーション <- Dependency Atomを用いた例 キャッシュありのページネーション <- atomFamilyを用いた例 リフレッシュ方法 <- ちょっと・・・ 今のオススメ <- @tan
Introduction Jotai is developed to solve an extra re-render issue with React Context. A major challenge in its development has been the support of both Suspense and Concurrent rendering. Otherwise, it would have been a simpler implementation and its implementation would closely resemble that of any observable-like libraries. As of writing, Jotai is fully compatible with Suspense and Concurrent ren
best practice to set atom value with route params · pmndrs/jotai · Discussion #1113
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
この記事は公式DocのComparisonページの翻訳（下訳にDeepLを利用）と筆者のコメントが付いた内容になっています。原文と翻訳部分は引用表記しています。 https://github.com/pmndrs/jotai/blob/v1.5.2/docs/basics/comparison.mdx がソースです。 ご存知Reduxが登場せずに、急にZustandが出てきて何それ？となるかもしれません。ひとまず見ていきましょう。 JotaiとZustandの違いは？ How is Jotai different from Zustand? ライブラリ名 Name Jotai means "state" in Japanese. Zustand means "state" in German. Jotaiは日本語で"状態"、Zustandはドイツ語で"状態"という意味です。 そうなんです、
React 👻 jotai を使うと localStorage を使った永続化が簡単だった件について - かもメモ
SPA はリロードすると state が消えてしまうので永続化したい状態ってのが結構あります 生の React だと カスタム hook や useEffect 内で localStorage にアクセスして保存させたえい、Recoil でも effect を使って永続化するコードを書く必要がありました jotai を使うと localStorage に保存するための API が用意されていて永続化がめちゃくちゃ簡単だったのでメモに残しておきます 環境 React 18.2.0 Next.js 13.2.4 jotai 2.0.3 TypeScript 5.0.2 atomWithStorage で直接 localStorage に state を保存できる！ atomWithStorage(key, initialValue, storage) key (required): a uni
トップダウン型の状態管理 (#Redux #Zustand )と比較して知るボトムアップ型の状態管理 (#Recoil #Jotai )
はじめに この記事はJotai公式ドキュメントのbottom-up approachというワードをきっかけに、Reactの状態管理におけるトップダウンとボトムアップとは何なのかを整理したいという個人的な思いで書いています。 Jotai takes a bottom-up approach to React state management with an atomic model inspired by Recoil. トップダウン型について そもそもトップダウンという言葉はどこで登場するのか Reactの公式ドキュメントではtop-downという言葉が以下のように登場します。 このデータフローは一般的には “トップダウン” もしくは “単一方向” データフローと呼ばれます。いかなる state も必ず特定のコンポーネントが所有し、state から生ずる全てのデータまたは UI は、ツリー
はじめに インフォメティス株式会社でのアプリ開発ではJotaiを採用しています。 また、TypeScriptも積極的に使い、end-to-endでの型安全を目指しています。 Jotaiの利用範囲を広げていく中で、APIも検討視野に入りました。その際、tRPCを活用する案が出てきました。 そこで、、、。 jotai-trpcの開発 jotai-trpc というライブラリを開発しました。初期のバージョンはほんの30行ほどの簡単なラッパーライブラリでした。atomWithQueryだけを実装したもので、tRPCのVanilla Clientを呼び出すだけでしたが、ちゃんと使えるものになりました。 その後、atomWithMutationなど追加機能も実装し、tRPCのVanilla Clientを全て対応しました。 tRPC Vanilla Client ところで、jotai-trpcの開発途中
待望のjotai-effectというライブラリーがリリースされました、Recoilの機能と似ている部分もあるはず
RecoilがAtom Effectsという機能を提供した際、Jotaiでも似たような機能を作れないかと議論になったことがあります。もうかれこれ何年も前の話。その際に、Jotaiに.onMountの仕組みが追加されました。ただ、.onUpdateの採用は見送りました。ほとんどのケースで不要なのと、useEffectでしばしば散見される間違った使われ方をする可能性が高かったためです。結果的にはその方針は合っていたように思います。 今回、一人のコントリビューターがRecoilに類似したeffectの仕組みを提供したいと申し出たのをきっかけに検討し、別パッケージで提供するのは可能だと判断しました。これまで、いくつかuseEffectに頼らなければならないケースがあり、それ自体は正しいものの、心情的にはatomに閉じたモデリングをしたいと思いましたし、その要望も何度か上がっていました。試行錯誤の上
埼玉県は大宮にて開催されました、Saitama.js vol.5で登壇してきました。 Saitama.jsは、はぜさん（@haze_it_ac）とりゅーそうさん（@ryusou_mtkh）が主催・運営されているJavaScript関係ならなんでもありな初心者歓迎イベントです。オフラインでの開催は初とのことで、今回はりゅーそうさんの所属先でもあるmicroCMSが会場費等サポートしてくださったとのことです。ありがとうmicroCMS。インターネット最高～。 私は、「【React】Jotaiで作ったフォームをApollo Clientで投げてみたら良さそうだった件」というタイトルで発表しました。いわゆるやってみた系です（？）。 （サブリミナル春日部つむぎ。埼玉県民の基礎教養だと思ってたら、そう思っているのはインターネットのオタクだけだったてなワケ。布教完了です。） 現在、本業でもこのスタイルに
React状態管理ライブラリ「jotai」を使って、7GUIsのタスクを実装したら、勉強用のいい感じの教材になったんじゃないか
7GUIsというのはこちら: https://eugenkiss.github.io/7guis/ ここにGUIプログラミングの7つのタスクが載ってました。 Task 1: Counter Task 2: Temperature Converter Task 3: Flight Booker Task 4: Timer Task 5: CRUD Task 6: Circle Drawer Task 7: Cells これをjotaiを使って、例題アプリとして実装してみたところ、jotaiの勉強用にいい感じになりました。と言っても、後半に行くにつれて難易度が上がるので、導入向け教材ではありませんが。 Task 1: Counter Task 2: Temperature Converter Task 3: Flight Booker Task 4: Timer Task 5: CRUD Ta
React状態管理ライブラリ「Jōtai」の公式ドキュメントを元にした紹介記事を複数に分けて公開します。 現段階でのタイトル一覧は以下になります。(この記事はJotai FriendsによるJotai紹介特集の一覧記事になります。実際の記事のタイトル末尾には #JotaiFriends を含めています) React状態管理ライブラリ Jotai の始め方 React状態管理ライブラリ Jotai のコンセプトとは React状態管理ライブラリ Jotai のPrimitives(必要最小限のcore APIの3つ)の概要 React状態管理ライブラリ Jotai とその他ライブラリとの比較 React状態管理ライブラリ Jotai のCore API React状態管理ライブラリ Jotai の Derived Atom とは React状態管理ライブラリ Jotai で非同期処理 Rea
React jotai で localStorage を使って state を永続化するコンポーネント作ってみたのメモ - かもメモ
React で jotai を使って local storage に JTW を保存して永続化・リロード時に状態を復帰するのをやってみためも。 (※ サンプルなので local storage に JWT を保存するのはセキュリティ的によろしくないってのは今回考慮していません ) シナリオ ログインの際に API から JWT token とユーザー情報が返される JWT token は local storage に保存する ユーザー情報は React の state にする 初回アクセス・リロード時にユーザー情報を永続化された JWT から復元するシナリオ local storage に JWT token がある場合 API に JWT token を付けてアクセスする JWT token が expire している場合はエラーが返される -> ログアウト状態にする API から返さ
RSC内のCC同士を連携させるためにJotaiを使った話
（こちらの内容をせっかくなのでAdvent Calendarにしてしまおうという意図での記事です。省エネでいきます） Next.jsのReact Server Components(以下、SCと呼称)は非常に気持ちよく書けるので好きなのですが、Client Components（以下、CCと呼称）同士を連携させるためにはcontext等を駆使する必要があり、気持ちよさが少し薄れてしまいます（個人の感想）。 今回、ボタンを押すと特定のdivまでスクロールする必要が出てきたため軽く悩んだ結果、大好きなJotaiを使うことにしました、という話になります。 この図のように、末端のCC同士を連携させるためにはClientWrapperのようにCCでSCを包んでそこでやりたいことを実現するためのcontextなどを用意してあげる必要があります。 このことはNext.jsだとここに記述があります。（Re
この記事では簡単なPostアプリのCRUD操作をjotaiとFirebaseのCloud Firestoreを使って実現しています。 FirestoreのonSnapshotとjotaiを使って、クライアント間でデータをリアルタイムに同期するプログラムを書きました。 Firestoreやjotaiに入門したばかりなので、書き方を間違えている可能性があります。参考程度に見ていただければ幸いです。 環境設定 以下のライブラリ&フレームワークを使用して構築しました "@chakra-ui/icons": "^2.0.16", "@chakra-ui/react": "^2.4.9", "@emotion/react": "^11.10.5", "@emotion/styled": "^11.10.5", "firebase": "^9.15.0", "framer-motion": "^8.4.
jotai とは jotai とは、react の状態管理ライブラリです。フックスライクに状態を管理でき、学習コストも低いので、お手軽に状態管理を実装できます。 また、recoil に非常に良く似ており、recoil を使ったことがある人には、すぐに使いこなせると思います。 今回の実装する内容 今回は jotai を使って、firebaseAuth を管理し、書き味を試してみる趣旨です。 firebase でログイン ユーザー状態を更新 スタイルを変更 firebase でログアウト ユーザー状態を更新 スタイルを変更 上記を実装したいと思います。 ※ firebase の解説は割愛します。 実装 準備 ログインしていないと背景が赤く非常にストレスフルな UI になっています。 index.tsx import { signInWithEmailAndPassword, User } fr
jotai-molecules 利用のすゞめ
🎳jotai-molecules 利用のすゞめjotai-molecules の使いどころを通して、ライブラリ側がアプリケーションの中で責務を持つか否か学びを得ます。 By jiyuujin at12/15/2023 この記事は jiyuujin Advent Calendar 2023 の 15 日目の記事になります。 とあるジョインさせていただいているプロジェクト EventIn で jotai を使っています。 と、そこでそうした jotai の使いどころを整理しつつ、それらのユースケースを想定しました。 atomFamily を利用するより、かなり簡潔に書ける方法を追求、堅牢な設計を進めました。 結果的には、そうした設計方針として、atom を molecule へ昇格させつつ、その使用感を通常の atom に近づけられる jotai-molecules を利用いたしました。 a
はじめに この記事は、「GUIプログラミングのベンチマークとして提案された7つの課題を題材に、React状態管理ライブラリのJotaiを学んでみよう」というテーマのJotai学習記事の第五回CRUD編です。 完成したコードの解説がメインになります。もしご自身で実装してみたい場合はネタバレになってしまうのでご注意ください。 7GUIsとは 言語やライブラリ系のベンチマークといえば計算速度が評価軸にされることが一般的ですが、この７GUIsはいくつかの指標を軸に7つGUIアプリのお題を用意し、それをベンチマークとして提案しています。 2018年頃に話題となったようで、web系だとReact/MobXやSvelteが実装例として掲載されています。 詳しくはこちら。 7GUIs x Jotai の元ネタ Jotai作者の@dai_shiさんが過去に取り組んでおり、CodeSandboxで既に実装済み
2.状態管理ライブラリとJotai JotaiはReactの状態管理ライブラリの1つです。 Reactでは規模が大きいアプリケーションを開発する際に、多くの状態管理が必要になり、結果的に状態の制御が難しくなって開発効率が低下してしまうことがあります。 この問題を解決するのが、Reactの状態管理ライブラリです。 状態管理ライブラリでは、一般的に次のことができるものがほとんどです。 グローバルに状態を管理する Propsのバケツリレーを少なくする 不要な再レンダリングを防止する 2.1.Jotaiの特徴 Jotaiは以下の特徴を持っています。 シンプルかつ柔軟に開発することできる 軽量なAPI TypeScriptで開発されている 初学者にとって最もJotaiが便利だと感じる場面は「グローバルステートとして状態をシンプルに管理できる」という点にあると思います。 JotaiはReduxやRec
普段 React の状態管理には Recoil を愛用しています jotai という Recoil ライクな軽量ライブラリがあると聞いたので試してみました 👻 jotai @reduxjs/toolkit vs jotai vs react-redux vs recoil vs redux | npm trends この記事を書いた時点では Recoil 23.5KB で jotai が 2.3KB 確かに小さいです!! (Recoil が思ったより大きかった) 環境 jotai 2.0.3 React 18.2.0 TypeScript: 4.9.3 状態 (state) = atom jotai では Recoil と同様に state は atom と呼ぶ import { atom } from 'jotai'; const countAtom = atom<number>(0)
祝！Jotai 15kスター
いや〜、ほんと、感謝しかありません。開発をスタートした時は、こんなに伸びるとは思っていませんでした。Zustandの方がさらに予想を超えていて、さらに先を行っています。 今後ともよろしくお願いします。 最近は、twitter.com / x.com だけではなく、Mastodonの方でも発信しています。 また、半クローズドなコミュニティもありますので、興味があればそちらでディスカッションなどしませんか。お待ちしております。 日本語コミュニティ 👉 Slack招待ページ 英語コミュニティ 👉 Discord招待ページ
Jotaiではかなり初期の頃から、小さなコアを目指して機能拡張は外部で行うようにしてきました。当初は自分がちょこちょこいっぱい色々なものを作っていたのですが、最近では、新しいライブラリを作ってくださる方や、これまでのライブラリの開発を進めてくれる方が増えてきました。試しにリストアップしてみたのが上記のツイートです。リストに入っていない人もいますし、リストの中でもアクティブ度は違いますが、だいぶ増えてきてありがたい限りです。ちなみに、メンテナ不在のパッケージがいくつか（いくつも）ありますので、もしご興味がある方がいたら声をかけてください。
const atom = (initialValue) => ({ init: initialValue }); const atomStateMap = new WeakMap(); const getAtomState = (atom) => { let atomState = atomStateMap.get(atom); if (!atomState) { atomState = { value: atom.init, listeners: new Set() }; atomStateMap.set(atom, atomState); } return atomState; }; const useAtom = (atom) => { const atomState = getAtomState(atom); const [value, setValue] = useState(a
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Jotaiで快適フロントエンド開発 | 株式会社ヌーラボ(Nulab inc.)
React 状態管理ライブラリの超新星？！「Jotai」をさわってみた - Qiita
JotaiとRecoilの違いは何か、string keysが不要というのはどういうことか
Jotai, primitive and flexible state management for React
How Jotai Specifies Package Entry Points
Jotai: 状態?! 日本語っぽい名称のReact用ステート管理ライブラリ - Qiita
Signalって何？jotai-signalからのjotai-uncontrolled、これすごいです
Recoil, Jotaiの設計論とDIKWピラミッド
Jotaiのatomは値を持たないのです、たぶんRecoilも同じ
「Recoil selector活用パターン 無限スクロール編」のJotai版
Introduction — Jotai
Jotaiでのデータ取得の基本 - SuspenseとAsync Atom
Why useSyncExternalStore Is Not Used in Jotai
React状態管理ライブラリ Jotai とその他ライブラリとの比較 #JotaiFriends
jotai-trpc開発秘話（インフォメティス株式会社では採用しなかったけども） - Qiita
【登壇報告+資料】saitama.jsで発表してきました～Jotaiでフォームを作る話とか - asazutaiga.dev
React状態管理ライブラリ Jotai の 紹介特集について #JotaiFriends
Firestoreとjotaiでリアルタイムにデータを同期する
jotaiの超入門(firebaseAuth を jotaiで管理する)
7GUIsで学ぶReact状態管理Jotai | CRUD 編 (5/7)
初学者でも分かるようにJotaiを丁寧に解説していく - Qiita
React 軽量状態管理ライブラリ👻 jotai 👻 さわってみた！ - かもメモ
だんだんJotai Labsのメンテナが増えてきた件
Reactの状態管理ライブラリJotaiのコアを27行のコードで表現してみました、ちゃんと動くんです