Conditional Rendering with Logical AND Operator

Showing a part of the screen only when some condition is true, and showing something else or nothing when it is false, is called conditional rendering. A welcome message that appears only for a logged-in user is a typical case. This chapter shows three ways to write it, and this first lesson uses the logical AND operator, &&.

How && Works in JavaScript

The && operator is plain JavaScript and not a React feature, so it behaves in JSX exactly as it does anywhere else. In the expression a && b, JavaScript first evaluates a. If a is falsy, the result is a itself, and `b