인프런 커뮤니티 질문&답변
작성한 질문수
안녕하세요 강사님이 템플릿 엔진에 대해서 질문이 있습니다.
작성
·
3.2K
15
성능 문제로 템플릿 엔진보다는 웹 프레임워크 vue.js react.js angular.js를 쓴다고 들었습니다. 여기 강의에서 thymeleaf 템플릿 엔진을 사용했는데, spring에서 템플릿 엔진을 꼭 써야하는지 아니면 간단하게 예제로써만 사용하고 나중에는 react.js vue.js angular.js같은 웹 프레임워크를 사용하는 지 궁금합니다.
답변 1
53
안녕하세요. hyungchulpak님 좋은 질문입니다.
웹 애플리케이션 개발은 크게 2가지 렌더링 방식이 있습니다.
1. 서버 사이드 렌더링
설명: 서버에서 완전한 HTML을 만들어서 내려줍니다. 대표적으로 jsp, thymeleaf, velocity, freemarker가 있습니다.
장점: 단순하고, 학습 곡선이 낮습니다. 백엔드 개발자도 쉽게 개발할 수 있습니다.
단점: 동적이면서 복잡한 화면을 만들기 어렵습니다.
2. 클라이언트 사이드 렌더링
설명: 서버는 API만 제공하고, 자바스크립트 프레임워크가 템플릿과 서버 API 응답 결과를 조합해서 HTML 화면을 동적으로 만듭니다. 대표적으로 react, vue.js, angularJS 등이 있습니다.
장점: 동적이고, 복잡한 화면을 만들기 좋습니다.
단점: 공부할 분량이 매우 많습니다. 자바스크립트에 능숙해야 합니다. 웹 프론트엔드 개발자라는 전문 분야가 있습니다.
정리
클라이언트 사이드 렌더링은 웹 프론트엔드 개발자라는 전문 분야가 있을 정도로 학습해야 할 내용이 많습니다. 저희 회사를 비롯한 대부분의 회사가 백엔드 서버 개발자와 웹 프론트엔드 개발자를 별도로 채용합니다.
실무에서는 서버 사이드 렌더링도 필요하고 클라이언트 사이드 렌더링도 필요합니다. 단순하고 정적인 화면이라면 서버 사이드 렌더링 기술로 개발을 금방 끝낼 수 있습니다.
제가 추천하는 방법은 먼저 서버 사이드 렌더링 기술을 하나라도 배우고, 그 다음에 여유가 되면 클라이언트 사이드 렌더링 기술은 옵션으로 배우시는 것을 추천드립니다.
그래서 선택지를 드리자면^^
1. 자바스크립트에 자신있고, 완전 풀스택으로 갈것이다. = react + typescript
2. 백엔드 개발이 좋고, 스프링이 좋은데, 어쩔 수 없을 때 화면을 찍겠다. = thymeleaf
3. 레거시 하는 회사에 입사해야 한다. = jsp (ㅠㅠ)
4. velocity는 그냥 그걸 사용하는 회사에 입사하고 고민해도 됩니다. ㅎㅎ (쉬워서요 ㅎㅎ)
감사합니다.
개발자입니다. SSR,CSR 개발방식이 다른것일뿐.. SSR이 왜 동적이면서 복잡한 화면을 못만든다고 생각하시는지? 결론만 말씀드리면 가능합니다. 세밀한 컨트롤이 물론 react가 좋긴 하겠지만.. 그만큼 알아야 할게 많은건 사실인거 같습니다. state 체크를 위해 redux까지 쓰는거 보면 생각보다 코드 보기가 어렵다라는 생각입니다. SSR기준에서 동적인 기술과 복잡한 화면은 과거 SI플젝에서 기술들을 많이 썼습니다. 컴포넌트 단위로 쪼개서 개발은 하는건 재활용측면에서 좋겠지만 너무 많아지니 오히려 소스가 보기 힘들었습니다. angularjs처럼 향후 몇년안에 인기가 식을듯 합니다. 개인적인 사견입니다.
선생님 그럼 백엔드로는 Spring을 사용하고, react로 프론트엔드를 개발하려면 어떻게 해야하나요..? 백엔드로 Spring을 쓰면 , 프론트엔드는 thymeleaf가 강제되는것인가요..? react나 vue와는 협업할 방법이 없는것인지 궁금합니다..