7 Ways to Implement Conditional Rendering in React Applications

Tutorial by Philip Obosi

With React, we can build Single Page Applications that are dynamic and highly interactive. One way we fully utilize such interactivity is through conditional rendering. Conditional rendering as a term describes the ability to render different UI markup based on certain conditions. In React-speak, it is a way to render different elements or components based on a condition. In this article, we examine seven(7) ways to implement such conditional rendering in React applications.


Related resources

A guide to React refs: useRef and createRef

As is the case with many other UI libraries, React offers a way to rethink a view as the result of a state of a component. Part of that benefit comes from creating the views with the abstraction mechanisms React and JSX expose instead of doing it through DOM spec methods. Still, the React team did [continue]

Article by Jeremias Menichelli

6 tips for better React performance

In this article, I will try and list out a few easy ways to achieve better performance in your React app through simple development hacks. Under no means does this mean that you need to always apply these techniques, but it's always good to know that they are there. [continue]

Article by Aggelos Arvanitakis

Using React Refs in Typescript

Sometimes it is necessary to use an imperative programming model and access an underlying DOM element. Whatever the reason this can be accomplished using React refs. This guide will show how to use strongly typed refs using Typescript. We will see how to use refs from functional components, using the [continue]

Tutorial by Chris Dobson

The most important lessons I’ve learned after a year of working with React

Starting out with a new technology can be quite troublesome. You usually find yourself in a sea of tutorials and articles, followed by millions of personal opinions. And every single one states that they found the 'right and perfect way.' Before diving into the ocean, we must understand the underlying [continue]

Article by Tomas Eglinskas