📚 [NextJS] 따라해보기 3. 링크 만들기
Category: Nextjs | 📅 August 08, 2023
여기 있는 내용을 따라해 보면서 기록해 봄
페이지 링크 만들기
- 이동할 페이지를 하나 생성함
- 위치 : pages/posts/FirstPost.js
1. index.js 수정
// index.js 페이지 제일 위에 아래 내용 추가 //
import Link from 'next/link';
//<main> 에서 h1 구문을 찾아서 아래 내용 수정 또는 추가 //
<h1 className={styles.title}>
Learn to <Link href="/posts/FirstPost">this page!</Link>
</h1>
페이지가 실제로 이동하는지 테스트 해 본다.
반드시 npm run dev로 정상적으로 서버가 구동되어 있어야 함
2. FirstPost.js 수정
// FirstPost 내의 돌아갈 페이지 생성 index.js 와 비슷함 //
import Link from 'next/link';
export default function FirstPost() {
return (
<>
<h1>First Post </h1>
<h2>
<Link href="/">Back to home</Link>
</h2>
</>
);
}
테스트 고고~
💭 Reviews
여기까지는 어떤 언어든 다 쉽지.. ㅋ
