회고
아직 완성은 아니지만, 미리 배포 테스트를 하기 위해서 빌드를 해봤다. 처음에는 코드도 깔끔하게 짜려고 설계도 하고 했었는데, 시간이 지날수록 여기저기서 터지는 버그를 잡으려고 왔다갔다 하다보니 코드가 점점 지저분해진다. ㅠ
검색 쿼리 바뀔때마다 api를 call해서 디바운싱 구현해보려고 했는데, 두뇌의 한계다. 포탈로 모달 띄우는건 성공했는데 모달 영역밖 클릭하면 모달창 닫게끔 구현하려고 하는데 타입스크립트때문에 한계에 봉착했다. 슬픈 타입인생 ㅠ
Non null Assertion (TypeScript)
modal창을 root에 붙이기위해 react portal을 사용하던 중 typescript에러가 발생했다. creatPortal의 두번째 인자로 Element 형식이 들어가야하는데, document.getElementById('root')에서 null이 발생할수도 있다고 판단해서 생기는 오류 같았다. null이 발생할 수 있는 곳의 후미에 !를 붙이게되면 null이 들어오지 않는다고, 단언(?)할 수 있다. document.getElementById('root')! non-null assertion을 통해서 해당 오류를 해결할 수 있었지만, 뭔가 깔끔하게 해결한거 같지 않다. 또, 찾아보니까 eslint 등에서도 추천하는 방법은 아닌데, 다행스럽게도(?) 내가 설정한 린트에서는 통과해줘서 일단 써먹긴했다. 타입스크립트를 정확히 이해하지 못해서 그런거 같은데, 시간이 있을때 좀더 이론적으로 알아봐야겠다.
