The Magical React Hook That Makes your Components Smaller

useReducer is one of the most underrated React hooks, instead of writing 3 lines of useState, you can replace it with a single line of code.
🎉Our Newsletter is live! Join thousands of other developers
islemmaboud.com/join-newsletter
🐦 Follow me on Twitter: / ipenywis
-- Special Links
✨ Join Figma for Free and start designing now!
psxid.figma.com/69wr7zzb1mxm
👉 ✨ Join Figma For Professionals And Start Designing with your Team ✨
psxid.figma.com/ucwkx28d18fo-...
-- Special Links
✨ Join Figma for Free and start designing now!
psxid.figma.com/69wr7zzb1mxm
👉 ✨ Join Figma For Professionals And Start Designing with your Team ✨
psxid.figma.com/ucwkx28d18fo-...
-- Watch More Videos
🧭 Build Login/Register API Server w/ Authentication | JWT Express AUTH using Passport.JS and Sequelize
• Build Login/Register A...
🧭 Turn Design into React Code | From prototype to Full website in no time
• Turn Design into React...
🧭 Watch Tutorial on Designing the website on Figma
• I Design a onecolor We...
🧭 Watch Create a Modern React Login/Register Form with smooth Animations
• Create a Modern React ...
🧭 Debug React Apps Like a Pro | Master Debugging from Zero to Hero with Chrome DevTools
• Debug React Apps Like ...
🧭 Master React Like Pro w/ Redux, Typescript, and GraphQL | Beginner to Advanced in React
• Master React Like Pro ...
🧭 Learn Redux For Beginners | React Redux from Zero To Hero to build a real-world app
• Debug React Apps Like ...
🧭 Introduction to GraphQL with Apollo and React
• Introduction to GraphQ...
🐦 Follow me on Twitter: / ipenywis
💻 Github Profile: github.com/ipenywis
Made with 💗 by Coderone

[@electroheadfx]

great. Thanks. What is your vscode theme name you use ?

[@user-ik7rp8qz5g]

This shop example looks overwhelming, so cant say I exactly understand what is going on in there. Why do we need so much instead of simply deriving state?

[@jagjiwanchimkar8106]

instead should we prefer zustand?

[@danuxa100]

Hey, thanks for the awesome video!
I just wondering, should I use useReducer if I already have RTK and maybe would be better just put my data to some dedicated slice?

[@fcnealvillangca7943]

for global states = RTK. widget only states or in-component-only states = context + useReducer. but I don't plan to implement use reducer in my projects anymore it's more a preference

[@Thassalocracy]

What's the extension/setting for condensing the tailwind classes (converting them to "...")? I think it's quite handy 😊

[@webdevpersion]

I think it will be tailwind fold

[@frusen_sol]

Inline fold

[@koksikskkj7937]

Cant we just use a simple useState, then outside the component create own logic function and pass setState as argument?
I know React recommends to pure functions but creating a function outside is not mutable (specialy the content inside)

[@dongbinkim3773]

Correct me if I'm worng. Doesn't the three setUseStates in a row trigger re-rendering just one time? If it's right, the beauty of using useReducer is just capsulating the state-update logic other than letting it stay in the component?

[@alext5497]

Use reducer should mostly be used for complex state machines where you have predetermined states. It shouldn't just combine a bunch of unrelated useStates

[@fedorshadrin135]

It's called batching

[@Mathes881]

Its useless, there could be const totalItems = cart.length
Also totalPrice could be computed :D
So we would have just setCart.

[@alext5497]

@Mathes881 I didn't watch thr video. Got bored 30 seconds in. I was talking about in general.