next.js

HTML 삽입 미리보기할 수 없는 소스 next.js에서 제공하는 이미지 최적화 컴포너트 HTML 삽입 미리보기할 수 없는 소스 HTML 삽입 미리보기할 수 없는 소스 import Image from "next/image" const Product = () => { return( ) } 1. Image 컴포넌트는 width, height 말고도 fill 이라는 속성으로 크기를 지정할 수 있다. fill은 포지셔닝이 된 부모요소를 기준으로 크기가 정해진다 2. src 속성은 public 폴더를 기준으로 상대 경로를 적는다 public 폴더 외부에 있는 이미지 파일을 사용할 때 1. next.config 파일의 nextConfig 객체에 Image 프로퍼티를 수정하거나 추가한다

Link" data-ke-type="html">HTML 삽입미리보기할 수 없는 소스next.js의 네비게이션 컴포넌트import Link from "next/Link";const Home = () => { return( go to Guitar Category go to Bass Category go to Drum Category )}export default Home;1. Link 컴포넌트의 href prop에 이동하려는 페이지의 상대 경로를 넣는다2. next에서 Link는 전체 페이지를 불러오는게 아닌, 필요한 부분만 불러오기 때문에 최적화에 용이하다3. 외부링크를 사용할 땐, 외부링크 전체를 herf의 값으로 넣는다 useRouter" data-ke-ty..