STOP WRITING REACT LIKE THIS

If you work with React, you might be writing it wrong, part one. Welcome to Stop Writing React Like This, please for the love of God stop writing React like this. Stop. Here's a common thing that I keep seeing in React code. Let's say you have two state variables, first name and last name. You want to create a full name out of those. What I often see people doing is creating another variable called full name and then they set the full name inside of a use effect. This is bad because one, it makes your code unnecessarily complicated. Two, it is less efficient because the component will render with a stale value for full name and then immediately re-render again with the correct value each time first name and last name is changed, adding unnecessary extra renders. Three, you might run into bugs because of the asynchronous nature of the set state function. In this case, just derive the value like this here. Keep it simple. If your derived calculations is expensive, use the use memo hook, but that's a topic for another day. So yeah, like and follow for more React tips.