언어/Next.js
[Next.js] 배포방법
홍시_코딩기록
2024. 2. 17. 16:07
- 사전작업: 깃허브에 프로젝트 올리기
- packga.json script에 build, start 추가 → push
- 코드 보기
- "scripts": { "dev": "next dev", "build": "next build", "start": "next start" },
- vercel에 새프로젝트 추가 → 내 프로젝트 선택
- configure project 정의 그리고 deploy
- 프로젝트 이름 설정, 다른 거는 변경할 거 없음.
⚠️비디오가 늦게 로딩되는 이슈!
export default function Movie({title, id, poster_path}: IMovieProps) {
const router = useRouter();
const onClick = () => {
router.push(`/movies/${id}`);
};
return (
<div className={styles.movie}>
<img src={poster_path} alt={title} onClick={onClick}/>
<Link prefetch href={`/movies/${id}`}>{title}</Link>
</div>
)
}
- prefetch 추가하면 됨!