# URL

- https://keeper991.github.io/todo-notionTheme/

# 설명

Notion 에서 제공하는 Task List template 을 컨셉으로 제작했습니다.

욕심으론 column 추가, column 색상 변경, todo-item 색상변경 등 넣고 싶었지만
우선 구현한 기능까지만이라도 제출하자는 마음으로 후딱 배포했습니다.

module화를 통한 코드 재사용성을 고려해 만들었습니다.

# 구현기능

- localStorage를 이용한 데이터 저장.
- item의 status를 변경 및 삭제가능한 공유된 menu 구현.
- menu pop-up position을 마우스 위치로 설정.
- mobile 환경 시, 횡스크롤 처리.
- item value 수정 후 1초이상 키 입력이 없을 경우 or Enter 키 입력 시, 데이터 update.
(작성 중에 불필요한 update 미수행.)

# 후기

앞서 설명한 대로 module 형태의 재사용성을 고려한 코드로 작성하려다보니,
해당 module에서 어느 부분을 외부에서 정의하고 넘겨줄지, 어느 부분을 내장기능으로 정의할 지가 혼란스러웠습니다. 특히 event handler를 어떻게 처리해주는게 아름다운지에 대해 고민을 많이하게 되었습니다..

결과적으론 느낀만큼 혼란스러운(?) 형태로 작성이 되었습니다만,
앞으로의 코딩 스타일에 있어서 많은 경험이 되었습니다.

변수 naming에 대한 깨달음(?)을 얻었습니다.
'이렇게 해야겠다!' 라기 보다는, '이렇게 하면 안되겠다!'는 걸 느꼈습니다..
querySelector로 HTMLElement를 받을 때, 단순히 'const titleDiv', 'const ItemUl' 이렇게 했던 선언들이 추후에 봤을 때, 의미를 쉽게 유추할 수 없었습니다.
짧고 compact한 변수명을 추구하던 방식이 불편함으로 느껴졌고,
사용하던 변수명 스타일보다는 조금 길면서 다른 사람이 읽었을 때 쉽게 유추가능하도록 작성해야겠다는 다짐을 하게 되었습니다..

짧은 시간내에 작성하느라 중구난방의 글이 되었습니다.
읽어주셔서 감사합니다 !!