React를 사용할 때, HTML을 직접 삽입하기 - dangerouslySetInnerHTML 사용 예제

React를 쓰다 보면, HTML 문자열을 그대로 DOM에 삽입해야 하는 상황이 종종 있다. 예를 들어 CMS에서 내려오는 콘텐츠, 외부 라이브러리에서 생성된 HTML, 혹은 서버에서 렌더링된 일부 HTML 조각 등을 사용할 때 그렇다. 그런데 React에서는 일반적으로 HTML 문자열을 직접 넣을 수 없다.그래도 넣어야 하는 경우가 있다면 사용할 수 있는 게 바로 dangerouslySetInnerHTML인데, 이름부터 위험하듯, 조심스럽게 사용해야 한다. 🤔 왜 dangerouslySetInnerHTML일까?React는 XSS(Cross-Site Scripting) 공격을 방지하기 위해 JSX 내부에서 HTML 문자열을 직접 렌더링하지 못하게 막는다.그래서 HTML 문자열을 렌더링하려면 특별한 방법..