정적인 자원 사용하기 - public

이미지, robots.txt, favicon.ico와 같은 파일을 static asset라고 합니다. 이런 자원을 로딩하는 방법을 알아봅니다. 

소스코드

https://github.com/egoing/nextapp/commit/33d945cb882e2c164666e6ad967ce7edc8876acc

라이브 예제

https://nextapp-1hvcu2cwk-egoing.vercel.app/

절차

1. public 폴더에 이미지를 삽입합니다. 예제에서는 hello.png 입니다. 

2. app/page.js에서 /hello.png를 이용해서 사용합니다. 

export default function Home() {
  return (
    <>
    <h2>Welcome</h2>
    Hello, WEB
    <p><img src="/hello.png" width="80" alt="" /></p>
    </>
  )
}