Next.js: React기반 Framework, Server Side Rendering에 장점이 있음 설치 방법 npx create-next-app next-tutorial( 설치 폴더 이름 ) # or yarn create next-app next-tutorial( 설치 폴더 이름 ) # Manual npm install next react react-dom # or yarn add react react-dom next create next-app설치 1. 컴파일과 번들링이 자동(webpack과 babel) - npm run dev // yarn run dev 2. 자동 리프레쉬 기능으로 바로 반영 3. 서버사이드 렌더링(개발자 모드에서 소스가 보임) 4. 스태틱 파일을 지원(public 폴더 활용) 5. pages폴더로 분기 6. [id].js라면 Global - CSS적용 방법 pages/_app.js에 import 시켜야함(모든 페이지 다 적용) import '../styles/globals.css' function MyApp({ Component, pageProps }) { return < Component {...pageProps} / > } export default MyApp cs Semantic(React용 부트스트랩같은거) https://react.semantic-ui.com/ yarn add semantic-ui-react semantic-ui-css ## Or NPM npm install semantic-ui-react semantic-ui-css pages/_app.js에 import import 'semantic-ui-css/semantic.min.css' _app.js 활용 페이지 전환시 레이아웃을 유지할 수 있음 페이지 전환시 상태값을 유지할 수 있음 componentDidCatch를 이용해서 커스텀 에러 핸들링을 할 수 있음 추