How would you safely display user generated HTML content, such as a rich text comment, without exposing your app to XSS attacks?

You use a trusted sanitization library, like DOMPurify, to clean the HTML first, removing any dangerous scripts or unsafe attributes, before ever passing the result into dangerouslySetInnerHTML. This lets you safely support formatted content like bold text or links while blocking anything genuinely harmful.

import DOMPurify from 'dompurify';

function Comment({ rawHtml }) {
  const cleanHtml = DOMPurify.sanitize(rawHtml);
  return <div dangerouslySetInnerHTML={{ __html: cleanHtml }} />;
}