Видео

how to do this in react native

nice

love and respect from Pakistan sir 🇵🇰 💛

Thanks for enlighting me about this awesome library. It was a great video. I would want more indepth video about jotai with complex state like non-primitives and other feature provided by Jotai with real world example. Also if possible would you please share Jotai optimized version so that there is no un-necessary re-render like Jotai's focusAtom or selectAtom.

how about delete and the other ?

great video bro! thank you

deserves 100k views at least

You are my Hero man

Dislike. This video is about Toolkit. Not original Redux!

its good practice to clean up after the useEffect is finished , such as useEffect(() => { const controller = new AbortController() // Create an AbortController const signal = controller.signal async function getPosts() { try { const response = await axios.get("localhost:3000/posts", { signal }) console.log("response", response) if (response.status === 200) { setData(response.data) toast.success('Data fetched successfully!', { position: "top-right", }) } } catch (error) { if (axios.isCancel(error)) { console.log("Request canceled:", error.message) } else { console.error("Error fetching data:", error) } toast.error('Error fetching data!', { position: "top-right", }) } } getPosts() // Cleanup function to cancel the request return () => { controller.abort() } }, []) // Remove `data` from the dependency array to avoid infinite loops

just throws errors more react trash

Finally, a tutorial that goes straight to the point and doesn't make you install unnecessary packages. Great video!

Isthuthiii sahodaraya <3

I was aware of the Outlet component but this approach isn't intuitive. Thanks, Austin!

How should I go about incorporating my domain name instead of the localhost? Do I just place it where localhost is 7:03 ?

bro... thankyou for this series of videos

Thank you. Sir, will you do a custom google login button tutorial in the future?

great and comprehensive

Thank you

This is awesome. It makes me want to remove my context providers. Great video, subscribed!

contextApi killer?

Thank uuuuuuuuuuuuuuuuuu bro! I really appreciate it.

yaah nice one bro

Jotai is same creator/maintainer (dai-shi) as zustand which you mention. He has writeups that help explain which library to use depending on requirements.

nice

I would argue that putting state in the url (via search params) is my perferred way. That means you can mount your components everywhere and they will be context aware by default.

Thank you very much..... You explained very well 👍👍

Jotai is bigger than Zustand

Recoil actually does exactly this, how is this better than Recoil, Recoil actually has more features like getters, setters, family, effects etc.

=== Austin Davis Keeps deleting the Comment and Replies so I am reposting here because he is censoring free speech because I have ideas he doesn't agree with @Nellak2011 2 days ago Congrats. You now made your app infinitely harder to test and debug. Global State is a problem. In fact, it was such a big problem a whole programming paradigm was created to address it. @AustinDavisTech 4 hours ago I strongly disagree. Jotai is not a replacement for using normal React state. As long as you're not spamming atoms everywhere and you're using global state responsibly, it is 100% a better alternative than dodging global state entirely and prop drilling to infinity and beyond. There's a reason React itself supports global state with contexts and so many global state libraries have popped up. Web dev can get really complex, and without some sort of state management like Jotai, Zustand, or even contexts it becomes an absolute nightmare to navigate (Deleted Comment that was basically saying that Jotai is unregulated global state and is bad, I can no longer find the comment anymore) @Nellak2011 Look the problem is simple. Let me simplify so you can understand. 1. It is unregulated global state 2. It is not isolated So no matter what argument you have, it fails this fundamental test. Why is it unregulated? -> No one knows what updated what Why is unregulation bad? -> Because you cant debug it easily Why is it not isolated? -> Because it introduces non local coupling. Your components are not a function if the props but of some hidden state elsewhere. Why is lack of isolation bad? -> It makes things harder to test and harder to reason about. Instead of being able to think about it in isolation, you have to consider the whole app. How do you do isolation and global state management? -> You explicitly pass your dependencies as props in 1 direction. Never do 2 way prop-drilling. For example, you have your state in your store, you pass the selectors used by the component explicitly down. But we can directly access the store with a hook, it is more complicated to pass down props explicitly. Why do you advocate that? -> Sure, we can shoot ourselves in the foot if we want, but it doesnt mean it is good to do so. The reason we pass the selected state from the store explicitly is so we can achieve isolation and so we become agnostic to the state provider. If we access it directly, we make a coupling to that specific store. In other words we make an implicit dependency and so to test the component we need to now mock the whole redux store instead of just passing in props. It is literally the bananna and jungle problem. ==> Therefore we should avoid unregulated global state like in context api or jotai. It leads to well known anti-patterns and is anti-thetical to good software engineering practices.

Austin Davis deletes comments he doesn't like just so you all know.

So if you want to use the global state you need to always import the original atom() to the component

It’s simple but it could get difficult to handle if you have many levers

This is wicked, somehow very similar to zustand but yet seems even simpler indeed. Would be nice to see how types work on typescript and how more complex state works too, for instance if you have several variables and a few set/get functions like the usual zustand drill.

Jotai seems very easy to use, with not much of a setup. But having a bunch of global states worries me for the performance. Personally, I like useImmer and useImmerReducer. I don't mind setting up the reducer function once, and Immer helps with the immutability problem that native reducer had.

God this is beautiful.

State managers based on atoms are good only on examples or when they are simple. But having many atoms, on medium or large projects, can make the state management code realy messy. Especially when you read code after a few months xD

Congrats. You now made your app infinitely harder to test and debug. Global State is a problem. In fact, it was such a big problem a whole programming paradigm was created to address it.

React devs have forgotten the best state management library of them all, the U R L. I love this library, however I only use it in cases where I don't want to expose state to the user like setting a navbar's sticky state. Everything else goes into the URL bar in our projects.

Isn't this just signals with extra steps?

This is same as recoil

This is what i searched fr

😂

I usually use useContext providers. Ill probably try this on my next project.

Lots of comments suggesting Jotai doesn't scale. I think folks are confusing a minimal API surface with lack of scalability. Jotai is extremely powerful, especially when you compose atoms together with custom setter functions. It is also one of the more performant state management solutions. Given its flexibility and performance, it can scale to accommodate very complex UI needs. However, it will be important to establish consistent patterns since the library itself is unopinionated. Personally, I have been shipping Jotai at a very large tech company in a product with many Fortune 100 customers. We use it in addition to TanStack Query for managing async/server state (most of our state needs), as well as a custom, type-safe URLSearchParams wrapper around React Router 6. Because the majority of our state management is handled by Query and searchparams, the unopinionated Jotai API is perfect for filling in the gaps when we have (rare) global, non-url, non-async/server state management needs. Thanks for giving Jotai the love it deserves!

Very helpful tutorial, thank you 🙌🏾

I think preact signals makes it much more simpler than this. This is a nice state management library tough...

Preact signals is much better and less bloated.

Can you show us your code? I wanna learn it more detail especially the code inside <Card/> component

nah, valtio is better. no boilerplate like this