Frontend Security Patterns

XSS Prevention

React's Built-In Protection

React escapes all values rendered in JSX by default. This is safe:

<p>{userInput}</p>                    // escaped — safe
<div title={userInput}>...</div>      // escaped — safe

Dangerous Patterns

// DANGEROUS — renders raw HTML
<div dangerouslySetInnerHTML={{ __html: userInput }} />