GitHub 풀 리퀘스트에 스크린샷 및 애니메이션 추가하는 방법

특징 이미지 스크린샷 애니메이션 GitHub 풀 리퀘스트

GitHub 프로그래머들은 종종 리포지토리 풀 리퀘스트에 스크린샷이나 애니메이션 GIF를 추가합니다. 이러한 기법은 여러 줄의 일반 텍스트를 읽게 하는 것보다 확실히 더 눈에 띕니다. 정적 스크린샷을 추가하는 것은 시각적 변경 사항이나 사진을 인라인으로 삽입하고 싶을 때 유용합니다. 프로세스 흐름과 마우스 커서의 움직임을 보여주기 위해 MP4 비디오와 GIF 애니메이션을 사용할 수 있습니다. 다음 튜토리얼에서는 GitHub 풀 리퀘스트에 스크린샷과 MP4/GIF 애니메이션을 추가하는 방법을 보여줍니다.

목차

    1. 새 리포지토리 및 브랜치 추가
    1. GitHub용 스크린샷 만들기
    1. GitHub용 비디오 및 GIF 애니메이션 만들기
    1. GitHub 풀 리퀘스트에 스크린샷 또는 애니메이션 추가
    1. GitHub 페이지에 스크린샷 및 GIF 이미지 표시
  • 자주 묻는 질문

또한 읽어보세요: Git 초보자 가이드

1. 새 리포지토리 및 브랜치 추가

GitHub를 한 번도 사용해본 적이 없더라도 아래 단계를 따라 개발자로 시작할 수 있습니다. 현재 GitHub 계정을 만들기 위해서는 이메일만 필요합니다. 이는 GitHub를 시작하는 것을 이전보다 훨씬 쉽게 만듭니다.

  1. GitHub 프로필에 로그인한 후, 오른쪽 상단의 “+” 기호를 클릭하여 새 리포지토리를 만듭니다.

GitHub 애니메이션 추가 새 리포지토리 1

  1. 리포지토리에 원하는 이름을 지정하고 공개 또는 비공개로 설정합니다. “README와 함께 이 리포지토리 초기화” 옵션을 체크하는 것을 잊지 마세요.

GitHub 애니메이션 추가 리포지토리 이름 초기화

  1. Apache 2.0 라이센스, GNU 일반 공용 라이센스, MIT 라이센스, Eclipse, Mozilla 공용 라이센스 등으로 코드를 배포할 수 있습니다. 다른 사람들이 코드를 자유롭게 사용하지 않기를 원하면 “없음”을 선택하세요.
  2. “리포지토리 만들기”를 클릭하여 프로필의 메인 브랜치 아래에 리포지토리 추가를 확인합니다.

GitHub 애니메이션 추가 라이센스 선택 리포지토리 만들기

  1. 다음 단계에서 아래의 드롭다운 메뉴를 사용하여 리포지토리에 브랜치를 추가합니다. 여기서 “Guten-tag” 리포지토리에 “Guten-tag-1” 브랜치가 추가되었습니다. 이 리포지토리는 메인 리포지토리 “Hola-World”의 브랜치입니다.

GitHub 애니메이션 추가 스크린샷 새 브랜치 생성 과정

  1. GitHub에서 브랜치의 목적은 개발자가 마스터 프로덕션 브랜치와 분리하여 기능 및 버그 수정을 작업할 수 있도록 돕는 것입니다. 1, 2, 3 등의 일련 번호를 추가하는 것은 브랜치의 수준을 기억하기 쉽게 만드는 방법입니다.

GitHub 애니메이션 추가 스크린샷 브랜치 푸시됨

2. GitHub용 스크린샷 만들기

GitHub에 스크린샷을 추가하려면 좋은 화면 캡처 소프트웨어가 필요합니다. Windows 11에서는 Snipping Tool이 이 목적에 가장 적합한 Microsoft 앱입니다. 문제가 발생하면 문제 해결 가이드를 참조하세요.

GitHub 스크린샷 Snipping Tool Windows11 1

그러나 Windows 10은 Windows 11 Snipping Tool과 매우 유사하게 작동하지만 기능이 적은 “Snip & Sketch” 앱을 사용합니다. 화면 캡처 지연을 위해 3초 또는 10초의 타이머가 있습니다.

GitHub 스크린샷 Snip Sketch Windows10

또한 읽어보세요: Windows 11 Snipping Tool 작동하지 않음: 12가지 가능한 수정 방법

3. GitHub용 비디오 및 GIF 애니메이션 만들기

GitHub에 비디오나 GIF를 추가하려면 좋은 비디오 화면 캡처 도구가 필요합니다. 과거에는 GitHub에 MP4를 업로드할 수 없었지만 이제는 가능합니다.

Windows 11과 Windows 10 모두에서 Microsoft Store 앱인 Screen recorder & Screen record를 사용할 수 있습니다. Microsoft Store는 각 앱이 Windows와 잘 작동하도록 설계되었기 때문에 화면 녹화 소프트웨어를 다운로드하는 가장 안전한 소스입니다. Mac에서 무료로 화면을 녹화하는 방법을 배우려면 이 가이드를 참조하세요.

GitHub 애니메이션 추가 화면 녹화기 Microsoft Store

  1. 화면 녹화 앱을 실행하고 캡처 모드를 선택합니다: “전체”, “영역”, “카메라” 또는 “오디오만”. 화면 녹화를 시작할 준비가 되면 “시작”을 누릅니다.

GitHub 애니메이션 추가 화면 녹화 HD

  1. 이 소프트웨어의 좋은 점은 GIF 모드를 선택하여 직접 GIF를 만들 수 있다는 것입니다.

GitHub 애니메이션 추가 화면 녹화 HD GIF 선택

  1. 또는 Ezgif 또는 기타 온라인 도구를 사용하여 MP4를 GIF로 쉽게 변환할 수 있습니다. 먼저 업로드 링크를 사용하여 MP4 비디오를 추가하세요.

GitHub 애니메이션 추가 Ezgif 변환 목적

  1. GIF 파일 크기, 너비 및 길이에 대한 대략적인 추정치를 얻을 수 있습니다. GIF 파일의 프레임 속도를 변경하여 지침을 쉽게 따를 수 있도록 느리게 만들 수 있습니다.

GitHub 애니메이션 추가 Ezgif 변환 GIF 공식 변환

또한 읽어보세요: Mac에서 무료로 화면 녹화하는 방법

4. GitHub 풀 리퀘스트에 스크린샷 또는 애니메이션 추가

스크린샷이나 비디오를 만든 후, 이를 GitHub 풀 리퀘스트에 쉽게 추가할 수 있습니다.

  1. GitHub에 스크린샷이나 비디오/애니메이션을 추가하려면, 이전에 만든 브랜치로 돌아가서 “풀 리퀘스트”로 이동합니다. 또는 브랜치를 클릭하여 직접 접근할 수 있습니다.

GitHub 애니메이션 추가 스크린샷 브랜치로 이동 풀 리퀘스트 단계

  1. MP4 또는 GIF와 같은 새 파일을 추가하려면, 파일이 사용 가능해야 하는 브랜치에서 “파일 업로드”를 선택합니다.

GitHub 애니메이션 추가 스크린샷 파일 추가 생성

  1. 편집 모드에 들어가면 “파일 선택” 옵션에서 스크린샷 이미지와 MP4/GIF 파일을 첨부할 수 있습니다. GitHub 브랜치 리포지토리에서 처음으로 커밋하는 경우 “변경 사항 커밋”을 클릭하세요. 그렇지 않으면 “코멘트 업데이트”를 선택하세요.

GitHub 애니메이션 추가 스크린샷 업로드를 통한 파일 추가

  1. 스크린샷이나 애니메이션 파일이 리포지토리 브랜치에 추가될 때까지 몇 초 기다립니다.

GitHub 애니메이션 추가 스크린샷 MP4 업로드 중

  1. 생성된 스크린샷/비디오/애니메이션이 GitHub 브랜치에 성공적으로 추가되며, 결과적으로 리포지토리에 추가됩니다.

GitHub 애니메이션 추가 스크린샷 MP4 삽입 푸시됨

  1. GitHub은 다른 개발자와의 협업에 관한 것입니다. 그들이 제안한 변경 사항을 좋아하면, 이를 자신의 리포지토리에 병합할 수 있습니다. “병합 가능” 옵션이 보이면 자동으로 수행됩니다.

GitHub 애니메이션 추가 스크린샷 병합 가능 생성

  1. 병합을 완료하면 비디오/스크린샷이 마스터 리포지토리에서 “커밋”으로 표시됩니다.

GitHub 애니메이션 추가 스크린샷 병합 성공

또한 읽어보세요: Git 캐시 지우는 방법

5. GitHub 페이지에 스크린샷 및 GIF 이미지 표시

풀 리퀘스트 리포지토리 내에서 스크린샷 및 GIF 파일을 별도로 업로드하는 대신, GitHub 페이지에서 이를 표시할 수도 있습니다.

  1. 요령은 어떤 브랜치에서든 보이는 “ReadMe.md” 파일을 클릭하는 것입니다. 열리면 “소스 블롭 표시”라는 아이콘을 클릭합니다. 이 브랜치는 이미지, 스크린샷, GIF 등을 표시하도록 편집할 수 있습니다.

GitHub 애니메이션 추가 스크린샷 Readme

  1. “파일 편집” 아이콘을 클릭하면 스크린샷이나 애니메이션 GIF 코드를 추가할 수 있는 코딩 화면으로 이동합니다. !를 추가하고 alt 텍스트를 [ ]로 감싸고, 이미지 링크를 괄호 ()에 삽입하여 이미지를 쉽게 표시할 수 있습니다.

GitHub 애니메이션 추가 스크린샷 코딩

코딩을 원하지 않는 경우, 리포지토리 페이지에 스크린샷/GIF를 직접 추가하는 더 쉬운 방법이 있습니다.

  1. Readme.md 페이지에서 “파일 편집”을 클릭하면 브랜치 페이지에 표시할 스크린샷/GIF를 첨부할 수 있는 새 창으로 이동합니다.

GitHub 애니메이션 추가 스크린샷 파일 첨부

  1. GitHub 브랜치에 변경 사항을 커밋하기 전에 이미지, 스크린샷 또는 GIF를 쉽게 미리 볼 수 있습니다.

GitHub 애니메이션 추가 스크린샷 미리보기

또한 읽어보세요: Windows에 Git 및 Git Bash 설치하는 방법

자주 묻는 질문

GitHub에서 이미지나 스크린샷을 정렬하거나 크기를 조정하려면 어떻게 하나요?

GitHub 페이지에서 이미지나 스크린샷을 정렬하려면 ReadMe.md 파일에서 “이것 편집”을 클릭한 후 이미지를 업로드하고 다음 코드를 추가하세요:

이미지를 왼쪽 정렬, 오른쪽 정렬 또는 중앙 정렬로 설정하려면 코드를 수정하세요. 이미지를 크기 조정하려면 너비와 높이 치수를 수정하세요.

GitHub에서 GIF 및 비디오 파일의 크기 제한이 있나요?

네. 개별 GIF 또는 MP4 파일의 최대 파일 크기는 50MB입니다. “GitHub 블록”이라는 숨겨진 GitHub 기능을 사용하면 각 파일의 크기를 100MB로 늘릴 수 있습니다. GitHub 리포지토리(메인 브랜치)는 5GB 미만이어야 합니다.

더 큰 파일 크기로 이미지나 비디오를 업로드해야 하는 경우, GitHub Large File Storage (LFS)라는 프로그램을 사용하세요. 이는 무료/프로 사용자에게 파일당 최대 2GB의 제한이 있습니다.

GitHub에서 이미지를 공유하려면 어떻게 하나요?

GitHub는 현재 스크린샷이나 GIF와 같은 이미지를 채팅 및 관련 도구를 사용하여 직접 공유할 수 있는 기능이 없습니다. 그러나 GitHub 페이지에서 “이슈”를 생성하고 검토를 위해 제출할 수 있습니다. 이러한 이슈에는 이미지를 포함할 수 있습니다. GitHub에서 사람에게 알리려면 사용자 이름 앞에 @를 사용하세요.

이미지 출처: Unsplash의 Groot 및 Octocat 모든 스크린샷은 저자에 의해 촬영되었습니다.