책 내용을 기반으로 내용을 추가하고 삭제했습니다.

2장 웹 애플리케이션?

2.1 웹 애플리케이션?

웹 애플리케이션?
브라우저를 이용해 조작하는 애플리케이션을 말함.
SPA와 MPA로 나뉠 수 있음.

1. [브라우저]
   - 사용자가 브라우저에서 HTTP 요청을 보냅니다.
       ↓
2. [AP 서버]
   - HTTP 요청을 받아 애플리케이션 처리를 호출합니다.
       ↓     
3. [애플리케이션]
   - 요청에 따른 서비스 처리를 하고 데이터베이스 요청
   ↓
4. [데이터베이스]
   - 애플리케이션은 데이터베이스에서 필요한 데이터를 가져오거나 저장합니다.
       ↓
5. [애플리케이션]
   - 요청에 따라 필요한 처리를 수행한 후, 결과를 AP 서버로 반환합니다.
       ↓
6. [AP 서버]
   - 처리 결과를 HTTP 응답(Response)으로 브라우저에 전달합니다.
       ↓
7. [브라우저]
   - 브라우저는 받은 HTML 데이터를 바탕으로 화면을 구성합니다.

2.2 MPA vs SPA

MPA: 'Multi Page Application'

• 다중 페이지 애플리케이션으로, 사용자가 페이지를 이동할 때마다 서버로 새로운 요청을 보내고, 각 요청에 대해 새로운 HTML 페이지를 서버에서 받아오는 방식.
  

SPA: 'Single Page Application'

• 단일 페이지 애플리케이션으로, 최초에 한 번만 HTML, CSS, JavaScript를 로드하고, 이후에는 클라이언트 측에서 필요한 데이터를 서버에서 가져와 동적으로 화면을 업데이트하는 방식.
  

SPA와 MPA 비교

항목	SPA (Single-Page Application)	MPA (Multi-Page Application)
페이지 전환	클라이언트에서 동적 렌더링 (HTML 새로 로드 안 함)	서버에서 새로운 HTML 페이지를 받아 새로 로드
라우팅 방식	클라이언트 측 라우팅 (JavaScript로 처리)	서버 측 라우팅 (URL 변경 시 서버에서 처리)
렌더링	브라우저에서 JavaScript가 데이터 기반으로 렌더링	서버에서 HTML을 생성하여 클라이언트에 전달
속도	초기 로드 느림, 이후 빠름	페이지 전환 시 전체 새로고침으로 속도가 느릴 수 있음
사용 사례	대화형 웹 애플리케이션 (소셜 미디어, 대시보드 등)	전통적인 웹사이트 (블로그, 뉴스, 쇼핑몰 등)
SEO	기본적으로 SEO에 불리 (SSR 필요)	기본적으로 SEO 친화적
상태 유지	상태가 유지되며 부드러운 사용자 경험 제공	페이지 이동 시 상태 초기화
기술 스택	React, Vue.js, Angular 등의 프레임워크 사용	PHP, JSP, ASP.NET 등의 서버사이드 렌더링 기술 사용

2.3 처리 흐름

Controller, Service, Repository, Entity, View, 어떻게 연동되는지 처리의 흐름을 나타낸 것.

---

SPA, MPA 그림 출처 : 그림으로 배우는 스프링6 입문 제2장
처리의 흐름 그림 출처 : 같은 책에서 가져옴.