문제
- 팀 과제 프론트엔드 시도
- 생각보다 프론트엔드가 쉽지 않다. 프론트엔드 자체도 쉽지 않고, 프론트엔드랑 백엔드 연결하는 부분도 쉽지 않다.
- 그중에 문제가 되었던 부분은 form 형식의 데이터를 백엔드로 보내주는 것이었다. 해당 부분에서 백엔드에 데이터가 잘 전달되지 않아서 어려움을 겪었다.
시도
- 팀 과제 프론트엔드 시도
- 거의 1시간이 가까이 지나고 나서 새로운 방법을 시도하였는데 바로 form을 사용하지 않고 button으로 넘겨주는 방식이었다.
- form을 만들어서 profileRequestDto로 넘기려고 했으나 되지 않아서 form을 지우고 button class="btn btn-primary mt-2"수정하기/button 를 만들어서 보내니 해결할 수 있었다. (velog에 작성이 안되어서 꺽쇠는 지움)
해결
- 팀 과제 프론트엔드 시도
- 백엔드로 연결할 때에는 form으로 데이터를 보내는 것이 아니라 document.querySelector로 받아온 데이터 value를 Json.stringfy를 통해서 바디에 전달하는 방법을 사용하는 편이 좋다고 해서 그렇게 사용하였다.
- RedirectView
- 백엔드에서 RestController에서 Controller로 바로 redirect하는 방법을 찾아보았는데 RedirectView라는 타입을 사용하면 바로 이동하는 것을 알 수있었다.
public RedirectView redirectToMainHome() {
// Redirect to "/main/home" or any other desired URL
return new RedirectView("/main/home");
}
해당 코드를 사용하면 controller에 /main/home으로 맵핑되는 곳으로 redirect 해준다.