HTML, HTTP API, CSR, SSR

정적 리소스

정적 리소스를 제공할 때는 고정된 HTML, CSS, JS, 이미지, 영상 등을 제공한다.

브라우저에서 리소스를 요청하면 서버에서 보내준다.

동적으로 HTML을 생성해서 전달하기도 한다.

애플리케이션 로직을 처리하는 WAS가 DB로 주문 정보를 조회한 후 JSP나 타임리프 같은 것을 통해 동적으로 HTML을 생성한다. 브라우저는 이 HTML을 해석해서 표현한다.

HTML을 단순히 전달하는 게 아니라 데이터를 전달한다.

주문 정보를 조회해서 json 형식의 데이터를 내려준다. 웹 브라우저는 json을 해석하지 못하기 때문에 json 포맷 그대로 출력한다. 따라서 API 방식은 화면에 뿌려주는 용도가 아니라 다양한 시스템에서 사용할 때 활용된다.

데이터만 주고 받고 UI 화면이 필요하면 클라이언트가 별도로 처리한다. 앱/웹/서버 to 서버에서 사용된다.

요청 하면 그냥 상품에 대한 데이터만 내려준다. 이렇게 데이터만 주고 받는 것을 HTTP API라고 한다.

주로 json 형태로 데이터 통신한다.
UI 클라이언트와의 접점이 된다.
- 앱 클라이언트
- 웹 브라우저에서 자바스크립트를 통한 HTTP API 호출
- React, Vue 같은 웹 클라이언트
서버 to 서버

서버 개발자는 정적 리소스, HTML 페이지, HTTP API 이렇게 세 가지를 어떻게 뿌려줄지 고민하는 사람이다.

요청이 들어오면 서버가 최종적으로 HTML을 렌더링해서 전달한다. HTML 만드는 과정을 서버에서 다 끝내고 클라이언트는 받은 것을 보여주기만 한다.

자바 스크립트를 사용해 HTML 결과를 브라우저에서 동적으로 생성해서 사용한다.
주로 동적인 화면에 사용한다.
웹 환경을 마치 앱처럼 필요한 부분부분만 변경할 수 있다.
- 클릭할 때마다 url이 바뀌거나 하지 않는다.
- 구글 지도, Gmail, 구글 캘린더
React, Vue