본문 바로가기

리팩토링

[TIL] 프로그래머스 데브코스 - 바닐라JS/ SPA구조로 노션만들기 - 리팩토링(함수네이밍,세션스토리지 추상화,고차함수 적용). 과제 구현 중 멘토님, 동료 피드백 내용을 반영하는 리팩토링을 진행해봤다. 함수 네이밍 함수 네이밍시 동사원형+명사 조합으로 작성해보면 그 함수의 역할을 파악하기가 쉬울 것이다라는 피드백을 받았다. 신기하게도 함수의 이름이 길어졌음에도 가독성이 좋아졌다라는걸 느꼈다. 아래는 가장 눈에띄게 변화를 느낄 수 있었던 변경을 가져와봤다. (각 bannerEvent, editorEvent함수는 Banner, Editor 각 컴포넌트의 외부에서 Banner, Editor의 상태 변경을 지시하는 함수다.) 세션 스토리지 추상화 api호출시 공통된 부분을 index.js로 따로 빼서 작성하는 것과 동일하다.(클로저를 처음으로 사용해봤다.) 고차 함수 적용 인덱스를 찾기 위해 for문 내부에서 findIndex함수를 불.. 더보기
[TIL] 프로그래머스 데브코스 - 바닐라JS/ SPA구조로 노션만들기 -토글기능(+ 약간의 리팩토링). 배포 사이트 : https://vanilla-js-notion-4cckycphd-gangpyono.vercel.app/ 이전에 토글기능을 넣었지만 특정 페이지를 편집중에 새로고침을 눌렀을때 해당 문서가 자식문서임에도 불구하고 토글이 모두 닫혀 왼쪽 배너부분에서의 정확한 위치표시가 안됨 + 아래 문제부분에서의 의문이 있어 주말을통해 개선하고자했다. 1. 문제 서버로부터 토글에 대한 상태를 받아오지 않기 때문에 토글 버튼을 클릭할 때마다 전역에서 관리하는 배너 상태에 임의로 상태 값을 넣어주고 상태 변경에 의한 렌더링으로 보여주고 있었다. 여기서 문제가 총 2가지가 발생했는데 첫 번째로는. 토글 상태를 배너부분외에서 사용하지않을것같은데 전역상태로 관리할 필요가 있는가? -> 토글상태를 전역 상태 관리에서 분.. 더보기