[NextJS] 동적 routing 작업하기 [NextJS] 동적 routing 작업하기 이번 게시글에서는 동적 routing 작업을 해보겠습니다. 동적 routing 우리가 하고자 하는 것은 /details/과일이름 url을 만들고 해당 url에 접속하면 해당 컴포넌트가 보여지는 것입니다. 여기서는 apple, banana, orange가 있다고 가정해보겠습니다. 그럼 pages/details 폴더 아래 apple. banana, orange 파일을 만들어 주어야 합니다. 아래 이미지를 참고해봅시다. 해당 컴포넌트 코드도 확인해보겠습니다. apple.js코드는 아래와 같습니다. (나머지 동일 패턴) export default function Apple() { return Apple 페이지; } 그렇다면 해당 url에 접속하기 위한 header m.. 기타 (+ Legacy)/Legacy 3년 전
[NextJS] routing, 공통 layout 작업 [NextJS] routing, 공통 layout 작업 이번 게시글에서는 NextJS에서 routing 작업을 하는 방법, 공통 layout을 잡는 방법을 알아보도록 하겠습니다. (css 설명은 없습니다.) routing & 공통 layout ◆ routing NextJS에서 routing 작업 하는 방법은 매우 간단합니다. 그냥 pages 폴더 아래 폴더 및 파일을 내가 원하는 url 형식으로 생성해주면 됩니다. 예를들어 /test/intro/a 와 같은 url을 만들고 싶으면 pages 폴더 아래 test 폴더 -> intro 폴더 -> a.js 파일을 만들면 됩니다. 그럼 해당 url로 접속할 경우 a.js 컴포넌트가 보여집니다. 그럼 예시로 /intro url를 생성해봅시다. 아래 이미지와 같이 .. 기타 (+ Legacy)/Legacy 3년 전