Next.js를 알아보자
Next.js 맛보기
next.js 는 리액트 기반의 프레임워크
create-next-app 으로 설치하면
- 컴파일과 번들링이 자동으로 된다. (webpack 과 babel)
- 자동 리프레쉬 기능으로 수정하면 화면에 바로 반영된다.
- 서버사이드 렌더링이 지원된다.
- 스태틱 파일을 지원한다.
https://react.semantic-ui.com/
npm install semantic-ui-react semantic-ui-css
import ‘semantic-ui-css/semantic.min.css’
레이아웃을 만들기 위해선 _app.js 을 이용함 모든 페이지는 이곳을 통함.
_app.js를 이용하면 페이지 전환시 레이아웃을 유지할 수 있음. 페이지 전환시 상태값을 유지할 수 이씀. componentDidCatch를 이용해 커스텀 에러 핸들링을 할 수 있음. 추가적인 데이터를 페이지로 주입시켜주는게 가능함. 글로벌 CSS를 이곳에 선언함.
_app.js에서 받은 Component는 페이지를 의미함. pageProps 는 초기 객체임. 메서드를 사용하지 않으면 빈 객체가 전달됨.