react에서는 링크 이동할때 react-router를 쓰지만,
next에서는 자체적인 라우트가 있다.
AppLayout.js
import React from 'react';
import PropTypes from 'prop-types';
import Link from 'next/link';
const AppLayout = ({ children }) => {
return(
<div>
<Link href="/">노드버드</Link>
<Link href="/profile">프로필</Link>
<Link href="/signup">회원가입</Link>
{children}
</div>
)
}
AppLayout.propTypes = {
children:PropTypes.node.isRequired,
}
export default AppLayout;
npm i eslint -D
npm i eslint-plugin-import -D
npm i eslint-plugin-react -D
npm i eslint-plugin-react-hooks -D
-D 를 붙이면, 개발용으로만 붙이는 것이다.
package.jsn 설치되었다고 나온다.
.eslintrc 파일을 만들어준다.(확장자는 없다)
.eslintrc
{
"parserOptions":{
"ecmaVersion" : 2020,
"sourceType" : "module",
"ecmaFeatures" : {
"jsx" : true
}
},
"env" : {
"browser" : true,
"node" : true,
"es6" : true
},
"extends":[
"eslint:recommended",
"plugin:react/recommended"
],
"plugins":[
"import",
"react-hooks"
],
"rules":{
}
}