카테고리 없음

NEXT-JS-2 실행

짱구러버 2022. 5. 7. 18:23
728x90

 

기존의 pages 폴더내의 파일들을 지우고, index.js 파일을 하나 만들어준다.

import React from 'react' 를 안해줘도 된다. 

react 의 메소드인 useState, useEffect 를 사용할 때는 적어줘야한다.  

그리고 실행을 해보면 자동으로 next js 가 pages 의 파일을 랜더하는 것을 볼 수 있다. 

 우리가 csr 처럼 app.js 에서 route 처리 안해줘도 자동적으로 인덱스.js 를 찾는 것을 볼수 있다. 

pages 폴더내에 test라는 폴더를 만들면 ?

 

pages 폴더내에 url 이름을 적어주면 프레임워크가 자동으로 pages 의 이름을 url 로 만들어준다.

react-router-dom 을 따로 설치, Route 설정,  Component  import 하고 , 리랜더링 하고, 할 필요가 없어진다!! 시간절약 가능!

대신 프레임 워크 규칙을 지켜줘야한다. 

1. pages 폴더내의 파일 이름이 url 주소이다.

2. 파일내의 컴포넌트 이름은 아무거나 상관없다. (대신 export defualt 형태여야한다.)

3. component import 를 안해도 된다. 

728x90