제 블로그에는 어느 면접을 가던 꼭 물어봐 주시는 modal hook 관련 글이 있었는데요. 이번에 해당 hook을 배포 하게되었습니다.

면접에서 해주신 내용들도 다시 고민해보면서 hook에 조금 더 고민을 해볼 수 있는 기회가 되었네요.

제가 해결하고자 하는 핵심은 다음과 같습니다.

1. modal에 관한 jsx를 hook의 props로 전달하며 기존에 해당 컴포넌트 코드에 불필요한 jsx를 사용하지 않는것을 목적으로 합니다. (modal component와 modal을 사용하는 component는 다른 레이어로 봅니다)

2. context를 활용해 구현해 React 프로젝트면 모두 사용이 가능합니다.

3. 중첩된 modal을 제어하는데 문제가 없습니다.

블로그글

https://yoonhaemin.com/tag/experience/react-modal/

배포 링크

https://www.npmjs.com/package/@gomterview/use-modal

codesandbox

https://codesandbox.io/p/sandbox/usemodal-ktv8ws