Rails 이미지(img) 관리

 

2021.02.01에 작성하였습니다.

결론부터 이야기 하면...

특별한 이유가 없는 경우 app/assets/images 디렉토리에 이미지를 설치하는 것이 좋습니다.(일본의 한 블로그에 추천)

 

※ Rails에서 image를 어떤 디렉토리에서 관리해야할까 ??

1. public 디렉토리

2. app/assets/images 디렉토리

 

어떤 디렉토리에 저장하면 좋은지 각각 디렉토리의 장단점을 알아보자

 

public 디렉토리에 배치한 후 이미지를 읽어들이는 경우 패스를 /부터 시작할 필요가 있다.

<%= image_tag('/test_image.png') %>
생성된 img tag
<img src="/test_image.png" alt="Test Image" />

app/assets/images디렉토리에 배치된 이미지를 읽어들이는 경우 패스를 /시작할 필요가 없다

<%= image_tag('test_image.png') %>
생성된 ima tag
<img src="/assets/test_image-aadfadfasdfcvas32432asdfvaasdvsdsadv~.png" alt="Test Image" />

패스를 /에서 시작했는지 안했는지에 따라서 src값이 크게 다른점이 보인다.

 

app/assets/images 디렉토리에 화면을 배치한 경우 src값의 화상(이미지)파일 패스에 MD5 해쉬값이 삽입되어져있는 것을 알 수 있다.

 

CSS서 사용할 수 있는 프로퍼티(속성)이 다르다

 

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/이미지 패스'로 변환된다.

 

 

public 디렉토리에 두는 경우

 

만약, 같은 어플리케이션내(웹 개발)에서 JavaScript 를 이용하고 있어, JavaScript 내에서 이미지를 취급한다면, app/assets/images 디렉토리의 이미지의 URL 이 바뀌어 버리므로 취급하기 어렵다고 한다.

이런 경우는 public 디렉토리에 두는 것이 좋을 수 도 있다.

 

 

정리

app/assets 디렉토리에 이미지를 배치하였을 경우, assets의 파이프라인의 대상이 되어 다양한 혜택을 받을 수 있다는 것입니다.

특별한 이유가 없는 경우 app/assets/images 디렉토리에 이미지를 설치하는 것이 좋습니다.(일본의 한 블로그에 추천)