BEYOND SW 캠프 15기 24주차 회고

mijuckboon·2025년 7월 6일

BEYOND SW 캠프 15기 회고

목록 보기

35/39

부트캠프 24주차 회고를 적어본다.

최종 프로젝트

이번 주에는 프론트엔드 개발을 진행하며, 백엔드 개발 당시 미처 고려하지 못해 프론트로 충분한 데이터가 전달되지 않던 부분을 수정하였다. 프론트엔드 개발을 1주일 안에 마무리하는 것을 목표로 잡았지만 예상대로 작동하지 않는 문제들을 해결하는 데 생각보다 많은 시간이 소요되었다. 그래도 오는 화요일이나 수요일까지는 마무리할 수 있을 것으로 예상한다.

문제 상황

이번 프로젝트를 진행하며 겪은 문제 상황을 정리해본다. 팀원이 해결한 문제도 일부 포함되어 있다.

1. 백엔드 서버 작동 중단

설명: 백엔드 서버가 아래와 같은 스택트레이스를 출력하며 중단되었다.
원인: Spring DevTools 사용 시 코드를 수정하면 서버 전체가 아닌 애플리케이션의 일부 context만 재시작한다. 하지만 MyBatis는 mapper xml 등의 리소스를 매번 새로 로딩해야 하므로, 이 과정에서 충돌이 발생한다고 한다.
해결 방법
1. 코드를 수정할 때마다 서버를 재시작한다. (현재 선택한 해결 방법)
2. DevTools를 사용하지 않는다.

2. 백엔드 서버 재시작 시 경고 로그 발생

설명: 백엔드 서버를 재시작 중 평소에 잘 보이지 않던 경고 로그를 발견하였다. 아래 사진의 두 번째 WARN 로그이다.

전문은 다음과 같다.

2025-07-04T14:56:36.833+09:00  WARN 27928 --- [  restartedMain] thorizationManagerRequestMatcherRegistry :
One of the patterns in [/holiday, employees/ids] is missing a leading slash.
This is discouraged; please include the leading slash in all your request matcher patterns.
In future versions of Spring Security, leaving out the leading slash will result in an exception.

원인
로그를 한 줄씩 해석해 보면 다음과 같다.
- [/holiday, employees/ids] 안에 포함된 패턴 중 하나에 leading slash가 없음
- 이는 권장되지 않으니 모든 request matcher pattern에 leading slash를 포함할 것을 권유
- 나중에 버전이 업데이트 되면 exception을 발생시킬 예정
해결 방법
leading slash가 없는 패턴은 employees/ids이다. 이를 /employees/ids로 수정하였다.

더 이상 해당 로그가 뜨지 않는 것을 볼 수 있다.

3. 사이드바 라우팅 문제

설명
아래 사진과 같이 사이드바를 통해 전체 결재 내역 -> 상세 조회 -> 전체 결재 내역 순으로 이동하면 빈 페이지가 출력되었다.
원인
사이드바의 hrefs 내 경로를 상대 경로로 작성한 것이 문제였다.

아래 이미지와 같이 올바른 경로 /approvals가 아닌 /approval/approvals로 매핑하고 있음을 확인할 수 있다.
해결 방법
사이드바에 작성된 모든 경로를 절대 경로로 수정하여 해결하였다.

4. 알림창 및 출퇴근 모달이 원하는 위치에 나타나지 않는 문제

설명
사이드바의 종모양 버튼을 눌러도 알림창이 뜨지 않으며, 출근/퇴근 버튼을 눌렀을 때 사이트 중앙에 떠야 하는 모달이 아래 사진과 같이 사이드바 안에 갇힌 채로 나타났다.

모달 위치 문제

원인
사이드바에 애니메이션 효과를 주기 위해 작성한 스타일 코드 중 translateX가 문제였다.
해결 방법
해당 부분을 지운 이후 출퇴근 모달 및 알림창이 정상적으로 나타났다.

5. 주말에 출근 모달이 뜨는 문제

설명
주말에는 출근 버튼을 누르면 "승인 없는 주말 근무는 불가능합니다."라는 토스트 알림이 떠야 하지만, 실제로는 아래와 같이 평일처럼 출근 모달이 떴다.
원인
JSON 직렬화 과정에서 응답 객체의 필드 isWeekend, isHoliday가 각각 weekend, holiday로 수정된 것이 원인이었다. 이는 예상에 없던 시나리오였기에, 프론트엔드 코드에서 잘못된 필드를 참조하였다.

백엔드 코드 및 Postman 응답 결과

해결 방법
프론트엔드에서 필드명을 수정한 후 해결되었다.

수정 후

이 외에도 프론트엔드에서 다양한 문제를 만났는데, ChatGPT가 알려준 방법을 적용해봐도 문제가 해결되지 않을 때가 많아 애를 먹었다. 오랜 시간의 사투 끝에 제시해준 새로운 방법을 적용하고 해결된 경우가 많았는데, ref로 작성한 부분을 reactive로 변경하거나 v-bind로 작성한 부분을 :을 이용하여 컴포넌트에 넘겨주는 등 다소 단순한 방법들이었다. ~~진작 그렇게 알려주지~~

배운 점

이번 문제 상황 해결을 통해 배운 점을 정리해본다.

1. 서버 로그 모니터링의 중요성

백엔드 서버 가동 시 작동하는 로그를 모니터링하는 것이 중요함을 배울 수 있었다. 만약 실무 상황에서 위의 문제 상황이 발생했지만 경고 로그를 주의 깊게 살펴보지 않았다면, 추후에 Spring Security 버전을 올리다가 시스템 마비를 겪게 되었을 지도 모른다.
버전 업그레이드가 자주 있는 일은 아니겠으나, 로그를 잘 확인한 덕분에 이러한 위험을 미리 감지하고 대응할 수 있었다.

2. 사람은 실수를 통해 배울 수 있다는 것

만약 모든 팀원이 request matcher 경로에 슬래시를 잘 작성했다면 이런 문제가 발생할 수 있음을 인지하기 어려웠을 것이다. 슬래시 없이 작성된 경로 덕분에 한 가지 더 배워갈 수 있었다. 모든 것을 실수하며 배우기에는 시간이 부족하기에 효율적인 학습을 추구하는 것도 필요하지만, 시행착오를 직접 겪어보는 것은 많은 공부가 된다. 실패를 두려워하지 않고 도전해야 하는 이유가 아닐까 싶다.

느낀 점

이전 프로젝트에서는 맡은 기능을 구현하기 급급하여 다른 부분을 신경쓸 겨를이 없었던 적이 많았는데, 이제는 이뿐만 아니라 발생한 문제를 해결하여 팀원 전체에게 공유할 수 있게 된 걸 보면 지난 5개월 반 동안 많이 성장했구나 싶다. 이제 약 2주 후면 최종 프로젝트가 끝나고 부트캠프를 수료하게 되는데, 남은 여정을 잘 마무리해야겠다.