윤제니

React - 이미지 저장소 public/assets 본문

React

React - 이미지 저장소 public/assets

꿈다루 2024. 1. 16. 16:02

public/폴더

  • 이미지를 public/ 폴더에 저장하고 index.html 또는 index.css 파일 내에서 직접 참조 가능
  • public/에 저장된 이미지가 프로젝트 개발 서버 및 프로세스에 의해 공개적으로 제공되기 때문.
  • 브라우저 내에서 직접 방문이 가능하고, 다른 파일에 의해 요청될 수도있음.

 

 

src/assets/폴더

  • 이미지를 src/assets/폴더(또는 src 폴더의 어디든)에 저장 가능
  • src 또는 src/assets/과 같은 하위 폴더에 저장된 모든 파일은 공개적으로 제공되지 않음.
  • 웹사이트 방문자가 접근할 수 없음.
  • src 또는 src/assets 같은 하위 폴더에 저장된 파일은 코드 파일에서 사용할 수 있음. 
  • 코드 파일에 가져온 이미지는 빌드 프로세스에 의해 인식되어 최적화 되며, 웹사이트에 제공하기 직전에 public/폴더에 "삽입"됨.

 

 

어떤 폴더를 사용해야 하나?

  • public :  빌드 프로세스에 의해 처리되지 않는 이미지 사용
  • src 또는 src/assets : 컴포넌트 내에서 사용되는 이미지는 일반적으로 src/폴더에 저장되어야 함

'React' 카테고리의 다른 글

React - LifeCycle, useEffect, useMemo, useCallback  (0) 2024.02.01
React - useState Update  (0) 2024.01.29
React - Component, Props  (0) 2024.01.23
React - 특징, JSX  (0) 2024.01.23
React - MAC Homebrew Git 설치 및 VSCode 연동  (0) 2024.01.16