2021 시선 - 겨울 방학 스터디

6. user.github.io (github 페이지 만들기)

green333 2021. 1. 29. 20:53
728x90
SMALL

-user.github.io : Github이 제공하는 개인 블로그 플랫폼.

이 블로그는 Github repository에 있는 index.html 파일과 각각의 *.html 파일들이 랜더링 된것이다.

 

 

Github에 계정만 있다면 자신의 아이디로 user.github.io 라는 이름을 가진 레포지토리를 생성하고,

그곳에 Index.html 파일, 그리고 메모하거나 게시하고 싶은 정보를 .html 파일로 만들어 레포지토리를 commit하고

Github에 push하면 자동으로 user.gihub.io에 게시됨

 

 

이번 글에서는 MkDocs를 이용해서 개인 github.io 블로그를 만들 예정!

 

 


 

-MkDocs

MkDocs는 글쓰기 도구

글쓰기 도구에는 sphinx, read docs 등 다양한 도구들이 있음

MkDocs는 간편하고, 마크다운 방식으로 글쓰기를 하며, 

serve라는 명령어를 통해서 실시간으로 글쓰는 모습을 확인할 수 있음

 

 


 

-Python 설치

 

 

MkDocs는 Python이 설치되어 있어야하며 Python 패키지 관리자인 pip가 있어야함

설치가 안되어 있다면 설치한 후 진행!

 

2.x 버전은 기본 프로그램인듯!

3.x 버전을 설치해야함

 

 

 

맥북에 파이썬 설치하는 법과 실행하는 법은 아래의 블로그를 참고했음!

blockdmask.tistory.com/341

 

[python] 맥북에 파이썬 설치하기, 실행하기 (파이썬 3.x)

안녕하세요. BlockDMask 입니다. 오늘은 맥북에 python 3.x 버전을 설치하고 실행하는 두가지 방법을 살펴 보겠습니다. 파이썬을 설치 하셨다면 파이썬 IDLE 사용방법에 대해서 알아볼까요? [바로가기]

blockdmask.tistory.com

 

 

 

1. 터미널에서 파이썬 실행하기

 $ python3 입력하면 파이썬이 실행됨

 

 

 

2. 파이썬에서 제공해주는 IDLE 응용프로그램

 

 

 

 

 

python 설치 후, $ pip --version 도 확인!

 

 

 

 


 

 

-MkDocs 설치 

 

아래 명령어로 mkdocs 설치

 

 

 

 

작업폴더 생성

new 키워드를 이용하여 작업할 디렉토리를 생성

 

mkdocs-tuts 안에는 mkdocs.yml과 docs/index.md가 생성됨

 

 

 

실시간 확인하기

작업 디렉토리로 이동 -> serve키워드를 이용해서 실시간 작업을 확인

 

serve 키워드를 이용해서 실시간 작업을 확인

 http://127.0.0.1:8000 혹은 localhost : 8000 에서 확인 가능!

 

정지할때는 ctrl + c

 

 


 

실습해보기!

 

-서버 열기

 

 

-http://localhost:8000/ 열린 서버 확인 ! 

 

 

-자동 생성된 docs 폴더 안에 index.md file 확인해보기

 

 

 

-페이지 추가해보기 : 해당 폴더에 md ; markdown  파일 추가해주면 됨

나는 green.md라는 파일을 추가했음!

 

 

 

 

-마크다운 언어로 작성해주면 됨!

: 이미지 올릴때는 깃허브 -> 레포지토리 -> 이슈 -> new issues 에 이미지 드래그하면 이미지 url을 만들어줌

 

 

 

최종코드

 

 

-localhost:8000으로 확인해보기

 

UI까지 적용한 모습

 

 

위의 내용과 UI 적용은 아래의 블로그를 참고했음!

m.blog.naver.com/doksg/221986849004

 

mkdocs (기술 문서 정리하기 좋은 tool)

오늘은!!!!!mkdocs 입니다!​​mkdocs를 사용하면 개발중인 프로젝트에 대한 정보를markdown으로 정리하고...

blog.naver.com

 


 

-배포하기

mkdocs로 제작된 문서들은 [github.com][https://github.com/] 저장소에 올리면 ~.io 라는 도메인으로 호스팅됨

 

 

먼저 배포를 하기 전 마지막으로 mkdocs build를 해서 최종파일을 만든다!

$ mkdocs build

 

 

배포를 하기위한 명령어!

$ mkdocs gh-deploy

 

 

그리고 모든 파일들을 저장소에 올리면 됨

$ git add .

$ git commit -m "mkdocs upload"

$ git push

 

 

 

내 터미널에서! 

 

 

 

그러면, 다음과 같은 주소로 접속할 수 있다.

 

htttps://아이디.github.io/저장소이름

 

예 : https://userid.github.io/mkdocs-tuts

 

 

 

내 블로그 주소! 

daheehan333.github.io/site/

 

My Docs

Welcome to MkDocs For full documentation visit mkdocs.org. Commands mkdocs new [dir-name] - Create a new project. mkdocs serve - Start the live-reloading docs server. mkdocs build - Build the documentation site. mkdocs -h - Print help message and exit. Pro

daheehan333.github.io

 

 

 

-url로 들어가서 확인해보기

 

 

 

 

 

참조한 블로그

demun.github.io/mkdocs-tuts/guide/publish/

 

배포 - MKDocs 튜토리얼

배포 mkdocs 로 제작된 문서들은 [github.com][https://github.com/] 저장소에 올리면 ~.io 라는 도메인으로 호스팅됩니다. 먼저 배포를 하기전 마지막으로 mkdocs build 를 해서 최종파일을 만들어놉니다. 배포

demun.github.io

 

 

LIST

'2021 시선 - 겨울 방학 스터디' 카테고리의 다른 글

5. Pull Request  (0) 2021.01.29
4. 마크다운  (0) 2021.01.26
3. 1월 22일 스터디 과제  (0) 2021.01.23
2. Git  (0) 2021.01.22
1. Git  (0) 2021.01.20