SPA (Single Page Application)
- 한개의 페이지로 이루어진 어플리케이션
- index.html 하나만 존재하고 라우터를 통해서 페이지 이동을 구현
- 서버에서 사용자에게 보여줄 파일을 담당(MPA)하지 않고 브라우저가 담당(SPA) → 자바스크립트!
- 웹페이지가 자바스크립트로 의해 렌더링됨
- 데이터베이스와 연결해주는 방법은 REST API :
URL을 통해 서버에게 어떤 행위를 요청하고 응답받는 것
- 클라이언트가 axios로 전송 요청하면 서버가 json 형식으로 결과물을 보내줌
- 페이지를 이동할 때마다 자바스크립트로 인해서 웹페이지의 DOM 구조가 바뀌면서 렌더링됨 (html은 계속 하나)
- ☹️ 자바스크립트의 역할이 커짐 = 규모가 커질수록 파일이 너무 커진다
- SSR로 단점 해결
- 자바스크립트로 html 파일을 바꿔주는 방법 : 라우터
↔️ MPA (Multi Page Application)
- index.html 외에도 여러 html 파일로 페이지 이동을 구현
- 작동 방법
- 서버에 다양한 html 파일을 미리 만들어둠
- 클라이언트에서 서버에 요청하면 html 파일을 전송
- 브라우저는 단지 보여주기만 하고, 요청한 웹문서 처리는 전부 서버에서 담당
- ☹️ 서버 “살려줘…!” (페이지를 이동할 때마다 매번 새로운 정보를 보여줘야 하기 때문)