[React] HTML <dialog> 태그로 Modal 구현하기

유튜브에서 우연히 HTML dialog 태그 관련 영상을 보고 이번 프로젝트에 너무 적용해 보고 싶었다! 많은 시행착오가 있었지만 결국 dialog 태그를 이용해서 모달을 구현하는 데 성공했다. 구현 과정에서 React에 dialog 태그를 적용하는 자료를 많이 찾을 수 없었기 때문에 코드를 기록으로 남기려 한다. HTML dialog 태그를 사용했을 때의 장점 backdrop을 포함한 기본적인 모달의 UI가 제공된다. (CSS 커스텀도 가능) dialog에서 제공되는 showModal(), close() 등의 API를 이용하여 모달을 쉽게 구현할 수 있다. esc 버튼을 클릭하여 모달을 닫을 수 있다. 기본적인 모달 UI 제공 (CSS 수정 방법) backdrop과 함께 정가운데 모달이 생성된다. 만약..