❌ Avoid difficult-to-read conditionals in React. ✅ Instead you can use ts-pattern to express complex conditions in a single, compact expression.

Hey there 👋 Friendly reminder that I have more than 100 infographics and video animations just like this one. Check them out ↓

in some scenarios, you can avoid conditionals setting an object and getting the value by association:

Personally, I wouldn't introduce a library for something that simple. Nothing wrong with a basic switch or if...else statement. Just don't use a nested ternary.

For most cases I use maps, for more complex pattern matching I use ts-pattern.

Just use If conditions. No library that everyone reading has to learn, no overhead, more readable than both examples. Maybe a bit longer, but if you have a lot of those conditions, then the approach is wrong anyways. A separate Map would be in order.

just avoid React 🤪

😅 what library or framework do you use in the frontend? (If any)

Nice explanation. I will say the hardest thing to read might be the "ss" font there in the word "address"

haha font ligatures right? I have mix feeling about them, sometimes I like them, sometimes I don't...

I didn't know about `ts-pattern` before. Thanks for sharing about it, George 🙌

It's a great solution for complex pattern matching for sure! try it out!