본문 바로가기
Github Blog

Git hub 블로그(2) 개발 환경 설정하기(Ruby, jekyll bundle 설치하기)

by GeekCode 2021. 9. 10.
반응형

 

 

지난 시간 깃허브 블로그를 생성하고 테마를 다운로드, 적용하는 것까지 해봤다.

 

깃허브는 일반 블로그처럼 에디터페이지에 들어가 자체적으로 수정이 가능 한게 아니라

터미널이나 vscode 같은 에디터로 수정이 가능하다.

 

오늘은 기본설정 변경까지 할 예정이다. 먼저 jekyll bundler라는 툴을 사용해야한다.

 

1. 변동사항을 git에 업로드

2. 웹으로 확인하는 것을 반복 

 

원래는 이과정을 반복해가면서 노가다를 하면서 구축을 하겠지만 중간중간 모니터링할수 있다면?? 

그렇다 내가 경험해본 HTML과 CSS는 만들면서 계속해서 수정하는 것을 확인해가면서 할수 있단 말이다.

그렇기 때문에 이 쓸데없는 과정은 빠르게 모니터링할수 있는 시스템으로 만들어야한다. 이때 너무 좋은 툴이 있는데 그 친구가 바로 jekyll bundler이다!

루비의 bundle exec jekyll serve을 이용하면 실시간으로 우리 블로그의 변동 사항을 아래와 같이 localhost:4000을 통해서 확인할 수 있다.설치하는 것은 조금 귀찮지만훗날 편한 블로그 관리를 위해 지체없이 진행해보자. 라는 글을 보고 참고하며 블로그를 만들었는데

나는 루비때문에 한 고생했다.

 

Ruby 설치하기

루비가 이미 설치되어 있다면 이 과정은 스킵해도 된다.

루비 다운로드 링크

  • 위에 있는 루비 다운로드 링크로 이동한다.
  • window는 zip 파일을 mac은 tgz 파일을 받는다.
  • 압축을 푼다.
  • cmd 혹은 command창을 열어 해당 directory 이동한다.
  • ruby setup.rb을 실행하여 다운로드한다.(이 과정은 관리자 모드로 실행해야할 것이다!)
cd [압축푼 파일이 저장된 위치]
sudo ruby setup.rb
ruby --version

만일 현재 루비 버전이 나온다면 성공적으로 설치를 마친 것이다.

 

그런데 나는 다른 메세지가 나왔다. 이미 루비가 설치되어있다고 말이다. 

구글링해보니 맥북은 기본적으로 루비가 설치되어있다고 하더라.  그래서 올~ 개이득 하면서 다음 설치과정으로 갔다.

하지만!!!!!! 이부분 체크!! 여기서 정확히 짚어가야했다. 루비에 대해 잘 이해를 못했기에 그냥 지나갔다.

 

루비는 젬파일이라는 것을 이용해서 인피니티스톤처럼 젬파일을 각각 설치해야하는 것이었는데, 

각각 필요한 버전이 있으니 꼭 그걸 충족시켜줘야한다. 나같은 경우도 기본으로 설치되어있는 것은 택도 없어서 업데이트를 해줬다.

 

jekyll bundler 설치하기

다음 명령어를 이용해서 jekyll bundler을 설치한다.

gem install jekyll bundler

 

bundler의 설치도 무사히 끝났다면 이제 localhost에서 내 블로그를 확인해보자.

cd [블로그 레파지토리]
bundle exec jekyll serve

루비가 제대로 설치가 안됐으면 이 과정에서 버전 맞추라는 메세지가 나온다. 말해주는 버전을 찾아서 설치하면 되니까 당황하지 말자.

난 일단 이런 에러 하나 나올때마다 개복치처럼 당황해버렸지.. 블로그를 쓰고 있는 이유다. 복기하는 중

 

조금 기다린 후에 다음과 같은 메세지가 뜬다면 성공적으로 localhost:4000에 내 블로그가 올라갔다는 것이다.

Server running... press ctrl-c to stop.

 

이제 웹페이지를 열고 localhost:4000을 입력하면 내 블로그가 뜨는 것을 볼 수 있다

그런데 이과정에서 떠야하는데 뜨지 않았다.ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ웃음만.... 

암튼 이렇게 해결하지못하고 일과를 다 마치고 밤에 아내와 이야기하면서 다시 터미널로 _

https://h1guitar.tistory.com/14

내 url 맨뒤에 / 슬래시가 있어서 안되는 거였다. 다들 조심.ㅠㅠㅠ

 

이것만 수정하니 제대로 적용!!!!! 이제 실시간으로 확인할 수 있는 시스템 구축완료

 

다음 포스팅에는 이제 실질적인 컨텐츠 수정하는 내용을 작성해보려고 한다.

나도 공부하면서 복습하는 거라 작성하면서 더 잘 이해되는 것이 느껴진다. 다들 이래서 TIL.. TIL 하는 구나

 

반응형