뒤죽박죽 공책 뒤죽박죽 공책

NextJs를 사용하기 전에는 이미지를 넣어야 한다면 태그를 사용하여 이미지를 넣고는 하였다. 하지만 Next 자체에서 컴포넌트가 존재하기 때문에 이를 사용하여 이미지를 넣을 수 있다. 그렇다면 어떨 때 컴포넌트를 사용하고, 왜 사용하는 것인지에 대해 공부한 내용을 작성해보고자 한다. 컴포넌트는 lazy-loading이 지원되며 기본적으로 width와 heigth를 작성해줘야 한다. 또한 alt값을 필수로 작성해야만 오류가 발생하지 않는다. 또한 해당 컴포넌트는 이미지를 최적화해서 보여주기 때문에 사용처에 따라 이미지의 크기를 원본과 다르게 보여준다. 위의 값을 설정하기 위해 지원하는 옵션을 적어보고자 한다. width, heigth // 300px X 300px 괄호 안에 들어간 값은 픽셀로 이미지가 ..