Alchemist Alchemist

Defining Routes https://nextjs.org/docs/app/building-your-application/routing/defining-routes Routing: Defining Routes | Next.js nextjs.org Creating Routes Next.js는 폴더를 라우트로 정의하는 파일시스템 기반의 라우터를 사용한다. 각 폴더는 라우트 세그먼트를 나타내며, URL의 각 세그먼트에 대응한다. 중첩 라우트를 생성하려면 폴더들을 중첩시키면 된다. page.js 파일은 공개적으로 접근 가능한 라우트 세그먼트를 만드는데 사용된다 위 예에서, /dashboard/analytics URL 경로는 공개적으로 접근이 불가능한데, 이는 page.js 파일을 갖지 않기 떄문이다. 이 폴..

https://nextjs.org/docs/app/building-your-application/routing Building Your Application: Routing | Next.js nextjs.org 위 페이지를 번역 및 정리한 것입니다. Terminology - Tree: 계층적 구조를 시각화한 것. - Subtree: 트리의 일부 - Root: 트리나 서브트리의 첫번째 노드 - Leaf: 자식 노드가 없는 노드(ex: URL 경로의 마지막 세그먼트) - URL Segment: 슬래시로 구분되는 URL 경로의 일부 - URL Path: 도메인 영역 다음으로 오는 URL의 일부 The App Router 버전 13에서 Next.js는 React Server Components를 기반으로 한 새..

https://nextjs.org/docs/app 번역 App Router | Next.js nextjs.org Next.js의 앱 라우터는 React의 최신 기능을 이용한 앱을 개발하기 위한 새로운 패러다임이다. Next.js에 이미 익숙하다면, 앱 라우터는 파일시스템 기반의 페이지 라우터의 자연스러운 진화임을 알 수 있을 것이다. 새로운 앱에 대해, 앱 라우터를 사용할 것을 추천한다. 이미 존재하던 앱에 대해서는 점진적으로 앱 라우터를 적용할 수 있다. 하나의 앱 안에서 두 종류의 라우터를 모두 사용하는 것도 가능하다. FAQs Layout에서 요청 객체에 어떻게 접근하나요? 원본 요청 객체에 의도적으로 접근할 수는 없다. 그러나, server-only 함수를 통해 요청의 헤더와 쿠키에는 접근할 수 ..

https://nextjs.org/docs/pages Pages Router | Next.js nextjs.org Next.js 13 이전에는 페이지 라우터가 주요 라우팅 방법이었다. 이는 각 파일을 라우트에 매핑하는 직관적인 파일시스템 라우터를 사용한다. 페이지 라우터는 최신 버전의 Next.js가 아직 지원하나, React의 최신 기능 활용을 위해 앱 라우터(App Router)로 마이그레이션 하는 것을 추천한다. 디렉토리 구조가 다음과 같다고 가정할 때, - pages/ - index.js - about.js - contact.js - blog/ - [id].js - index.js 경로는 다음과 같이 자동으로 매핑된다. Route Path / pages/index.js /about pages/ab..

https://nextjs.org/docs 를 번역하였습니다. Next.js란? Next.js는 풀스택 웹앱을 만들기 위한 React 프레임워크이다. Next.js는 React에 필요한 번들링, 컴파일링에 필요한 도구를 추상화 및 자동화하여 개발자가 프로젝트 구성보다는 개발에 집중할 수 있도록 한다. Next.js는 빠르고, 동적이고, 인터랙티브한 React 앱을 만들 수 있도록 도와준다. 주요 기능 Routing 레이아웃, 계층적 라우팅(nested routing), 로딩 상태, 에러 핸들링 등을 지원하며 서버 컴포넌트의 최상위에 위치하는 파일시스템 기반 라우터 Renderinig 클라이언트 및 서버 컴포넌트를 통한 클라이언트사이드 및 서버사이드 렌더링. 서버에서의 정적 / 동적 렌더링을 통해 최적화된..