[JavaScript] 서버 사이드 랜더링 & 클라이언트 사이드 랜더링

클라이언트 사이드 렌더링에서는 전체 페이지가 아닌 일부 데이터만 갱신하기 위해 AJAX(Asynchronous JavaScript and XML) 통신을 사용합니다. AJAX를 통해 서버에 요청을 보내고, 서버는 JSON(JavaScript Object Notation) 형식으로 데이터를 응답합니다. 이 데이터를 받아 DOM(Document Object Model)을 찾아서 업데이트합니다. 만약 페이지의 구성이 AJAX 요청으로만 이루어진다면, 실제로는 페이지 전환이 이루어지지 않고, 이를 SPA(Single Page Application)라고 부릅니다. SPA는 한 페이지 내에서 필요한 데이터만 로드하여 동적으로 페이지를 갱신하기 때문에, 사용자 경험이 매우 부드럽고 빠르게 느껴집니다.

const idBtn = document.querySelector("#myBtn");
const classBtn = document.querySelector(".myBtn");
const tagBtn = document.querySelector("button");