결론부터 이야기 하면...
특별한 이유가 없는 경우 app/assets/images 디렉토리에 이미지를 설치하는 것이 좋습니다.(일본의 한 블로그에 추천)
public 디렉토리
app/assets/images 디렉토리
어떤 디렉토리에 저장하면 좋은지 각각 디렉토리의 장단점을 알아보자
디렉토리에 배치한 후 이미지를 읽어들이는 경우 패스를 /부터 시작할 필요가 있다.
<%= image_tag('/test_image.png') %>
생성된 img tag
<img src="/test_image.png" alt="Test Image" />
<%= image_tag('test_image.png') %>
생성된 ima tag
<img src="/assets/test_image-aadfadfasdfcvas32432asdfvaasdvsdsadv~.png" alt="Test Image" />
app/assets/images디렉토리에 배치된 이미지를 읽어들이는 경우 패스를 /시작할 필요가 없다
패스를 /에서 시작했는지 안했는지에 따라서 src값이 크게 다른점이 보인다.
app/assets/images 디렉토리에 화면을 배치한 경우 src값의 화상(이미지)파일 패스에 MD5 해쉬값이 삽입되어져있는 것을 알 수 있다.
public 디렉토리에 설치한 이미지는, 이하의 CSS를 사용할 수 있다.
background : url ('이미지 패스(path)')
background: image-url('이미지 패스(path)')
background-image : url('이미지 패스(path)')
background-image : image-url('이미지 패스(path)')
app/assets/images 디렉토리에 설치된 이미지는 sass-rails의image-url Helper를 사용하지 않으면 배경에 이미지를 적용할 수 없습니다.
background : image-url ('이미지 패스(path)')
background-image : image-url ('이미지 패스(path)')
image-url('이미지 패스')는 url(/assets/이미지 패스')로 변환되며, image-path('이미지 패스')는 '/assets/이미지 패스'로 변환된다.
만약, 같은 어플리케이션내(웹 개발)에서 JavaScript 를 이용하고 있어, JavaScript 내에서 이미지를 취급한다면, app/assets/images 디렉토리의 이미지의 URL 이 바뀌어 버리므로 취급하기 어렵다고 한다.
이런 경우는 public 디렉토리에 두는 것이 좋을 수 도 있다.
app/assets 디렉토리에 이미지를 배치하였을 경우, assets의 파이프라인의 대상이 되어 다양한 혜택을 받을 수 있다는 것입니다.
특별한 이유가 없는 경우 app/assets/images 디렉토리에 이미지를 설치하는 것이 좋습니다.(일본의 한 블로그에 추천)