Pages 폴더안의 파일이름은 곧 라우터 주소로 사용된다.
ex) localhost:3000/ -> index.tsx 파일
localhost:3000/about -> about.tsx 파일
_app.tsx 파일은 라우터로 호출된 파일 또는 components와 props를 받아 리턴한다.
fragment 안에 전역 GLOBAL css 요소나 NAVBAR컴포넌트를 구현한다.
import { AppProps } from "next/app";
import NavBar from "../components/Navbar";
// 파일명은 고정이다. _app.tsx
// customized
export default function App({ Component, pageProps }: AppProps) {
return (
<>
<NavBar />
<Component {...pageProps} />
<span>Span text :: Hello as a footer</span>
<style jsx global>{`
span {
color: green;
}
`}</style>
</>
);
}