스프링부트 + 프런트앤드 개발에 관한 질문입니다.

Question

제가 스프링부트 개발의 프런트앤드 쪽을 맡을 예정인데요 대게 스프링부트 프런트앤드 즉 view 단에서는 템플릿 (머스터치, 타임리프 등) 을 이용하여 개발하는 것으로 압니다. 그런데 이번에 프런트앤드 개발은 (JSP 인지 단순 HTML 인지 모르겠음) 컨트롤러에서 Rest Api 방식으로 아마 JSON 을 전달할 예정입니다. 질문: 1. Rest Api 방식으로 데이타를 전달한다는 의미는 View 단의 페이지에서 Ajax 를 이용하여 값을 전달 받는다는 의미 인지요? 2. 제가 알기로는 컨트롤러단에서 return 시 Model and View 로 View 페이지주소를 return 하는것으로 아는데 AJAX 가 아니면 JSP 로 구성한다는 것인지요? 3. 컨트롤러에서 return 을 &#64;RestController 로 Json만 return 한다면 View 에서는 1번질문처럼 해야 하는데 URL (프런트컨트롤러? 라우터?) 지정은 어떻게 되는 것인지요? URL 주소에 파일확장자(.jsp, .html, .do 등) 없이 MVC 주소패턴으로 가능한지요?

Bluebell · Answer

이게 참... 요즘 기준으로 말해야하는건지 항상 이론으로 말해야하는건지....컴퓨터가 계속 발전하고 운영체제도 계속 발전하는 것처럼 말씀하신 템플릿을 만든회사도 계속 기능개발을 하는거라 다양해지고 있습니다.일단 맞습니다. ajax와 feach을 쓰든 데이터를 주고 받을 수 있습니다.일단 view 페이지 주소를 리턴한다고 해야 이해가 빠르시겠네요. 정확히 말하면 jsp파일이 있는 위치를 이야기 합니다. thymeleaf로 치면 reuturn &#34;a/b(.html)&#34; 이런식으로 되는거죠.Restcontroller을 사용한다 치면 프론트 프레임워크가 주소를 분기한다고 생각하면 됩니다. 가령 리액트의 axios, routerdom이 담당한다고 생각하시면 될거 같습니다 초보단계에서는. Restconteroller을 사용하지않고 일반적인 컨트롤러을 사용한다 해도 요즘에는 보내는건 model로 보내고 비동기로 ajax로 갱신 가능합니다. 아예 form을 ajax을 보내서 바로 갱신이 가능하기도 하구요.보통 일반적인 컨트롤러 형식은 코드로 예시를 들면thymeleaf에서$(document).ready(function () {$('#deleteBtn').click(function () {let isConfirmed &#61; window.confirm(&#34;정말로 삭제하겠습니까?&#34;);if (isConfirmed) {let rvno &#61; /[[${boardDTO.rvno}]]/ ''; // Model로 보낸거let regDate &#61; /[[${boardDTO.regDate}]]/ ''; // Model로 보낸거let search &#61; /[[${search}]]/''; // Model로 보낸거$.ajax({type: &#34;POST&#34;,url: &#34;/board/boardDelete&#34;,data: {rvno: rvno},success: function (response) {alert(response.success);if (search &#61;&#61; true) {window.location.href &#61; &#34;/board/searchlist&#34;;} else {window.location.href &#61; &#34;/board/boardlist?regDate&#61;&#34; &#43; regDate;}},error: function (jqXHR) {let responseDTO &#61; JSON.parse(jqXHR.responseText);alert(responseDTO.error);}});}});});컨트롤러에서&#64;PostMapping(&#34;boardDelete&#34;)public ResponseEntity<?> boardDelete(&#64;RequestParam(&#34;rvno&#34;) Long rvno) {ResponseDTO responseDTO &#61; new ResponseDTO();if (boardService.remove(rvno).booleanValue()) {responseDTO.setSuccess(&#34;삭제 성공&#34;);return new ResponseEntity(responseDTO, HttpStatus.OK);}responseDTO.setError(&#34;삭제 실패&#34;);return new ResponseEntity(responseDTO, HttpStatus.INTERNAL_SERVER_ERROR);} 이런 느낌이 되는거죠. Model로 받고 비동기 처리로 결과는 리스폰스로 받을수 있구요.결론은 &#64;RestController를 사용한다면 리액트면 리액트가 uri를 처리한다고 생각하고 &#64;Controller면 위와 같이 처리한다고 생각합시당. 물론 모델로 안 받고 ResponseEntity 등 으로 json을 주고 받을수도 있습니다. 근데 갈수록 발전되고 있는데 굳이 json get으로 받는건... 어 팀프방향성 이긴 하겠지만요.

초무쿤 · Answer

SPA(Single Page Application)을 한번 찾아보시면…

스프링부트 + 프런트앤드 개발에 관한 질문입니다.

2개의 답변

Q&A 목록