글 작성자: juyoungit

Github Page

github에서 제공하는 정적 웹사이트 호스팅 서비스

 

Github page는 github에서 제공하는 정적 웹사이트 호스팅 서비스로서 자신의 repository에서 웹페이지를 구동할 수 있도록 해준다. 여기서 호스팅이 무엇인지, 정적 웹사이트는 무엇인지에 대한 내용은 해당 링크의 블로그를 참고하기 바란다. 해당 블로그 내에는 관련 용어뿐 아니라 github page에 대한 언급도 있으니 참고하면 많은 도움이 될 것이다.

 

https://opentutorials.org/course/3084/18891

 

웹호스팅 (github pages) - 생활코딩

--- 직접 웹서버를 운영하는 일은 쉽지 않은 일입니다. 우선 컴퓨터가 있어야 하고요, 컴퓨터가 냉장고처럼 항상 켜져 있어야 합니다. 웹서버라는 프로그램을 배워서 설치해야 합니다. 또 인터넷

opentutorials.org

그렇다면 자신만의 github page를 만들어보도록 하자. github page를 만들기 위해서는 github page를 위한 repository를 별도로 생성해 주어야 한다.

이때 repository의 명은 "자신의 계정명.github.io" 로 설정하는 것을 권장한다. 이유는 생성되는 주소의 형태가 깔끔하게 보이도록 하기 위해서인데 의무적인 것은 아니다. 이제 다음과 같이 이름을 설정하고 repository를 생성하면 다음같이 나타난다.

이후 해당 repository에 대한 Settings로 이동해서 찾아보면 다음과 같이 github page와 관련된 부분을 찾을 수 있다.

github page는 다양한 테마를 지원하는데 이 테마들을 이용하면 보다 빠르고 쉽게 page의 디자인을 구성할 수 있다. github page 관련 글 하단에 있는 "Choose a theme" 를 클릭하면 다음과 같이 사용할 수 있는 테마의 목록이 나타난다.

다음과 같이 테마를 클릭해보면 해당 테마스타일을 미리 볼 수 있고 자신이 원하는 적절한 테마를 선택할 수 있다. 화면 우측상단에 있는 choose theme 버튼을 누르면 해당 테마를 자신의 github page에 적용할 수 있다. choose theme 버튼을 누르면 다음과 같이 index.md 파일이 repository에 생성되는 데 해당 파일내에는 markdown 형식으로 기본적인 기본값 내용들이 작성되어 있다. 해당 파일을 수정해서 자신만의 github page에 원하는 내용을 기록할 수 있다.

일단 이 단계 까지만 가면 github page 생성이 완료된 것이다. 그렇다면 브라우져로 이동해서 page를 확인해보도록 하자. 이전에 설정했던 repository 이름대로 "유저명.github.io" 형식으로 주소를 입력하면 다음과 같이 웹페이지가 생성된 것을 확인할 수 있다.

이렇게 해서 github page가 생성되었다. 그렇다면 이제 해당 github page에 자신만의 글을 기록해서 업데이트 해보록 하자.

다음과 같이 index.md 파일을 수정해서 page에 기록하고자 하는 글을 기록하였다. 해당 파일을 저장 후 커밋을 진행하고 브라우져에서 이전에 생성한 github page 주소로 이동하면, 다음과 같이 테마가 적용된 상태에서 내용이 업데이트 된 모습을 확인할 수 있다.

그런데 아직 살펴보면 내용은 정상적으로 추가되었으나 page의 이름이나 프로필 같은 부분에 대한 설정이 부자연스러운 것을 확인할 수 있다. 이에 대한 설정은 해당 Page를 위한 repository 내에 존재하는 _config.yml 이라는 파일에서 설정가능하다. 이 파일의 설정에 대한 내용은 해당 블로그를 참고하기 바란다.

https://imreplay.com/blogging/config-yml/

 

_config.yml 설정하기

minimal-mistakes 테마에서의 _config.yml 설정에 대하여

imreplay.com

다음과 같이 _config.yml 파일에 Page의 제목을 설정하는 구문인 title: 을 추가하여서 다음과 같이 제목을 변경한 것을 확인할 수 있다. 이제 이런식으로 해당 github page의 소스를 작업하여서 자신이 원하는 형태로 서비스할 수 있도록 구성할 수 있다. 실제로 github page는 개인의 프로필을 띄우는 페이지로 활용하기도 하고 다소 까다롭기는 하지만 개인의 블로그로 작업하여 사용하기도 한다. 웹 개발에 대한 지식을 많이 축적하면 github page를 더 유용하게 활용할 수 있을 것이다.

'Tools > Git, Github' 카테고리의 다른 글

github을 이용한 협업상황에서의 질문  (0) 2021.01.21
git rebase  (0) 2021.01.20
git revert, reset  (0) 2021.01.19
Git 실습 시나리오 따라해보기(3)  (0) 2021.01.18
Git 실습 시나리오 따라해보기(2)  (0) 2021.01.18