2023-10-28 주말 TIL

주요진행사항

- 개인과제 리펙토링

리펙토링 내용

이전에 제출했던 개인과제에 대한 피드백 내용 중 태그 내부 style 선언을 class 토글로 변경하는 것과 동적 할당 시 forEach 내부에서 innerHtml이 누적 반복되는 코드를 리펙토링하였다.

변경 사항

1. 클래스 토글 개선

main.js 코드 내에서 특히 DOM의 style에서 display='none'을 지정하는 경우가 많았다.

이를 hide라는 class로 지정하여 css 속성을 주었다.

이런식으로 코드를 작성 하는 것이 유지 보수 면에서도 효율적인 코드라고 할 수 있다.

2. forEach 내부 innerHtml 개선

마지막 줄에 있던 $movieRenderContainer.innerHTML = cardHtml; 부분이 forEach 내부에 있던 것을 외부로 꺼냈다.

내부에 해당코드가 있어도 작동은 했지만 계속해서 누적해서 랜더링 되었기 때문에 코드 효율에 큰 문제가 있었다.

코드를 효율적으로 짜는 것도 중요하지만, 검토를 통해 효율적인 방법을 찾는 것도 중요한 것 같다.

느낀점

피드백을 받으니 이제야 프로젝트가 끝난 것 같다.

크게 어려웠던 부분은 없던 것 같지만 피드백 내용을 보니 부족한 부분도 분명히 있었다.

앞으로는 리액트를 배우겠지만 바닐라 자바스크립트로 만든 이 프로젝트 역시 중요하다고 생각한다.

기본에 충실한 개발자가 되도록 노력하자.

수많은 개인프로젝트가 있었을 텐데 하나하나 꼼꼼히 피드백해주신 튜터님께 감사함을 전하고 싶다.