[Github] 깃허브 블로그 생성기 -1편

티스토리가 아닌 깃허브 블로그로 주소를 옮기고 싶어 져 잠정 중단되었던 깃허브 블로그 만들기를 시작하게 되었다. 과정이 일반 블로그들과는 달리 설치하는 것들과 설정하는 것들이 많아 한 번의 시도 끝에 포기했던 경험이 있다. 이번에는 절대 포기하지 않으리라는 마음을 가지고 차근차근 나아가기 시작했다. 전적으로 구글링을 통해 다른 분들이 하셨던 방법을 따라갔다.

주로 참고한 블로그는 다음과 같다.
1. https://zeddios.tistory.com/1222
2. https://seong6496.tistory.com/258?category=1009671

windows 기반으로 생성한 것에 주목하길 바란다.

---

1. clone하기

필자는 기존에 깃허브에 깃허브 블로그 저장소(이름.github.io)를 생성해 두었다.
이 저장소를 clone하여 로컬 저장소로 불러오게 되었다.

2. ruby 설치하기

jekyll을 사용하여 블로그를 생성하기 위해서는 ruby설치가 필수적이다. 설치를 하지 않고 jekyll을 설치하려다 에러와 마주치고 말았다.
Jekyll이 31bit이기에, ruby를 다운로드할 때 devkit이 있는 x86 버전으로 선택하였다.
🔎 참고한 주소: https://seong6496.tistory.com/256

3. jekyll 설치하기

(1) cmd창에서 실행하기

gem install jekyll bundler

(2) clone을 진행한 로컬 저장소에서 실행하기

jekyll new ./

이때, 저장소가 empty하지 않다는 에러가 발생했다. 1과 2사이에 생성했던 index.html과 기존에 존재하던 readme.md를 삭제하여 에러를 해결했다.

4. 로컬 저장소에서 블로그 뜨는지 확인하기

bundle install

bundle exec jekyll serve

server address: http://127.0.0.1:4000/가 뜨는 것을 확인할 수 있다. 이때, 주소인 http://127.0.0.1:4000/을 브라우저 창에 입력하면 Welcome To Jekyll이라는 화면이 뜨는 것을 확인할 수 있다.

5. 원격 저장소인 깃허브로 push하기

4에서 확인한 Welcome To Jekyll이 뜬 화면을 내가 생성한 깃허브 블로그 주소를 검색했을 때도 뜨도록 할 것이다.
깃허브 블로그가 존재하는 로컬 저장소 위치에서 Git Bash를 열어서 다음과 같은 명령어를 입력한다.

git add *

git commit -m "Add Jekyll"

git push

최종적으로 push가 완료되었다. 자신의 깃허브 블로그 주소를 열었을 때에도 Welcome To Jekyll이 뜨는 것을 확인할 수 있다.

6. 테마 정하기

기본적으로 뜨는 테마가 아닌 디자인적 요소가 추가된 다른 테마를 적용하고 싶은 욕심이 생기게 된다. 필자 역시 바로 테마를 적용하고자 했다. 테마의 종류와 그것을 추천하는 사이트 역시 다양하다. 오랜 시간 서칭한 결과, 자료와 인기 모두 많은 minimal-mistakes를 설치하기로 결정했다.

이 테마를 적용하는 방법은 다양하다. fork를 하는 것, zip을 다운로드하는 것 등등이 있다. fork를 하기에는 이미 생성된 블로그가 존재하기에 zip을 다운로드하는 방법을 선택했다.

🔎 minimal-mistakes 주소: https://github.com/mmistakes/minimal-mistakes
위의 주소로 이동하여 code>download zip을 선택한다.
압축을 해제하여 안에 있는 내용 전체를 로컬 저장소에 붙여 넣는다. 이 방식대로 진행하면 현재 로컬 저장소에 minimal-mistakes 테마를 적용하게 된 것이다.

7. 테마가 적용된 화면 보기

4에서 한 것처럼 테마가 잘 적용되었는지 로컬에서 확인하고자 다음과 같은 명령어를 입력했다.

bundle install

하지만, 다음과 같은 에러가 발생했다.

구글링을 오랜 시간에 걸쳐 진행하여 여러 방법을 동원했지만 다시 원점으로 돌아오게 되었다.
즉, 로컬 저장소에서 잘 적용이 된 것인지 확인을 할 수 없었다는 말이다. 🤔

문제의 원인은 Git이 제대로 설치가 되어있지 않았던 것이다 😑
해결 완료한 과정이 담긴 주소
동일한 에러를 만났다면 위의 주소로 이동하여 해결해 보기를 추천한다!

다행히도 minimal-mistakes가 잘 적용이 된 것을 확인할 수 있었다.

---

블로그에 테마가 잘 적용이 된 것을 확인할 수 있어 마무리를 하였다.

❤️‍🔥 1차 완성된 깃허브 블로그 주소: https://minjeongss.github.io/

대략 하루 동안 Jekyll을 이용한 깃허브 블로그 생성을 진행했다. 수많은 에러를 마주쳤고 ruby와 jekyll에 어색한 본인은 구글링의 힘을 빌려 해결해나갔다. 예상외로 정확한 해결법을 찾기가 어려워 애를 먹었다. 특히 7번에서 해결하지 못한 에러는 해결하기 위해 minimal-mistakes의 원격 저장소에서 모든 Issue를 찾아보려고 시도까지 했다..😑

깃허브 블로그 생성기 2편은 적용시킨 테마를 나의 블로그에 맞게 정보를 변경시키고 글을 작성하는 것에 대해 본격적으로 작성할 예정이다. 얼마나 많은 에러와 마주칠지 벌써 걱정이 앞서지만, 마음을 먹은 만큼 이번 기회에 깃허브 블로그를 정복할 예정이다. 아자 아잣 🔥🔥🔥