까뮈_b
까뮈의 개발 노트
까뮈_b
전체 방문자
오늘
어제
  • 분류 전체보기 (23)
    • JAVA (0)
    • Spring (4)
    • JPA (1)
    • JavaScript (1)
    • DB (0)
      • Mysql (0)
    • Tools (4)
      • IntelliJ (2)
      • WebStorm (1)
      • Flyway (1)
    • 에러노트 (2)
    • 생각노트 (1)
    • Git (4)
    • HTML&CSS (1)
    • Laravel (2)
    • AWS (3)
    • Server (0)

블로그 메뉴

  • 홈
  • 태그
  • 방명록

공지사항

인기 글

태그

  • netstat
  • 의존관계 주입
  • 502 Bad Gateway
  • webstorm keymap
  • ElasticBeanstalk 버그
  • 리버스 프록시 서버
  • DBEngineVersion
  • componentscan
  • 구조 분해 할당
  • Non-ASCII Characters
  • start.spring.io
  • ElasticBeanstalk
  • spring
  • Amzone Linux AMI 2
  • 111: Connection refused
  • 무중단배포
  • 컴포넌트 스캔
  • EC2 호스트네임 변경
  • AWS ElasticBeanstalk
  • AWS

최근 댓글

최근 글

티스토리

hELLO · Designed By 정상우.
까뮈_b

까뮈의 개발 노트

Windows 환경에서 Github pages와 jekyll 를 활용해 나만의 블로그 웹호스팅하기
Git

Windows 환경에서 Github pages와 jekyll 를 활용해 나만의 블로그 웹호스팅하기

2022. 6. 1. 19:49

개발 공부를 하면서, 그날 배운 내용이나 깨달은 점을 매번 블로그의 포스트로 남기면 좋겠지만,

시간적으로나 심리적으로 약간 부담스러울 때가 있다.

이럴 때 그냥 내 머릿속에 Input만 하고 넘어가자니, 쉽게 까먹을 것 같아서, OUTPUT을 하며 학습할 필요성을 느꼈다.

이에 가장 알맞은 방법이 TIL(Today I Learned) 작성이라는 결론에 도달했다.

 

여러가지를 고려해서 TIL을 작성할 목적으로 티스토리보다는 깃허브 블로그가 더 적합하다고 생각되어 GithubPages와 jekyll을 활용하여 나만의 블로그를 호스팅 하기로 결정했다.

 

그럼 Windows 환경에서 Github pages와 jekyll 를 활용해 나만의 블로그를 호스팅하는 방법을 알아보자.

 

순서는 이렇다.

1.github pages 생성

2. ruby 설치

3.jekyll 설치

4.jekyll 테마 적용

 

 

1.github pages 생성

github에 로그인하여 새 레포지토리를 생성한다.

github pages 생성

레포지토리 이름을 {내 깃허브 닉네임.github.io} 로 설정해서 생성하면 성공적으로 github pages가 생성된 것이다.

 

2. Ruby 설치

https://rubyinstaller.org/downloads/

 

위의 사이트에 들어가서, ruby installer를 받아준다. 

무슨 버전을 받을 지 모르겠다면, 사이트 우측에서 추천해주는 버전을 받으면 된다.

설치가 완료되면, ruby commd를 실행한다.

ruby command prompt 실행

ruby --version을 쳐서 아래와 같이 버전 정보가 나오면 루비가 정상적으로 설치되었다는 뜻이다.

 

루비 설치 확인

jekyll은 Markdown 형식의 파일을 HTML 파일로 변환해주는 역할을 하는 정적 웹사이트 생성기이다.

 

우리는 jekyll을 사용하기 위해 ruby를 설치한 것이다. ruby가 설치되었으니 이제 jekyll와 bundler를 설치하면 된다. 

루비 프롬프트 창에서 아래 명령어를 입력해준다. 

gem install jekyll bundler

설치완료 후 아래 명령어로 jekyll 설치확인 역시 해준다.

jekyll -v

 

이제 jekyll까지 설치를 마쳤다. jekyll 테마를 적용해보자.

 

http://jekyllthemes.org/

 

Jekyll Themes

 

jekyllthemes.org

 

여기서 맘에 드는 테마를 선택한 뒤, 해당 테마의 깃헙 레포지토리에서 파일들을 받아, 내 로컬 레포지토리로 옮기고, commit하고 원격저장소에 push해준다. 

나는 https://github.com/mmistakes/minimal-mistakes  테마를 골랐다.

 

https://github닉네임.github.io/ 주소로 접속했을 때 초기 페이지가 뜬다면 호스팅 성공!

 

이제 테마와, 기본 정보 등을 수정해야 하는데, 매번 원격저장소에 push하고 호스팅된 상태에서 확인하기엔 너무 번거롭다.

 

그래서 로컬에서 서버를 띄워서 확인해보자.

 

로컬 저장소 경로에서 아래 명령어로 서버를 띄워보자.

bundle exec jekyll serve

 

나는 아래와 같은 오류메세지가 떴다.

 

webrick을 찾을 수 없어서 나는 오류이다.

bundle add webrick

위의 명령어로 webrick을 추가시켜 주면 정상 작동한다.

 

이제 로컬서버에서 확인해가며 _config.yml 파일을 수정해서 기본정보를 수정하고, 글을 작성하면 된다!

 

아래 가이드를 참고해서 하나씩 배워가면서 꾸밀 수 있다!

https://mmistakes.github.io/minimal-mistakes/docs/quick-start-guide/

 

Quick-Start Guide

How to quickly install and setup Minimal Mistakes for use with GitHub Pages.

mmistakes.github.io

 

확실히 티스토리보다는 초기세팅이 많이 번거롭지만, api 적용하듯이 가이드 보고 하나씩 따라하다보면 블로그를 가꾸는 재미도 있을 것 같다.

'Git' 카테고리의 다른 글

[git] 원격저장소 업데이트 명령어 3가지의 차이점 비교 -git remote update , git fetch , git pull 의 차이.  (2) 2022.01.08
[git] 새로 만든 원격 브랜치로 checkout이 안될 때. - error: pathspec did not match any file(s) known to git 해결법  (1) 2022.01.08
Detached Head  (6) 2021.11.16
    'Git' 카테고리의 다른 글
    • [git] 원격저장소 업데이트 명령어 3가지의 차이점 비교 -git remote update , git fetch , git pull 의 차이.
    • [git] 새로 만든 원격 브랜치로 checkout이 안될 때. - error: pathspec did not match any file(s) known to git 해결법
    • Detached Head
    까뮈_b
    까뮈_b
    까먹지 않기 위해서 개발 관련 시행착오를 정리한 포스트를 작성합니다.

    티스토리툴바