오늘의 회고
드디어 3일에 걸친 화면 연동이 끝났다!!
- 조회 기능들은 View 를 사용해서 했다.
- 그 외 기능들은 ajax 통신을 사용했다.
자신없는 JavaScript 로 화면연동을 하고 이것저것 다루다보니 연동하는데 시간이 정말 오래 걸렸다. 3일동안 평균 6~7시간씩 프로젝트만 진행했다.
a 버그를 해결하면 어딘가에서 b 버그가 튀어나오고 그 다음은 c.. 도중에 erd도 약간 수정했다..
그래도 잘 연동된 결과물을 보니 정말 뿌듯하다.
@Vaild 유효성 검사 예외 처리
백엔드 개발 시 XXXRequest를 받을 때 @Valid로 검증을 해줬다. 그리고 이제 화면 연동을 진행하면서, 이 검증을 화면에선 어떻게 사용해야되는지 고민을 했다.
완전히 MVC로만 개발한다면 아마도 타임리프에 BindingResult 결과를 넣어주면 되겠지만 나는 GET을 제외한 다른 기능들을 RESTful api로 개발해서 다른 방법을 찾아보았다.
내가 사용한 방법은 서버에서 난 예외를 잡아 처리한 후 예외 처리 메시지를 화면으로 보내는 방법이다.
- 예시
@Getter
public class PostUpdateRequest {
@Size(max = 1000, message = "내용은 1000자 이내로 입력해주세요.")
private String contents;
@Size(max = 250, message = "내용은 250자 이내로 입력해주세요.")
private String description;
}@Valid 위반 시 터지는 예외는 MethodArgumentNotValidException 예외이다. GlobalExceptionHandler 에서 이 예외를 잡고 에러 메시지를 JSON 형태로 반환한다.
이 메서드는 에러 메시지가 든 errors를 HTTP 상태 코드 400 (BAD_REQUEST)와 함께 클라이언트로 보낸다.
이제 이걸 화면에 뿌려주기 위해 JavaScript 코드를 사용했다.
클라이언트 측에서는 fetch API를 사용하여 reponse.ok 상태가 아니면, 즉, 서버가 에러를 반환한 경우 reponse.text()를 사용하여 에러 메시지를 텍스트로 읽는다. 그리고 읽은 errorMessage 를 사용자가 볼 수 있게 alert 창으로 띄우게 했다.
- 사용자 결과 화면
에러 처리 핸들러에서 직접 예외를 잡고 메시지를 출력해주니 에러를 처리하기 쉬워졌다.
내일 할 일
- 사용자로부터 숨겨놓으려다 나까지 까먹어버린 회원탈퇴 기능 추가하기
- 이제 더이상 미룰 수 없는 .. s3 연결하고 파일 업로드 기능 추가하기
- 시큐리티 화면 접근 제한하기
3일 내내 화면을 만지고 있었더니 빨리 테스트 코드를 짜러 가고싶은 심정이다..
개발하면서 정말 더러운 코드들이 많이 생겨서 배포 전 조만간 백엔드 & 프론트엔드 코드들을 싹 정리하는 시간도 가져야겠다.
