geonhwiii 님의 상세페이지 ＞ [7팀 정건휘] Chapter 2-1. 클린코드와 리팩토링

[7팀 정건휘] Chapter 2-1. 클린코드와 리팩토링

by geonhwiii2025. 8. 1.

과제 체크포인트

배포 링크

https://geonhwiii.github.io/front_6th_chapter2-1/

기본과제

  • 코드가 Prettier를 통해 일관된 포맷팅이 적용되어 있는가?
  • 적절한 줄바꿈과 주석을 사용하여 코드의 논리적 단위를 명확히 구분했는가?
  • 변수명과 함수명이 그 역할을 명확히 나타내며, 일관된 네이밍 규칙을 따르는가?
  • 매직 넘버와 문자열을 의미 있는 상수로 추출했는가?
  • 중복 코드를 제거하고 재사용 가능한 형태로 리팩토링했는가?
  • 함수가 단일 책임 원칙을 따르며, 한 가지 작업만 수행하는가?
  • 조건문과 반복문이 간결하고 명확한가? 복잡한 조건을 함수로 추출했는가?
  • 코드의 배치가 의존성과 실행 흐름에 따라 논리적으로 구성되어 있는가?
  • 연관된 코드를 의미 있는 함수나 모듈로 그룹화했는가?
  • ES6+ 문법을 활용하여 코드를 더 간결하고 명확하게 작성했는가?
  • 전역 상태와 부수 효과(side effects)를 최소화했는가?
  • 에러 처리와 예외 상황을 명확히 고려하고 처리했는가?
  • 코드 자체가 자기 문서화되어 있어, 주석 없이도 의도를 파악할 수 있는가?
  • 비즈니스 로직과 UI 로직이 적절히 분리되어 있는가?
  • 코드의 각 부분이 테스트 가능하도록 구조화되어 있는가?
  • 성능 개선을 위해 불필요한 연산이나 렌더링을 제거했는가?
  • 새로운 기능 추가나 변경이 기존 코드에 미치는 영향을 최소화했는가?
  • 코드 리뷰를 통해 다른 개발자들의 피드백을 반영하고 개선했는가?
  • (핵심!) 리팩토링 시 기존 기능을 그대로 유지하면서 점진적으로 개선했는가?

심화과제

  • 변경한 구조와 코드가 기존의 코드보다 가독성이 높고 이해하기 쉬운가?
  • 변경한 구조와 코드가 기존의 코드보다 기능을 수정하거나 확장하기에 용이한가?
  • 변경한 구조와 코드가 기존의 코드보다 테스트를 하기에 더 용이한가?
  • 변경한 구조와 코드가 기존의 모든 기능은 그대로 유지했는가?
  • (핵심!) 변경한 구조와 코드를 새로운 한번에 새로만들지 않고 점진적으로 개선했는가?

과제 셀프회고

과제를 하면서 내가 제일 신경 쓴 부분은 무엇인가요?

AI를 사용함에 있어 실수를 줄이는 방향을 많이 생각했습니다.

AI는 한 번에 많은 코드를 수정하는 것을 어려워하기 때문에,

점진적으로 개선하도록 할 수 있는 프롬프팅에 고민을 많이 했습니다.

그리고, 세부적인 부분을 제가 수정할 수 있도록 하였습니다.

과제를 다시 해보면 더 잘 할 수 있었겠다 아쉬운 점이 있다면 무엇인가요?

조금 더 제 코드로 변환하는 시간을 가졌으면 좋았을 것 같습니다.

리뷰 받고 싶은 내용이나 궁금한 것에 대한 질문 편하게 남겨주세요 :)

자바스크립트에서 리액트로 변환할 때, 추천하는 아키텍처가 있을까요?

자바스크립트로 개발을 많이 안해보아서 폴더구조나 패턴에 대해서 고민이 됩니다.

반드시 이렇게 해야한다. 라기보다 다양성 측면에서 궁금합니다~!

과제 피드백

안녕하세요 건휘님! 4주차 과제 잘 진행해주셨네요. 고생하셨습니다~!

자바스크립트에서 리액트로 변환할 때, 추천하는 아키텍처가 있을까요?

아키텍쳐가 중요하진 않다고 생각해요 ㅎㅎ 아마 5주차 발제에서 나올 이야기 중에 "쏙쏙 들어오는 함수형 프로그래밍"에 대한 내용이 있을 것 같은데요, 리액트와 호환되는 코드는 순수함수와 데이터일 것이고 이를 잘 분리하기만 해도 큰 도움이 된답니다!

자바스크립트로 개발을 많이 안해보아서 폴더구조나 패턴에 대해서 고민이 됩니다.

저는 '응집도'를 높일 수 있는 방법이면 무엇이든 좋다고 생각해요. '응집도'가 높은 모습은... 가령 현재 코드에서 "장바구니 모듈"을 만든다고 가정했을 때 이를 깔끔하게 분리하여 제공할 수 있을지 보면 좋답니다. 깔끔하게 분리한다 = 한 폴더를 통째로 옮긴다 이렇게 보셔도 좋을 것 같아요.

가령, 보통 회사에서는 기능조직(개발자들이 한 팀)과 목적조직(제품 중심으로 기획자 / 디자이너 / 개발자 / PO 가 한 팀)이 있는데요 목적조직을 그대로 다른 회사에 옮겨도 어색함이 없지만, 기능조직으로 뿔뿔히 흩어져잇는 기획자/디자이너/개발자/PO를 다른 회사로 함께 옮긴다고 했을 때는 병목이 무척 많이 생길 수 있답니다. 모듈화가 어려운거죠.

그래서 응집도를 어떻게 높일 수 있을까!? 에 대한 고민을 해보시면 폴더구조에 대한 문제도 자연스럽게 풀이되리라 생각합니다!