SSR, CSR, SSG, ISR - Next.js 렌더링 방식의 이해와 구현
개요 Next.js는 현대적인 웹 애플리케이션을 개발하기 위해 다양한 렌더링 방식을 지원한다. Next.js의 SSR(Server-Side Rendering), CSR(Client-Side Rendering), SSG(Static Site Generation), ISR(Incremental Static Regeneration) 기능을 활용하면 성능과 ...
개요 Next.js는 현대적인 웹 애플리케이션을 개발하기 위해 다양한 렌더링 방식을 지원한다. Next.js의 SSR(Server-Side Rendering), CSR(Client-Side Rendering), SSG(Static Site Generation), ISR(Incremental Static Regeneration) 기능을 활용하면 성능과 ...
렌더링이란? 렌더링은 웹 페이지나 애플리케이션의 코드 (HTML, CSS, JavaScript 등)를 사용자가 볼 수 있는 화면으로 변환하는 과정이다. 이 과정을 통해 서버에서 전달된 코드가 웹 브라우저에서 처리되어, 사용자가 텍스트, 이미지, 버튼 등을 볼 수 있도록 화면에 표시된다. SSR, CSR이란? 렌더링은 어디서 실행되는지에 따라 두 가지...
정적 빌드란? 정적 빌드(Static Build)는 웹사이트의 콘텐츠와 페이지를 미리 HTML, CSS, JavaScript 파일로 생성하여 배포하는 방식입니다. 정적 웹사이트는 사용자가 페이지에 접근할 때마다 서버에서 별도의 처리 없이 미리 만들어진 파일을 그대로 제공하므로, 빠른 로딩 속도와 안정적인 성능을 제공합니다. 정적 빌드의 특징 ...
ERD Editor 소개 프로젝트를 진행하다가 ERD를 그릴 일이 생겼는데 vscode에서 그릴 수 있나 찾아보다가 다음 extension을 발견했다. 이 extension을 활용하면 다음과 같이 GUI 형태로 ERD를 편집하고 볼 수 있다. draw.io 같은 툴 보다 UI가 깔끔하고 마음에 들었다. 간단한 사용방법 exten...
HTTP 요청 라이브러리 비교: Axios, Redaxios, Fetch 프로젝트에서 Node.js 환경에서의 크롤링을 위해 HTTP 요청 라이브러리를 사용하게 되었다. 특히 Node.js 18부터 Fetch API가 기본으로 내장되면서, 기존에 많이 쓰이던 Axios와 Redaxios, 그리고 Fetch의 차이점을 비교해봤다. Axios ...