[GitHub] 깃허브에 gif 파일 업로드 (맥북)

 

 

 

 

프로필 README를 작성하면서 gif를 하나 올렸었는데

다시 쓰려니까 금방 잊어서 기록해두려고 한다.

 

리드미에 그냥 올리면 되는 줄 알았는데 아니라서 귀찮다.

그러니 기록하자.

 

 

 

repository에 있는 README파일을 적다 보면

gif 파일이 필요해지는 순간이 있다.

 

 

이미지만 올리기에는 밋밋한 느낌이 들고

프로젝트 기능 구현 모습이 움직이게 보였으면 좋겠다 싶은 순간

다른 사람들이 올린 기깔나게 움직이는 기능들을 본 순간

 

 

 

 

1. 맥북을 이용한 프로젝트 녹화

 

cmd + shift + 5 버튼을 동시에 누르면 전체 화면을 기록하거나 선택한 화면을 부분 기록할 수 있다.

 

부분적으로 선택한 화면을 기록하려고 버튼을 클릭한 상태이다.

기록을 클릭하면 스크린 녹화가 시작된다.

 

 

 

 

 

2. 맥북을 이용한 비디오 편집

짧게 짧게 필요 기능들을 녹화했다면 바로 gif로 변환해도 괜찮지만

기능들을 합쳐 길게 녹화했다면 편집을 해야 한다. (용량 제한)

 

나는 맥북에 있는 기본 편집 툴을 이용해 편집했다.

녹화된 화면을 클릭하면 우측에 위와 같이 나타난다.

다듬기를 클릭해서 원하는 부분만 잘라서 저장하면 된다.

 

 

 

3. gif변환

 

맥북은 동영상이 mov파일로 저장된다.

처음에는 윈도우 시절에 이용했던 사이트가 gif로 변환될까 우려했는데 변환이 잘됐다.

 

 

EZGIF

Online video to GIF converter

 

ezgif는 gif 변환뿐 아니라 비디오 편집 기능도 제공합니다.

메뉴에 보시면 리사이징부터 스피드 조절에 다른 파일형으로 변환까지 가능하지만

하. 지. 만!

gif 이미지 사이즈가 한정되어있습니다.

그래서 찾아낸 사이트가 바로

 

 

Convertio

MOV GIF 변환 (온라인 무료) — Convertio

조금 더 고화질의 gif를 얻어낼 수 있었습니다.

(괜찮은 gif변환 사이트를 아신다면 공익을 위한 공유를 부탁드립니다 🔥)

 

 

 

 

4. markdown 변환

 

github에 gif를 올리고 자하는 repository에 들어갑니다.

Issues를 클릭하시면 이미지 우측 하단에 나온 것과 같이 초록색 바탕에 버튼 New issue가 나타납니다.

버튼을 클릭합니다.

 

Leave a comment 자리에 gif 파일을 드래그해서 옮기면 다음과 같이 화면이 뜹니다.

잠시 기다린 후에 뜬 gif 이미지 주소를 리드미 파일에 추가하면 끝!

 

 

 

Vscode 리드미 파일 미리보기를 통해 본 화면입니다.

여기서는 움직이지 않지만 제가 보는 화면에서는 잘 움직여주고 있습니다.

 

 

지금까지 gif 파일을 깃허브 리드미 파일에 올리는 법을 알아보았습니다.

더 간단한 방법을 알고 계시거나 좋은 사이트가 있다면 알려주시면 감사하겠습니다🙏

 

 

구글링을 하면서 다른 분들이 올린 포스팅 글을 통해 많은 도움을 받습니다.

제 포스팅도 누군가의 도움이 됐길 바라며 안녕! 👋