[refactor] Lv.0 리팩토링 시작

제가 처음으로 참여한 프로젝트인 코딩존 예약 시스템과 익명게시판 서비스랄까요??ㅎㅎ

 

지금 리팩토링 하려는 서비스는 React를 사용한 첫 번째 웹 서비스였고 처음으로 이렇게 규모가 큰 프로젝트를 진행하다 보니 부족한 점도 많았다. 기능 구현 자체는 잘 되었지만 개발 과정에서 폴더 구조나 코드 컨벤션을 깊게 고민하지 못했고, 유지보수성을 고려한 설계가 부족했던 게 아쉬웠다.

 

처음에는 "잘 작동하니까 괜찮겠지?"라고 생각했지만 실제로 시범 운영을 하면서 앞으로 이 서비스를 관리할 사람들을 위해 더 체계적인 코드 구조와 네이밍 규칙을 적용해야겠다는 필요성을 느꼈다. 또한 서비스 사용자들에게서 더 직관적인 UI가 필요하다는 피드백을 받았고 이를 반영하기 위해 리팩토링을 진행하려고 한다.

ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ

⭐리팩토링이 필요한 이유⭐

처음에는 기능이 잘 동작하니까 문제없다고 생각했다. 하지만 서비스가 유지보수되는 과정까지 고려하면 몇 가지 개선해야 할 점들이 보였다.

1️⃣ 코드 구조와 네이밍 규칙의 일관성이 부족함
처음 개발할 때는 빠르게 기능을 구현하는 데 집중하다 보니 폴더 구조와 파일 네이밍이 일관되지 않았다. 이런 상태로 서비스가 계속 유지되면 앞으로 코드를 수정하거나 기능을 추가할 때 가독성이 떨어지고 다른 개발자가 프로젝트를 이어받기 어려울 가능성이 크다.

 

2️⃣ 유지보수와 확장성을 고려한 코드 개선 필요
현재 기능은 정상적으로 동작하지만 코드가 재사용성을 고려하지 않고 작성된 부분이 많다. 같은 기능을 하는 코드가 중복되어 있는 경우도 있고 컴포넌트화가 부족해서 수정할 때 여러 군데를 변경해야 하는 불편함이 있다. 앞으로 기능을 추가하거나 수정할 일이 생길 것을 생각하면 지금이라도 코드 구조를 정리하고 컴포넌트 기반 개발을 적용하는 것이 좋겠다고 판단했다.

 

3️⃣ 사용자 경험을 고려한 UI/UX 개선 필요
서비스를 사용한 학우들로부터 받은 피드백을 반영할 필요도 있다. 처음 개발할 때는 기능 구현에 집중했지만 이제는 실제 사용성을 고려해서 디자인을 다듬고 더 직관적인 UX를 제공하는 것이 중요해졌다.

🚀리팩토링 목표🚀

리팩토링을 통해 서비스가 더 체계적이고, 유지보수가 쉬우며, 사용자 친화적인 형태가 되는 것이 목표다.

✔ 코드 구조 정리 → 폴더 구조를 정리하고 기능별로 모듈화 하여 가독성을 높인다.
✔ 네이밍 컨벤션 적용 → 일관된 규칙을 적용해 코드 가독성을 향상한다.
✔ 컴포넌트 기반 개발 → 중복되는 UI 요소를 공통 컴포넌트로 분리해 재사용성을 높인다.
✔ UI/UX 개선 → 사용자 피드백을 반영하여 개선된 UI/UX 제공

이번 리팩토링을 통해 프로젝트가 더 다듬어진 형태로 발전할 수 있도록 할 예정이다. 다음 글에서는 구체적으로 어떤 방식으로 리팩토링을 진행했는지 기록해보려고 한다요!