Multi Developer SuHo

Next.js 에서 동적 라우팅과 중첩 라우팅에 대해 설명하도록 하겠습니다. 동적 라우팅과 중첩 라우팅이 무엇이고, 이 둘의 차이점과 어떻게 라우팅 처리를 해야하는지 살펴보도록 하겠습니다. 목차1. Next.js 라우팅 시스템 이해하기1-1. app/ 디렉토리 기반 라우팅의 기본 개념1-2. 폴더 구조가 URL 구조를 결정한다는 원리1-3. 정적 라우팅과 파일 이름 기반의 자동 라우팅 방식2. 동적 라우팅 2-1. 동적 라우팅이란?2-2. 사용 방법2-3. 활용 예시3. 중첩 라우팅3-1. 중첩 라우팅이란?3-2. 사용 방법3-3. 활용 예시서론Next.js는 React 기반의 프레임워크 중에서도 가장 빠르고 직관적인 라우팅 시스템을 제공하는데요, 특히 Next.js 13 버전이후, App Router..

Next.js 를 사용하기전 렌더링 구조를 이해해야 사용할 수 있습니다. 서버 컴포넌트와 클라이언트 컴포넌트, 프리렌더링이 무엇이고, 하이드레이션에 대한 개념을 학습해보도록 하겠습니다.목차1. Next.js 13이후 렌더링 방식 개요1-1. 서버 컴포넌트란?1-2. 서버 컴포넌트 용도1-3. 클라이언트 컴포넌트란?1-4. 클라이언트 컴포넌트 용도1-5. 서버와 클라이언트 컴포넌트의 조합2. 프리렌더링(Pre-rendering)2-1. 프리렌더링이란?2-2. 프리렌더링 동작 방식3. 하이드레이션(Hydration)3-1. 하이드레이션이란?3-2. 하이드레이션 흐름서론Next.js는 React 기반의 강력한 프레임워크로, 꾸준히 발전해오고 있습니다. 특히 Next.js 13버전부터 도입된 App Router..

안녕하세요 리액트를 학습하고 난뒤 Next.js에 대해 알아볼려고합니다. Next.js가 무엇이고, 많은 개발자분들이 왜 Next.js를 선호하는지 그 이유에 대해 알아보면서 기본 개념을 갖춰보도록 하겠습니다. 📑목차1. Next.js1-1. Next.js란?1-2. Next.js를 왜 사용해야 할까?2. Next.js의 주요 기능2-1. 파일 기반 라우팅2-2. 서버 사이드 렌더링(SSR)2-3. 정적 사이트 렌더링(SSG)2-4. 증분 정적 재생성 (ISR)2-5. API 라우트3. 설치 및 프로젝트 생성 방법서론먼저 이 글을 포스팅할때 저는 이런 생각을 하게 되었습니다. "Next.js는 무엇이고, 현대사회에서 많은 개발자분들이 선호하는 프레임워크인 Next.js를 왜 사용할까? 라는 의구심이 들..