DEV Community

Aman Kureshi
Aman Kureshi

Posted on

šŸ”€ Conditional Rendering in React

Conditional rendering means showing different UI based on a condition.

šŸ“˜ Example:

function Greeting({ isLoggedIn }) {
  return (
    <h2>{isLoggedIn ? "Welcome back!" : "Please log in"}</h2>
  );
}
Enter fullscreen mode Exit fullscreen mode

✨ Key Points:
• Use ternary operator (? :) for simple conditions
• Use && for short conditional rendering
• Helps create dynamic user interfaces

Conditional rendering makes your React UI smart and interactive. šŸš€

Top comments (0)