예전 프로젝트에서 사용자 친화적인 사이드바(Sidebar)를 만들기 위해 다양한 UI/UX 개선을 적용했다. 진행하고 있는 AI TUTOR 프로젝트의 SIDEBAR의 UI/UX에도 개선이 필요했다. 1. Hovering을 하고 있지도 않은데, Hovering 시 바뀌는 스타일이 불필요하게 적용됨 2. toggling 반응속도가 느림 이때 쓸 수 있는 방법은 JavaScript의 Set 자료구조를 활용한 열림/접힘 상태 관리 최적화가 있었다. 이 문서는 해당 리팩토링 과정과 그 이유, 그리고 부수적인 UI 버그 해결 방법까지 총망라한 정리이다.1. 기존 사이드바 상태 관리 방식초기에는 각 폴더의 노트 리스트 열림 여부를 다음과 같이 관리했다:const [isNoteOpen, setIsNoteOpen] =..
