Member-only story
React Clean Code
Simple ways to write better and cleaner code
Clean code is more than just working code. Clean code is easy to read, simple to understand, and neatly organized. In this article, we’ll look at eight ways we can write cleaner React code.
When going through these suggestions, it’s important to remember that’s exactly what they are: suggestions. If you disagree with any of them, that’s completely fine. However, these are practices that I’ve found helpful in writing my own React code.
Let’s dive in!
1. Conditional Rendering Only for One Condition
If you need to conditionally render something when a condition is true
and not render anything when a condition is false
, don’t use a ternary operator. Use the &&
operator instead.
Bad example:
Good example:
2. Conditional Rendering on Either Condition
If you need to conditionally render one thing when a condition is true
and render a different thing when the condition is false
, use a ternary operator.
Bad example:
Good example: