Notice
Recent Posts
Recent Comments
Link
«   2024/11   »
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
Tags
more
Archives
Today
Total
관리 메뉴

Nonamed Develog

[TIL][240919] Readme에 이미지 올리는 2가지 방법 본문

WHAT I LEARN/TIL

[TIL][240919] Readme에 이미지 올리는 2가지 방법

노네임드개발자 2024. 9. 19. 20:36

1. GitHub 리포지토리에 이미지를 업로드하여 사용

이 방법은 GitHub 리포지토리 내에 이미지를 포함하고, 이를 README 파일에 표시하는 방식이다.

절차:

  • 이미지 파일 저장: 먼저 로컬에서 리포지토리의 특정 폴더(예: images/)를 생성한 후, 여기에 이미지 파일을 저장한다. GitHub에 푸시하면 이 이미지 파일이 리포지토리에 포함된다.
  • Markdown 문법 사용: README 파일에서 해당 이미지 파일의 상대 경로를 이용해 이미지를 불러온다. 이때 Markdown 문법을 사용하여 이미지를 표시하는데, ![이미지 설명](이미지 경로) 형식을 사용한다.
  • 상대 경로의 중요성: 이미지 경로를 절대 경로로 지정하지 않고 상대 경로로 지정하면, 리포지토리 내 파일 구조와 일치하는 경로로 이미지를 불러온다. 예를 들어, README 파일과 이미지가 같은 디렉토리 안에 있으면 ./이미지파일이름.png와 같이 경로를 지정한다.

이 방법은 이미지가 프로젝트 내에서 유지되며, GitHub가 해당 이미지를 렌더링할 수 있게 해준다.

2. 온라인 호스팅 서비스를 이용한 이미지 삽입

이미지를 리포지토리에 포함하지 않고, 온라인 이미지 호스팅 서비스를 이용해 이미지를 업로드하고, 해당 이미지의 URL을 README 파일에 삽입하는 방법이다.

절차:

  • 이미지 업로드: Imgur 같은 이미지 호스팅 서비스나 GitHub Issues 기능을 사용해 이미지를 먼저 업로드합니다. 이미지가 업로드되면 고유한 URL이 생성된다.
  • Markdown 문법 사용: 이 URL을 README 파일에서 Markdown 문법을 사용하여 불러온다. 형식은 GitHub 리포지토리에 이미지를 저장하는 방식과 동일하지만, URL 대신 온라인에서 제공된 이미지의 링크를 사용한다.

이 방식은 리포지토리 용량을 줄일 수 있고, 이미지를 외부에서 쉽게 관리할 수 있지만, 호스팅 서비스에 의존하게 되므로 이미지가 삭제되거나 URL이 바뀔 경우 깨진 링크가 될 수 있다.

두 방식의 차이

  • GitHub에 직접 이미지를 저장하는 방법은 이미지가 리포지토리의 일부로 관리되며, 해당 리포지토리를 클론하거나 포크할 때 함께 제공된다.
  • 온라인 호스팅 서비스를 이용하는 방법은 이미지 파일을 리포지토리에 추가하지 않으므로 저장소 용량을 절약할 수 있지만, 외부 서비스에 의존하게 된다.

이 두 가지 방법을 고려하여 프로젝트의 요구 사항에 맞는 방식으로 이미지를 삽입할 수 있다.