내 맘대로 적는 일기[TIL]-59

오늘은 심화프로젝트에서 맡은 게시글 CRUD, 게시글 댓글 CRUD 중에서 CRD까지 구현하였습니다.

react-quill을 사용하는 것 때문에 생각보마 많은 시간이 지체 되었지만 그래도 생각보다 나쁘지 않은 경험이었던 거 같습니다.

react-quill imagehandler를 만들면서 여러가지로 애를 먹었던거 갔습니다.

처음에는 생각을 잘 못 해서 blob 객체를 url로 변환해서 사용할려고 했었고(후에 로컬에서만 사용할 수 있다는 걸 깨달았습니다.), 그리고 supabase에 연결해서 url의 길이를 줄이고, 처음으로 올린 사진을 메인 이미지로 사용할려고 세팅 하면서도 애를 먹었던거 같습니다.

이미지가 들어갔을 때 다시 rendering이 되면 안 돼서(다시 rendering이 될 경우 다시 기존에 저장해놨던 dom이 인식이 안돼서 document가 인식이 안된다는 에러가 발생합니다.)기존의 useMemo로 모듈을 감싸서 막았습니다.

하지만 이미지 핸들러에서 zustand로 작성할려고 하면서 부터 위에의 문제사항을 맞이하게 되었습니다.

store의 값이 바뀔경우 그 값이 포함된 모든 컴포넌트가 rerendering이 되기 때문에 위에서 설명한 오류가 발생하게 되었습니다.
그래서 어떻게 할까하다가 이미지 핸들러에서 가져오는 url을 ref를 만들어서 거기에 값을 저장해서 밖에서 store에 저장하는 방법을 사용하여 해결 하였습니다.

여기까지 오는데 생각보다 많은 시간이 걸렸던 거 같았지만 그래도 많은 것을 알아가게 된거 같습니다.