2월 25, 2024

마크다운 문서 작성 시 로컬에 있는 이미지 쉽게 올리기

1. Github readme 혹은 마크다운 문서 시 이미지 쉽게 올리기

Github readme를 작성하거나 마크다운 문서를 작성할 때 이미지를 쉽게 올리는 방법을 알아보자. 
이미지를 올릴 때 여러 가지 방법이 있는데 가장 정석인 방법은 github에도 img라는 폴더를 만들고 그 아래 올릴 이미지를 모두 업로드 한 뒤 img/해당 이미지로 경로를 설정해주는 방법이다. 하지만 이 방법은 img를 업로드해야 하기 때문에 나는 잘 사용하지 않는다. 
 


2. Github Issues 활용하기


그래서 단순히 이미지를 붙여넣기만 해서도 업로드가 가능한, 조금 더 쉬운 방법을 알아보도록 하자. 
물론, github readme를 작성하고 있다면 바로 readme.md에 복사, 붙여넣기를 하면 이미지 경로가 뜨지만 우리는 로컬에서 markdown문서를 만들고 있고, 해당 마크다운 문서를 이후에 github에 업로드 했을 시에도 이미지가 잘 나오게 하기 위한 경우를 보고 있는 것이다. 
 
방법은 간단하다. 바로 github에 "Issues" 부분을 활용하는 것이다. 



1) Issues 접속

github repository를 생성해준 뒤, Issues 부분에 들어간다. 



2) New issue 클릭

이후 New issue를 클릭해주면, 


위와 같은 부분이 나오게 될 것이다. 

3. 붙여넣기 후 경로 파악

다음으로 올리고 싶은 이미지를 복사한 뒤, Leave a comment라고 되어 있는 부분에 붙여넣기를 해보자. 
 
나 같은 경우에는 캡쳐한 이미지 파일을 자주 올리는데 그럴 때 굉장히 편한 방법이다. 
붙여넣기를 하면,


위와 같이 image 경로가 자연스럽게 나오게 되는데, 그러면 
<img src="https://user-images.githubusercontent.com/71162530/124603983-704d0d00-dea5-11eb-9b1f-e4541f9e0822.png"  />
위와 같이 적어주면 되는 것이다.
 
위에 Submit new issue는 누르지 않는다!! 
 
형식은
<img src="위에 나온 url"/>
이런 식으로 적어주면 된다. 
 

이런 식으로 작성해주면 로컬에 있는 이미지, 캡쳐 이미지, 다운받은 이미지에 관계없이 모두 다 git에서 잘 보여지는 것을 확인할 수 있다. 
 
readme를 github repository에서 바로 작성하는 경우에는 issues를 활용하지 않고 바로 이미지 붙여넣기를 하면 경로가 자동으로 나온다!