🎯

rendering-conditional-render

🎯Skill

from theorcdev/8bitcn-ui

What it does

rendering-conditional-render skill from theorcdev/8bitcn-ui

📦

Part of

theorcdev/8bitcn-ui(23 items)

rendering-conditional-render

Installation

📋 No install commands found in docs. Showing default command. Check GitHub for actual instructions.

Quick InstallInstall with npx

npx skills add theorcdev/8bitcn-ui --skill rendering-conditional-render

Need more details? View full documentation on GitHub →

11Installs

1,576

Last UpdatedJan 22, 2026

View on GitHub Back to Skills

Skill Details

SKILL.md

Use explicit ternary operators instead of && for conditional rendering. Apply when rendering values that could be 0, NaN, or other falsy values that might render unexpectedly.

Use Explicit Conditional Rendering

Use explicit ternary operators (? :) instead of && for conditional rendering when the condition can be 0, NaN, or other falsy values that render.

Incorrect (renders "0" when count is 0):

```tsx

function Badge({ count }: { count: number }) {

return (

{count && {count}}

)

}

// When count = 0, renders:

// When count = 5, renders:

```

Correct (renders nothing when count is 0):

```tsx