깃허브 블로그(Jekyll minimal-mistakes)_기초 설치

설탕유령·2022년 4월 29일
0
post-thumbnail

[필요사항]

Ruby(설치 및 구성 관리용)
https://www.ruby-lang.org/ko/documentation/installation/
Github Repositories(호스팅 용)
https://github.com/
Git & Github Desktop과 같은 형상관리툴(버전관리 및 local->remote로 작업사항 반영 용)
https://git-scm.com/downloads (git)
https://desktop.github.com/ (github desktop)
Jekyll minimal-mistakes(사이트 구성 테마)
https://github.com/mmistakes/minimal-mistakes

[진행]

필수 사항 중
Ruby, Git, Github Desktop는 설치만 하면 되기 때문에 생략하고 진행

먼저 사이트가 적용 될 Github Repository를 구성

: Repository name에 [본인깃허브ID.github.io] 입력
: Create repository로 생성

Repository 생성 이후에 Local PC에서 폴더를 생성해 새로 생성된 Git Repository와 연결

: Repository 생성 이후 Git 구성에 대한 안내 페이지가 나오며, 첫번째 안내 사항에 명령어를 복사 버튼을 클릭해 복사
: Local PC에 사이트 저장용 폴더를 생성(본 예제에서는 생성한 레파지토리 ID를 따라서 만듬)
: 새로 생성한 폴더를 경로로 잡아서 Git bash를 실행, 경로가 잘 잡혔는지 확인하고, 에서 복사한 명령어를 붙여넣어 실행

생성한 Repository와 git이 잘 연결됬는지 확인 후
블로그 테마를 적용하기 위한 파일을 다운로드
https://github.com/mmistakes/minimal-mistakes
해당 경로에 상단 초록색 버튼 Code 클릭 후 Download ZIP으로 받기

ZIP 파일 압축 해제 시 위와 같은 파일 목록을 확인 할 수 있으며,
이중 파란색으로 선택된 파일만 새롭게 만든 블로그 폴더로 복사
(본 예제에 경우에는 D:\sugarghost.github.io)

파일 복사 이후 해당 위치로 터미널이나 CMD를 실행해 사이트 구성 시작

ruby -v
bundle install

: 현재 위치가 새롭게 생성한 블로그 폴더인지 확인 이후, ruby -v 명령어를 통해 루비의 버전을 확인(만약 에러가 난 경우 설치가 제대로 안된 경우이며, ruby를 새롭게 다시 설치 진행)
: 이상이 없는지 확인 했으면 bundle install을 통해 구성 시작

구성이 완료 됬으면 서버를 구동, 이때 ruby가 3.0 버전 이상인 경우 에러가 발생함
3.0 버전부터 webrick이라는 구성요소가 빠져서 새롭게 추가해야함

bundle exec jekyll serve
#에러 발생한 경우
bundle add webrick
bundle exec jekyll serve

: bundle exec jekyll serve 명령으로 서버를 구동
: webrick 오류가 발생
: bundle add webrick 명령어로 webrick 구성요소 추가
: 다시 서버를 구동
: 서버가 구동 완료 되면 127.0.0.1:4000으로 구동 됨

구동 된 주소를 따라서 블로그를 확인

블로그를 확인 했으면 콘솔창(CMD 또는 터미널)에서 Ctrl+C로 구동을 정지
Server에 반영하기 위해 Github Desktop으로 블로그 폴더 commit 후 push

(Github Desktop에서 상단 메뉴 File 클릭 후 Add local repository로 새로 만든 블로그 폴더를 선택, 이후 commit 후 push 진행)

블로그를 서버에 올리면
GithubID.github.io 경로로 접근해 확인이 가능(반영하는데 3~5분 정도 걸림)
잘못해서 Repository 이름을 잘못 설정한 경우 변경이 가능함
(생성한 Repository로 이동)

: 본인의 Github ID
: 현재 Repository가 ID랑 일치하지 않음
: 설정을 위해 Settings 클릭

: 본인의 Github ID
: ID에 맞춰서 앞부분을 수정(예제에 경우 sugarghost로 수정이 필요)
: Rename을 눌러 반영

모든 작업이 완료 되면 본인의 GithubID.github.io 주소로 들어가 블로그를 확인
(본 예제에 경우 https://sugarghost.github.io/)

완료

profile
달콤살벌

0개의 댓글