HTML
- WAS는 정적 or 동적인 HTML 파일 생성해서 웹 브라우저에게 전달
ex) 동적인 경우 주문 정보 조회해서 출력
HTTP API
- HTML이 아니라 데이터를 전달
- 주문 정보 조회해서 JSON 형식 등의 데이터로 전달
- HTML 렌더링할 때 사용하는 것이 아니라, 다음과 같은 통신에서 데이터를 주고 받고 할 때 사용됨
- 다양한 시스템 연동
SSR - 서버 사이드 렌더링
- 서버에서 HTML 최종 결과를 다 만들고, 웹 브라우저는 보여주기만 한다.
ex) JSP, 타임리프
CSR - 클라이언트 사이드 렌더링
- HTML 결과를 자바스크립트를 사용해서 웹 브라우저에서 동적으로 생성
- 자바스크립트에서 HTML을 동적으로 생성해낸다.
- 웹 환경을 마치 앱처럼 부분부분 변경할 수 있음
ex) 구글 지도 / React, Vue.js
- 웹 브라우저가 서버에게 HTML 요청
- 서버는 내용이 없는 HTML 전달. 대신 자바스크립트 링크, 로직이 있음
- 웹 브라우저는 HTTP API로 데이터 요청
- 서버는 DB에서 정보를 가져와서 전달
- 웹 브라우저는 이 결과를 다 모아서 자바스크립트로 HTML 결과 렌더링
References
https://www.inflearn.com/course/%EC%8A%A4%ED%94%84%EB%A7%81-mvc-1/dashboard
인프런 - 김영한님의 [스프링 MVC 1편 - 백엔드 웹 개발 핵심 기술] 수강하며 필기한 내용입니다.
Übermensch