MkDocs 사용법
1. MkDocs 개요: 현대적 기술 문서의 정석
MkDocs는 프로젝트 문서를 구축하기 위해 설계된 빠르고 단순하며 아름다운 정적 사이트 생성기(Static Site Generator)이다.1 이는 단순한 문서 작성 도구를 넘어, 현대 소프트웨어 개발의 핵심 철학인 ’Docs as Code’를 구현하는 강력한 도구이다. 문서화 작업을 개발 워크플로에 자연스럽게 통합함으로써, 문서를 코드처럼 버전 관리하고, 동료 검토를 거치며, 지속적 통합 및 배포(CI/CD) 파이프라인을 통해 자동으로 세상에 공개할 수 있게 한다.
1.1 MkDocs의 정의: 빠르고 단순한 정적 사이트 생성기
MkDocs의 핵심은 Python으로 작성된 정적 사이트 생성 엔진이라는 점이다.1 사용자는 개발자에게 매우 친숙한 두 가지 요소, 즉 마크다운(Markdown) 파일과 단일 YAML 설정 파일(mkdocs.yml)만을 사용하여 전체 문서 웹사이트를 구성한다.3 MkDocs 엔진은 이 입력물들을 받아 순수한 정적 HTML, CSS, JavaScript 파일들로 변환한다.4
이 결과물은 데이터베이스나 복잡한 서버사이드 스크립팅 없이 어떠한 웹 서버 환경에서도 호스팅될 수 있다.3 이는 GitHub Pages, Netlify, AWS S3 등 다양한 플랫폼에 손쉽게 배포할 수 있음을 의미하며, 사이트의 로딩 속도를 극대화하고 유지보수 비용을 최소화하는 결정적인 장점을 제공한다.
1.2 핵심 철학: 마크다운(Markdown) 중심의 개발자 친화적 문서화
Sphinx나 Read the Docs와 같은 다른 강력한 문서화 도구들과 비교했을 때, MkDocs가 추구하는 핵심 가치는 ’단순함’과 ’개발자 친화성’에 있다.5 개발자는 이미 이메일, README 파일, 이슈 트래커 등에서 일상적으로 사용하는 마크다운 문법을 그대로 사용하여 전문적인 수준의 문서를 작성할 수 있다.3 복잡한 reStructuredText와 같은 별도의 마크업 언어를 학습할 필요가 없다는 점은 문서 작성의 진입 장벽을 획기적으로 낮춘다.
이러한 개발자 친화적 철학의 정점은 mkdocs serve 명령어를 통해 제공되는 실시간 미리보기 기능이다.5 저자가 마크다운 파일을 수정하고 저장하는 순간, 내장된 개발 서버가 변경사항을 즉시 감지하여 웹사이트를 자동으로 다시 빌드하고 브라우저를 새로고침한다.3 이러한 즉각적인 시각적 피드백은 ’빌드-확인’이라는 번거로운 단계를 제거하여, 저자가 작업의 흐름을 잃지 않고 내용에만 집중할 수 있는 몰입형 작성 환경을 제공한다. 이는 단순한 편의 기능을 넘어, 문서의 품질과 완성 속도를 직접적으로 향상시키는 핵심적인 생산성 도구이다.
1.3 주요 활용 사례
MkDocs의 유연성과 단순함은 다양한 목적의 웹사이트 구축에 활용될 수 있다.
-
기술 문서 (Technical Documentation): MkDocs의 가장 대표적인 활용 분야로, 프로그래밍 언어 라이브러리, 프레임워크, REST API 등의 공식 문서를 제작하는 데 최적화되어 있다. 명확하고 간결한 코드베이스 문서를 제공하는 데 필수적인 도구로 자리 잡았다.3
-
교육 자료 (Educational Resources): 온라인 강좌의 강의 노트, 기술 워크숍의 참조 자료, 특정 작업에 대한 단계별 가이드 등 체계적인 교육 콘텐츠를 구성하고 배포하는 데 매우 효과적이다.3
-
내부 지식 베이스 (Internal Knowledge Base): 기업이나 팀 내부에 축적된 기술적 지식, 프로세스, 온보딩 가이드 등을 체계적으로 정리하여 구성원들이 쉽게 검색하고 참조할 수 있는 내부 위키나 지식 베이스를 구축하는 데 이상적이다.
-
마케팅 자료 (Marketing Materials): 제품이나 서비스가 고객의 문제를 어떻게 해결했는지 보여주는 성공 사례(case studies)나 기술 백서(white papers) 등을 생성하고 배포하는 데에도 활용될 수 있다.3
2. 시작하기: 설치 및 프로젝트 초기 설정
MkDocs를 사용하여 문서화 프로젝트를 시작하기 위해서는 몇 가지 간단한 준비 과정이 필요하다. 이 단계에서는 안정적이고 재현 가능한 개발 환경을 구축하는 것을 목표로, Python 환경 확인부터 프로젝트 생성까지의 전 과정을 단계별로 안내한다.
2.1 사전 준비: Python 및 pip 환경 확인
MkDocs는 Python 기반으로 동작하므로, 시스템에 Python이 올바르게 설치되어 있어야 한다.
- Python 버전 확인: MkDocs는 Python 3.7 이상 버전을 요구한다.4 터미널 또는 명령 프롬프트를 열고 다음 명령어를 실행하여 설치된 Python 버전을 확인한다.
python --version
만약 Python이 설치되어 있지 않거나 버전이 낮은 경우, 공식 웹사이트(python.org)에서 최신 버전을 다운로드하여 설치해야 한다.
- pip 버전 확인:
pip는 Python 패키지 관리자로, MkDocs와 관련 도구들을 설치하는 데 사용된다. 일반적으로 Python 3.4 이상 버전에는pip가 기본적으로 포함되어 있다.4 다음 명령어로pip의 설치 여부를 확인한다.
pip --version
- Windows 사용자 주의사항: Windows 환경에서 Python을 설치할 때는 설치 프로그램 초기 화면에서 “Add Python to PATH” 또는 유사한 이름의 체크박스를 반드시 선택해야 한다.4 이 옵션을 활성화해야 명령 프롬프트 어디에서나
python과 pip 명령어를 사용할 수 있다. 또한, 설치 마지막 단계에서 “Disable path length limit” 옵션이 나타나면 선택하여 경로 길이 제한을 해제하는 것이 좋다.6
2.2 가상 환경 구성 및 MkDocs 설치
기술 문서 프로젝트도 하나의 독립된 소프트웨어 프로젝트와 같다. 프로젝트별로 사용되는 MkDocs, 테마, 플러그인의 버전을 격리하여 관리하는 것은 매우 중요하다. 이를 위해 Python의 가상 환경(venv)을 사용하는 것이 규칙이다.
- 프로젝트 폴더 생성: 문서를 관리할 새로운 폴더를 만들고 해당 폴더로 이동한다.
mkdir my-project-docs
cd my-project-docs
- 가상 환경 생성: 현재 폴더 내에
venv라는 이름의 가상 환경을 생성한다.4
python -m venv venv
- 가상 환경 활성화: 생성된 가상 환경을 활성화한다. 활성화되면 터미널 프롬프트 앞에
(venv)가 표시된다.4
- Windows:
venv\Scripts\activate
- macOS / Linux:
source venv/bin/activate
- MkDocs 설치: 활성화된 가상 환경 안에서
pip를 사용하여 MkDocs를 설치한다.4
pip install mkdocs
- 설치 확인: 설치가 성공적으로 완료되었는지 확인한다. 버전 정보가 출력되어야 한다.4
mkdocs --version
2.3 추천 테마 및 필수 플러그인 설치
MkDocs의 기본 테마만으로는 현대적인 문서 사이트를 구축하기에 기능이 부족하다. 커뮤니티에서 사실상의 표준으로 자리 잡은 mkdocs-material 테마는 단순한 스킨을 넘어, 검색, 소셜 카드, 고급 마크다운 확장 등 강력한 기능들을 통합 제공하는 프레임워크 역할을 한다. 따라서 MkDocs를 시작할 때 mkdocs-material을 함께 설치하는 것이 필수적이다.
- Material 테마 설치: 다음 명령어로
mkdocs-material테마를 설치한다.8
pip install mkdocs-material
- 유용한 플러그인 설치 (선택 사항): 초기 단계에서 탐색 메뉴 관리를 용이하게 해주는
mkdocs-awesome-pages-plugin과 같은 플러그인을 함께 설치하면 편리하다.6
pip install mkdocs-awesome-pages-plugin
2.4 새 프로젝트 생성 및 기본 구조 분석 (mkdocs new)
필요한 도구 설치가 완료되면, mkdocs new 명령어를 사용하여 프로젝트의 기본 골격을 생성한다.
- 프로젝트 생성:
mkdocs new명령어 뒤에 프로젝트 폴더 이름을 지정한다. 현재 폴더에 생성하려면.을 사용한다.6
mkdocs new.
- 기본 구조 분석: 명령 실행 후, 다음과 같은 기본 파일 구조가 생성된다.
-
mkdocs.yml: 프로젝트의 모든 설정을 제어하는 중앙 설정 파일이다. 사이트의 이름, 사용할 테마, 플러그인, 탐색 메뉴 구조 등을 이곳에서 정의한다. -
docs/: 모든 문서 콘텐츠가 위치하는 디렉토리이다. -
docs/index.md: 웹사이트의 홈페이지(랜딩 페이지) 역할을 하는 기본 마크다운 파일이다.11
이로써 MkDocs 프로젝트를 시작하기 위한 모든 준비가 완료되었다. 이제 mkdocs.yml 파일을 수정하고 docs 폴더에 마크다운 파일을 추가하여 자신만의 문서를 만들어 나갈 수 있다.
3. 핵심 워크플로: 실시간 미리보기와 정적 사이트 빌드
MkDocs의 작업 흐름은 크게 두 단계로 나뉜다: ‘작성 및 미리보기’ 단계와 ‘빌드 및 배포’ 단계. 이 두 단계를 명확히 이해하는 것은 효율적인 문서 관리를 위해 필수적이다. MkDocs는 각 단계를 위한 명확한 명령어를 제공한다.
3.1 개발 서버 실행 (mkdocs serve): 실시간 변경사항 확인
mkdocs serve는 문서 작성자를 위한 핵심 명령어로, 로컬 환경에서 문서를 작성하고 실시간으로 변경사항을 확인하는 데 사용된다.
- 서버 실행: 프로젝트의 루트 디렉토리(즉,
mkdocs.yml파일이 있는 위치)에서 다음 명령어를 실행한다.5
mkdocs serve
-
실시간 미리보기: 명령어를 실행하면 MkDocs는 내장된 경량 웹 서버를 가동시킨다. 기본적으로
http://127.0.0.1:8000주소로 접속하여 현재 작업 중인 문서 사이트를 웹 브라우저에서 확인할 수 있다.6 -
자동 리로드:
serve명령어의 가장 강력한 기능은 파일 변경 감지 및 자동 리로드이다.docs디렉토리 내의 마크다운 파일을 수정하고 저장하면, 서버는 이 변경을 즉시 감지하여 사이트를 메모리 상에서 다시 빌드하고 연결된 웹 브라우저를 자동으로 새로고침한다.3 이 기능 덕분에 작성자는 편집기와 브라우저를 나란히 두고, 코드 변경이 문서에 어떻게 반영되는지 즉각적으로 확인하며 작업할 수 있다. -
주요 옵션:
-
-a, --dev-addr <IP:PORT>: 개발 서버의 IP 주소와 포트를 변경할 수 있다. 예를 들어,mkdocs serve -a 0.0.0.0:9000은 모든 네트워크 인터페이스의 9000번 포트에서 서버를 실행한다.10
3.2 정적 사이트 빌드 (mkdocs build): 배포용 파일 생성
문서 작성을 마치고 웹에 게시할 준비가 되면, mkdocs build 명령어를 사용하여 최종 결과물을 생성한다. 이 명령어는 배포를 위한 최종적이고 재현 가능한 ’아티팩트(artifact)’를 만드는 과정이다.
- 사이트 빌드: 프로젝트 루트 디렉토리에서 다음 명령어를 실행한다.5
mkdocs build
-
결과물 확인: 명령이 성공적으로 완료되면, 프로젝트 루트에
site라는 새로운 디렉토리가 생성된다.6 이 디렉토리 안에는 마크다운 파일들이 변환된 HTML 파일, 테마의 CSS와 JavaScript 파일, 이미지 등 웹 서버에 직접 업로드할 수 있는 모든 정적 파일이 포함되어 있다. -
주요 옵션:
build명령어는 특히 자동화된 빌드 환경(CI/CD)에서 유용한 여러 옵션을 제공한다.10 -
-c, --clean: 빌드를 시작하기 전에 기존site디렉토리의 내용을 모두 삭제한다. 이는 이전 빌드에서 남은 불필요한 파일이 최종 결과물에 포함되는 것을 방지한다. 이 옵션은 기본적으로 활성화되어 있다. -
--dirty:--clean의 반대 옵션으로,site디렉토리를 비우지 않고 변경된 소스 파일에 해당하는 결과물만 갱신한다. 로컬에서 사소한 변경을 빠르게 확인하고 싶을 때 빌드 시간을 단축할 수 있지만, 배포용 빌드에는 권장되지 않는다. -
-s, --strict: 엄격 모드를 활성화한다. 빌드 과정에서 깨진 내부 링크나 설정 오류와 같은 경고(warning)가 하나라도 발생하면 빌드 프로세스를 즉시 중단시킨다. 이는 문서의 품질과 무결성을 보장하는 데 매우 중요하며, CI/CD 파이프라인에서는 이 옵션을 반드시 사용하는 것이 좋다. -
-d, --site-dir <DIR>: 빌드 결과물이 생성될 디렉토리의 이름을site가 아닌 다른 이름으로 지정할 수 있다.
serve가 작성자를 위한 빠르고 반복적인 피드백 루프를 제공하는 개발 도구라면, build는 최종 배포물을 생성하는 CI/CD 파이프라인의 첫 단계라고 할 수 있다. 이 두 명령어의 역할을 명확히 구분하여 사용하는 것이 MkDocs 워크플로의 핵심이다.
| 명령어 (Command) | 설명 (Description) | 주요 옵션 (Key Options) |
|---|---|---|
mkdocs new <dir> | 새 MkDocs 프로젝트를 생성한다. | -q (조용한 모드), -v (상세 모드) |
mkdocs serve | 내장 개발 서버를 실행하여 실시간 미리보기를 제공한다. | -a, --dev-addr (주소/포트 변경), --dirty (빠른 리빌드) |
mkdocs build | 배포용 정적 사이트를 site 디렉토리에 생성한다. | -c, --clean (정리 후 빌드), -s, --strict (엄격 모드) |
mkdocs gh-deploy | 빌드된 사이트를 GitHub Pages에 배포한다. | --remote-branch (배포 브랜치 지정), -m (커밋 메시지) |
4. 콘텐츠 작성: 마크다운을 활용한 문서화
MkDocs의 모든 콘텐츠는 docs 디렉토리 안에 있는 마크다운 파일들을 통해 생성된다. 효과적인 문서는 단순히 텍스트를 나열하는 것을 넘어, 논리적인 구조와 시각적 보조 장치를 통해 독자가 정보를 쉽게 이해하고 소화할 수 있도록 설계되어야 한다.
4.1 docs 디렉토리 구조화 및 페이지 관리
문서의 정보 아키텍처(Information Architecture)는 docs 디렉토리의 파일 시스템 구조에서 시작된다.
-
파일 및 디렉토리 배치: 모든 마크다운 소스 파일(
.md,.markdown등)은docs디렉토리 내에 위치해야 한다.11 -
URL 구조: 파일 시스템의 계층 구조는 그대로 최종 웹사이트의 URL 구조로 변환된다. 예를 들어,
docs/guide/installation.md파일은 웹사이트에서https://<your-domain>/guide/installation/이라는 깔끔한 URL로 제공된다.11 따라서, 사용자가 URL만 보고도 내용의 맥락을 예측할 수 있도록 논리적인 주제에 따라 하위 디렉토리를 만들어 문서를 체계적으로 구성하는 것이 매우 중요하다. -
홈페이지: 프로젝트의 랜딩 페이지는 관례적으로
docs/index.md파일로 작성한다.11
4.2 MkDocs를 위한 마크다운 고급 기법
MkDocs는 Python-Markdown 라이브러리를 기반으로 하며, 특히 mkdocs-material 테마와 함께 사용할 때 기본 마크다운의 한계를 뛰어넘는 풍부한 표현력을 제공한다. 이러한 확장 기능들은 단순히 문서를 꾸미는 것을 넘어, 정보의 위계를 시각적으로 표현하고 복잡한 내용을 효과적으로 구조화하여 정보 전달력을 극대화하는 핵심 도구이다.
- 코드 블록 및 구문 강조 (Code Blocks and Highlighting): 기술 문서의 핵심 요소인 코드 예제를 명확하게 보여줄 수 있다. 코드 블록을 시작하는 세 개의 백틱(```) 뒤에 프로그래밍 언어의 이름을 명시하면,
pymdownx.highlight확장이 해당 언어의 문법에 맞춰 코드를 아름답게 색칠해준다.14
def hello_world():
print("Hello, MkDocs!")
- 어드모니션 (Admonitions - 주의/경고/팁 박스): 독자의 주의를 환기시켜야 할 중요한 정보나 팁을 강조하는 데 사용된다.
!!!구문을 사용하며,note,warning,tip,danger등 다양한 유형을 제공한다.15
!!! warning “주의”
이 작업은 되돌릴 수 없습니다. 진행하기 전에 반드시 백업하십시오.
- 콘텐츠 탭 (Content Tabs): 관련된 정보를 한 공간에 묶어 제공하되, 사용자가 선택적으로 볼 수 있도록 탭 인터페이스를 구성할 수 있다. 예를 들어, 여러 운영체제에 대한 설치 방법을 각각의 탭으로 분리하여 제공하면 페이지가 훨씬 간결해진다.14
=== "Windows"bash
pip install mkdocs
=== "macOS / Linux"bash
pip3 install mkdocs
- 메타데이터 (Meta-Data): 각 마크다운 파일의 맨 위에 YAML 형식의 프론트매터(front-matter)를 추가하여 해당 페이지에만 적용되는 설정을 지정할 수 있다. 페이지의 제목을 명시적으로 설정하거나, 기본 템플릿 대신 특정 템플릿을 사용하도록 지시할 수 있다.11
---
title: 커스텀 페이지 제목
template: custom-template.html
---
페이지의 본문 내용...
이미지 및 기타 정적 파일 관리
이미지, PDF, 동영상 등 마크다운 파일 외의 정적 자산들도 docs 디렉토리 내에서 관리하는 것이 일반적이다.
-
이미지 폴더:
docs/assets/images/와 같은 하위 디렉토리를 만들어 이미지 파일들을 체계적으로 관리하는 것이 좋다. -
이미지 삽입: 표준 마크다운 이미지 문법을 사용하여 문-서에 이미지를 삽입한다. 이미지 파일의 경로는 현재 마크다운 파일을 기준으로 한 상대 경로로 지정한다.
이처럼 체계적인 디렉토리 구조와 강력한 마크다운 확장 기능을 활용하면, 단순한 텍스트를 넘어 독자가 쉽게 이해하고 따라할 수 있는 고품질의 기술 문서를 제작할 수 있다.
V. 설정 마스터하기: mkdocs.yml 완전 정복
mkdocs.yml 파일은 MkDocs 프로젝트의 심장부이자 제어 센터이다. 이 단일 YAML 파일 안에 사이트의 이름, 모양, 구조, 기능 등 모든 ’원하는 상태’를 선언적으로 정의하면, MkDocs 엔진이 이 명세서를 읽어 실제 웹사이트를 구축한다. 이는 코드로 인프라를 관리하는(Infrastructure as Code) 철학과 맞닿아 있으며, 이 파일 하나만 버전 관리하면 전체 문서 사이트의 구성이 완벽하게 재현 가능해진다.
기본 정보 설정
프로젝트의 기본적인 메타데이터를 정의하는 부분이다.
site_name: 웹사이트의 헤더와 브라우저 탭에 표시될 주 제목이다. 이 설정은mkdocs.yml파일 내에서 유일한 필수 항목이다.16
site_name: 나의 첫 MkDocs 프로젝트
site_url: 사이트가 최종적으로 배포될 공식 URL을 지정한다. 이 값은 검색 엔진 최적화(SEO)를 위한 정식(canonical) URL 링크를 생성하고, 사이트맵(sitemap.xml)을 만드는 데 사용되므로, 공개적으로 배포할 사이트라면 반드시 정확하게 설정해야 한다.16
site_url: https://username.github.io/my-project/
-
site_author,site_description: 각각 사이트의 저자와 간단한 설명을 정의한다. 이 정보는 생성된 HTML 페이지의<meta>태그에 포함되어 검색 엔진이 사이트의 내용을 이해하는 데 도움을 준다.16 -
repo_url,repo_name: 문서의 소스 코드가 저장된 GitHub, GitLab, Bitbucket 등의 Git 저장소 주소를 지정한다. 이 값을 설정하면 대부분의 테마(특히 Material 테마)에서 사이트 헤더에 해당 저장소로 바로 연결되는 링크를 자동으로 추가해준다.16
repo_url: https://github.com/username/my-project
repo_name: username/my-project
copyright: 사이트의 푸터(footer) 영역에 표시될 저작권 문구를 설정한다.17
탐색 메뉴 구성 (nav)
nav 설정은 사이트의 상단 및 사이드바에 표시되는 탐색 메뉴의 구조, 순서, 제목을 직접 제어하는 강력한 기능이다.11
-
자동 생성:
nav설정을 생략하면, MkDocs는docs디렉토리의 파일과 폴더 구조를 알파벳 순서로 분석하여 탐색 메뉴를 자동으로 생성한다. 간단한 프로젝트에서는 편리할 수 있다. -
수동 제어: 프로젝트가 복잡해지면 문서의 논리적 흐름에 따라 메뉴 순서를 정하고, 파일명과 다른 제목을 부여하며, 여러 페이지를 그룹으로 묶어야 할 필요가 생긴다. 이때
nav를 수동으로 정의하면 정보 구조를 저자의 의도대로 완벽하게 설계할 수 있다.
nav:
- '소개': 'index.md'
- '사용자 가이드':
- '첫걸음': 'guide/getting-started.md'
- '설치 안내': 'guide/installation.md'
- '고급 설정': 'guide/advanced-config.md'
- 'API 레퍼런스':
- '모듈 A': 'api/module-a.md'
- '모듈 B': 'api/module-b.md'
- '프로젝트 GitHub': 'https://github.com/username/my-project'
테마 설정 및 커스터마이징 기초
theme 블록은 사이트의 전반적인 외관과 느낌을 결정한다.16
mkdocs-material 테마를 기준으로 한 주요 설정은 다음과 같다.
name: 사용할 테마의 이름을 지정한다.
theme:
name: material
language: 문서와 테마 UI 요소(예: ‘검색’, ‘이전’, ‘다음’)의 언어를 설정한다. Material 테마는 한국어(ko)를 포함한 수십 개의 언어를 지원한다.9
theme:
name: material
language: ko
features,palette: Material 테마의 강력한 기능들을 활성화하거나 색상 조합을 변경하는 데 사용된다. 예를 들어, 상단 탭 형태의 네비게이션을 활성화하고 기본 색상을 파란색, 강조 색상을 주황색으로 설정할 수 있다.9
theme:
name: material
language: ko
features:
- navigation.tabs
- search.suggest
palette:
primary: 'blue'
accent: 'orange'
마크다운 확장 기능 활성화 (markdown_extensions)
markdown_extensions 목록에 원하는 확장의 이름을 추가하여, 앞서 설명한 어드모니션, 콘텐츠 탭 등과 같은 고급 마크다운 기능을 활성화할 수 있다.11 Material 테마 사용 시 권장되는 기본 설정은 다음과 같다.
markdown_extensions:
- admonition
- pymdownx.details
- pymdownx.superfences
- pymdownx.tabbed:
alternate_style: true
- toc:
permalink: true
| 키 (Key) | 유형 (Type) | 설명 (Description) | 예시 (Example) |
|---|---|---|---|
site_name | String | 사이트의 주 제목 (필수) | site_name: My Project Docs |
site_url | String | 사이트의 정식 URL. 배포 시 필수 설정. | site_url: https://user.github.io/repo/ |
repo_url | String | 소스 코드 Git 저장소 URL. | repo_url: https://github.com/user/repo |
theme | Object | 테마 이름 및 관련 설정을 정의. | theme: { name: 'material', language: 'ko' } |
nav | List | 사이트 탐색 메뉴의 구조를 수동으로 정의. | nav: [ { 'Home': 'index.md' },... ] |
markdown_extensions | List | 사용할 Python-Markdown 확장 기능 목록. | markdown_extensions: [ 'admonition', 'pymdownx.superfences' ] |
plugins | List | 활성화할 플러그인 목록 및 설정. | plugins: [ 'search', { 'mkdocstrings': {... } } ] |
extra_css | List | 추가할 커스텀 CSS 파일 경로 목록. | extra_css: [ 'css/custom.css' ] |
VI. 고급 기능 활용: 테마와 플러그인
MkDocs의 진정한 힘은 그 자체의 핵심 기능이 아니라, 유연하고 확장 가능한 아키텍처에서 나온다. MkDocs 코어는 마크다운을 HTML로 변환하는 안정적인 엔진 역할을 하고, 그 위에 ’테마’와 ’플러그인’이라는 두 가지 강력한 기능 레이어를 쌓아 올릴 수 있다. 이 생태계를 활용하면 단순한 정적 문서를 넘어, 동적이고 상호작용적인 고기능성 콘텐츠 플랫폼을 구축할 수 있다.
테마 심층 분석: Material for MkDocs
mkdocs-material은 단순한 ’스킨’이 아니다. 이것은 MkDocs의 기능을 대폭 확장하고 현대적인 웹 표준을 완벽하게 지원하는 하나의 완성된 ’프레임워크’이다.14
-
디자인 커스터마이징:
mkdocs.yml파일의theme섹션에서 몇 줄의 설정만으로 사이트의 브랜딩을 완벽하게 제어할 수 있다. -
색상 팔레트 (
palette):primary와accent키를 사용하여 사이트의 주 색상과 강조 색상을 수십 가지의 미리 정의된 색상 중에서 선택하거나, 커스텀 색상 코드를 지정할 수 있다.9 다크 모드/라이트 모드 전환 기능도 쉽게 추가할 수 있다. -
폰트 (
font):text와code키를 사용하여 본문과 코드 블록에 적용할 구글 폰트를 지정할 수 있다. 시스템 폰트를 사용하도록 설정하여 외부 의존성을 제거하는 것도 가능하다.9 -
로고 및 아이콘 (
logo,icon): 사이트 헤더에 표시될 로고 이미지를 지정하거나, SVG 아이콘을 직접 설정할 수 있다.9 -
고급 기능 활성화 (
features): Material 테마는 수많은 UI/UX 개선 기능을 내장하고 있으며,features배열에 원하는 기능의 이름을 추가하는 것만으로 활성화할 수 있다.19 -
navigation.tabs: 최상위 섹션을 탭 형태로 표시한다. -
navigation.top: ‘맨 위로 가기’ 버튼을 추가한다. -
search.suggest: 검색창에 입력 시 자동 완성 제안을 보여준다. -
search.highlight: 검색 결과 페이지로 이동 시 검색어를 하이라이트한다. -
content.code.copy: 모든 코드 블록에 ‘복사’ 버튼을 추가한다. -
커스텀 확장 (
custom_dir,extra_css,extra_javascript): Material 테마의 기본 디자인을 일부 수정하거나 새로운 기능을 추가하고 싶을 때 사용한다.custom_dir에 재정의할 템플릿 파일을 배치하거나,extra_css와extra_javascript를 통해 자신만의 CSS 스타일과 JavaScript 코드를 손쉽게 추가할 수 있다.16
필수 플러그인 활용 가이드
플러그인은 MkDocs의 빌드 프로세스에 개입하여 콘텐츠를 동적으로 생성하거나 변형하는 역할을 한다. mkdocs.yml의 plugins 배열에 플러그인 이름과 설정을 추가하여 활성화한다.20 이들은 정적인 마크다운의 한계를 극복하고, 외부 소스(코드, 데이터, 다이어그램 정의)로부터 동적으로 콘텐츠를 생성하여 문서에 주입하는 역할을 한다.
-
강력한 검색 기능 구축 (
search): Material 테마에 내장된search플러그인은 클라이언트 사이드 검색의 표준을 제시한다. 다국어 지원, 오타 보정, 검색 결과 미리보기 등 강력한 기능을 기본으로 제공하며, 앞서features에서 설명한suggest,highlight,share기능과 완벽하게 연동된다.19 특정 페이지나 섹션을 검색 결과에서 제외하는 기능도 메타데이터를 통해 지원하여, 검색의 정확도를 높일 수 있다.19 -
소스 코드 문서 자동화 (
mkdocstrings): 기술 문서의 핵심인 API 레퍼런스를 자동화하는 가장 강력한 플러그인이다. Python, Go, C++ 등 다양한 언어의 소스 코드에 작성된 주석(docstring)을 직접 읽어와, 클래스, 함수, 매개변수, 반환값 등을 포함한 아름답고 전문적인 API 문서를 자동으로 생성한다.23 마크다운 파일 내에 다음과 같은 간단한 구문만 삽입하면 된다.
::: my_package.my_module.MyClass
options:
show_root_heading: true
- 시각적 정보 전달: 다이어그램 (
mermaid): 복잡한 시스템 아키텍처나 프로세스 흐름을 텍스트만으로 설명하기는 어렵다.mkdocs-mermaid2-plugin을 사용하거나, Material 테마의 내장 Mermaid.js 지원을 활성화하면, 마크다운 코드 블록 안에 텍스트 기반의 간단한 구문으로 플로우차트, 시퀀스 다이어그램, 간트 차트 등을 손쉽게 렌더링할 수 있다.24
graph TD
A[시작] --> B{결정};
B -->|예| C[작업 1];
B -->|아니오| D[작업 2];
-
동적 콘텐츠 생성 (
macros):mkdocs-macros-plugin은 MkDocs에 Jinja2 템플릿 엔진의 힘을 불어넣는다. 이를 통해 마크다운 파일 내에서 변수를 사용하거나, 반복문/조건문과 같은 프로그래밍 로직을 적용할 수 있다.mkdocs.yml의extra섹션에 정의된 변수(예: 최신 버전 번호)를 문서 전체에서 일관되게 재사용하거나, 별도의 Python 파일에 정의된 함수(매크로)를 호출하여 외부 데이터를 가져와 표를 동적으로 생성하는 등의 고급 작업이 가능해진다.27 -
소셜 미디어 카드 자동 생성 (
social): Material 테마의 내장social플러그인은 각 문서 페이지의 제목, 설명, 그리고 설정된 로고 등을 조합하여 링크 공유 시 미리보기로 표시될 이미지(소셜 카드)를 빌드 시점에 자동으로 생성한다. 이를 통해 별도의 디자인 작업 없이도 소셜 미디어에서 문서 링크가 매력적으로 보이게 할 수 있다.28
| 플러그인 (Plugin) | 설치 명령어 (Installation) | 핵심 기능 (Core Function) | mkdocs.yml 설정 예시 |
|---|---|---|---|
search (Material 내장) | (Material에 포함) | 고성능 클라이언트 사이드 검색 (제안, 하이라이팅) | plugins: [search] |
mkdocstrings | pip install mkdocstrings[python] | 소스 코드 docstring 기반 API 문서 자동 생성 | plugins: [mkdocstrings] |
mermaid2 | pip install mkdocs-mermaid2-plugin | 텍스트 기반으로 다이어그램 렌더링 | plugins: [mermaid2] |
macros | pip install mkdocs-macros-plugin | 마크다운 내 변수 및 Jinja2 템플릿 사용 | plugins: [macros] |
social (Material 내장) | (Material에 포함) | 소셜 미디어 공유 카드 자동 생성 | plugins: [social] |
VII. 배포 및 자동화: 완성된 문서 세상에 공개하기
훌륭한 문서를 작성했다면, 이제 세상에 공개할 차례이다. MkDocs는 정적 파일을 생성하므로 배포가 매우 유연하지만, 가장 효율적이고 전문적인 방법은 이 과정을 자동화하는 것이다. mkdocs gh-deploy는 훌륭한 시작점이며, GitHub Actions를 통한 CI/CD 파이프라인 구축은 전문가 수준의 문서 관리 워크플로의 종착점이다.
GitHub Pages를 이용한 간편 배포 (mkdocs gh-deploy)
문서의 소스 코드를 GitHub 저장소에서 관리하는 경우, mkdocs gh-deploy 명령어는 빌드와 배포를 단 한 번의 명령으로 해결해주는 가장 간편한 방법이다.12
- 작동 원리: 이 명령어는 내부적으로 다음과 같은 작업을 순차적으로 수행한다.
-
mkdocs build를 실행하여site디렉토리에 최신 버전의 정적 파일을 생성한다. -
ghp-import라는 도구를 사용하여site디렉토리의 내용을 별도의gh-pages브랜치에 커밋한다. -
생성된
gh-pages브랜치를 GitHub 원격 저장소로 푸시한다.12
GitHub는 gh-pages 브랜치의 내용을 감지하여 자동으로 웹사이트로 호스팅해준다.
- 실행 방법: 프로젝트의 기본 브랜치(예:
main또는master)가 최신 상태인지 확인한 후, 프로젝트 루트에서 다음 명령어를 실행한다.
mkdocs gh-deploy
-
사전 조건 및 주의사항:
-
mkdocs.yml파일에site_url이 정확하게 설정되어 있어야 CSS와 JS 파일 경로가 올바르게 생성된다. -
이 명령어를 실행하는 로컬 환경에 커밋되지 않은 파일이나 변경사항이 있다면, 이 내용이 배포에 포함될 수 있다. 따라서 항상 Git 작업 디렉토리를 깨끗하게 정리(
git status확인)한 후에 실행하는 것이 안전하다.12 -
gh-pages브랜치는 이 명령어를 통해 자동으로 관리되므로, 사용자가 직접 해당 브랜치를 수정해서는 안 된다. 모든 변경은 소스 브랜치에서 이루어져야 한다.12
GitHub Actions를 활용한 CI/CD 파이프라인 구축
수동 배포는 개인 프로젝트에서는 편리하지만, 여러 사람이 협업하는 전문적인 환경에서는 일관성과 신뢰성을 보장하기 어렵다. GitHub Actions를 사용하면 ‘Docs as Code’ 워크플로의 마지막 퍼즐 조각인 배포 자동화를 완성할 수 있다. 즉, 소스 코드 브랜치(예: main)에 변경사항이 푸시될 때마다, 격리된 가상 환경에서 자동으로 문서를 빌드하고 배포하는 파이프라인을 구축하는 것이다.31
-
워크플로 파일 생성: 프로젝트 루트에
.github/workflows/디렉토리를 만들고, 그 안에deploy-docs.yml과 같은 이름의 YAML 파일을 생성한다. -
워크플로 스크립트 작성: 아래는
main브랜치에 푸시가 발생할 때마다 MkDocs 사이트를 빌드하고 GitHub Pages에 배포하는 표준적인 워크플로 예시이다.
name: Deploy Documentation to GitHub Pages
on:
push:
branches:
- main # 'main' 브랜치에 푸시될 때만 실행
jobs:
deploy:
runs-on: ubuntu-latest # 실행 환경 지정
steps:
- name: Checkout repository
uses: actions/checkout@v4 # 저장소 코드를 워크플로 환경으로 가져옴
- name: Set up Python
uses: actions/setup-python@v5 # Python 환경 설정
with:
python-version: 3.x
- name: Install dependencies
run: | pip install mkdocs-material # mkdocs와 material 테마 설치 # 필요한 다른 플러그인들도 여기에 설치 # 예: pip install mkdocs-macros-plugin
- name: Deploy to GitHub Pages
run: mkdocs gh-deploy --force --clean --remote-name origin
이 워크플로가 설정되면, 팀 구성원은 더 이상 로컬 환경에서 배포 명령을 실행할 필요가 없다. 그저 자신의 변경사항을 main 브랜치에 푸시(또는 Pull Request를 통해 병합)하기만 하면, 몇 분 안에 문서 사이트가 자동으로 업데이트된다. 이는 문서화 프로세스를 표준화하고, 인적 실수를 줄이며, 모든 변경사항이 항상 최신 상태의 문서에 반영되도록 보장한다.
기타 호스팅 플랫폼 배포 전략
MkDocs가 생성하는 결과물은 100% 정적 파일이므로, 사실상 모든 종류의 웹 호스팅 서비스에 배포할 수 있다.3
- 배포 절차:
-
로컬 환경에서
mkdocs build명령어를 실행하여site디렉토리를 생성한다. -
생성된
site디렉토리 안의 모든 파일과 폴더를 Netlify, Vercel, AWS S3, 또는 전통적인 웹 호스팅 서버의 루트 디렉토리에 업로드한다.
- 자동화: 대부분의 최신 호스팅 플랫폼(Netlify, Vercel 등)은 GitHub 저장소와 직접 연동하는 기능을 제공한다. 저장소를 연결하고 빌드 명령어(
mkdocs build)와 출력 디렉토리(site)를 지정해주면, GitHub Actions와 유사하게 저장소에 변경사항이 푸시될 때마다 자동으로 빌드 및 배포를 수행해준다.
VIII. 실전 시나리오 및 모범 사례
지금까지 MkDocs의 기본 개념부터 고급 기능, 배포 자동화까지 모든 구성 요소를 살펴보았다. 이 마지막 장에서는 이러한 지식들을 종합하여 실제 프로젝트에 적용하는 방법을 보여주고, 장기적으로 문서를 효과적으로 유지보수하기 위한 전문가 수준의 전략과 팁을 제공한다. 좋은 문서는 ’한 번 만드는 것’에서 끝나지 않고, ’지속적으로 관리하는 것’에서 완성된다.
사례 연구: Python 라이브러리 문서 사이트 구축
가상의 데이터 분석 유틸리티 라이브러리 DataWrangler의 공식 문서를 구축하는 과정을 단계별로 시뮬레이션한다.
- 프로젝트 초기화:
mkdir datawrangler-docs && cd datawrangler-docs
python -m venv venv && source venv/bin/activate
pip install mkdocs-material mkdocstrings[python]
mkdocs new.
mkdocs.yml상세 설정:
site_name: DataWrangler
site_url: https://example.com/datawrangler/
repo_url: https://github.com/user/datawrangler
theme:
name: material
language: ko
features:
- navigation.instant
- content.code.copy
palette:
scheme: default
primary: teal
accent: amber
nav:
- '소개': 'index.md'
- '사용법':
- '설치': 'usage/installation.md'
- '기본 튜토리얼': 'usage/tutorial.md'
- 'API 레퍼런스': 'reference/api.md'
plugins:
- search
- mkdocstrings:
handlers:
python:
options:
show_source: false
markdown_extensions:
- admonition
- pymdownx.superfences
- 콘텐츠 작성:
-
docs/index.md: 라이브러리의 목적과 핵심 기능을 소개한다. -
docs/usage/installation.md:pip install datawrangler설치 방법을 안내한다. -
docs/usage/tutorial.md: 실제 데이터로 라이브러리의 주요 함수를 사용하는 예제 코드를 단계별로 설명한다. -
docs/reference/api.md:mkdocstrings를 사용하여 API 문서를 자동으로 생성한다.
# API 레퍼런스
::: datawrangler.core
- 로컬 테스트 및 배포:
-
mkdocs serve로 모든 페이지가 의도대로 렌더링되는지, API 문서가 잘 생성되었는지 확인한다. -
GitHub Actions 워크플로를 설정하여
main브랜치에 푸시할 때마다 자동으로 배포되도록 구성한다.
팁: 유지보수성 및 확장성을 고려한 문서 관리 전략
문서 프로젝트가 성장함에 따라 일관성을 유지하고 변경을 용이하게 만드는 ‘문서 엔지니어링’ 관점이 중요해진다.
- 의존성 명시적 관리: 프로젝트의 재현성을 보장하기 위해, 사용 중인 MkDocs, 테마, 플러그인의 버전을
requirements.txt파일에 명시적으로 고정한다.
# requirements.txt
mkdocs==1.6.1
mkdocs-material==9.5.2
mkdocstrings==0.25.1
이렇게 하면 새로운 팀원이 합류하거나 CI/CD 환경에서 빌드할 때, pip install -r requirements.txt 명령만으로 항상 동일한 버전의 도구들을 설치하여 예측 불가능한 빌드 실패를 방지할 수 있다.
- 설정 분리 및 상속: 여러 개의 관련 문서 사이트(예: 제품별 문서)를 운영할 때, 공통된 설정(테마, 저작권 등)을
base.yml과 같은 기본 설정 파일에 정의하고, 각 사이트의mkdocs.yml에서는INHERIT키를 사용하여 이 기본 설정을 불러온 후 필요한 부분만 재정의할 수 있다. 이는 설정의 중복을 제거하고 일관성을 유지하는 데 매우 유용하다.16
# in my-project/mkdocs.yml
INHERIT:../base.yml
site_name: My Project Specific Docs
-
콘텐츠 재사용:
mkdocs-macros-plugin과 Jinja2 템플릿의{% include '...' %}구문을 활용하면, 여러 페이지에서 반복적으로 사용되는 콘텐츠 조각(예: 특정 경고문, 설치 전제조건 안내 등)을 별도의 마크다운 파일로 분리하여 관리할 수 있다. 이렇게 하면 해당 내용의 수정이 필요할 때 한 파일만 변경하면 모든 관련 페이지에 자동으로 반영되어 유지보수성이 크게 향상된다. -
기여 가이드 문서화: 문서화 프로세스 자체를 문서화하는 것은 협업의 핵심이다. 오픈소스 프로젝트나 팀 단위 프로젝트에서는
CONTRIBUTING.md파일을 만들어 새로운 기여자가 문서 프로젝트에 쉽게 참여할 수 있도록 안내해야 한다. 여기에는 로컬 개발 환경 설정 방법(가상 환경 생성,pip install -r requirements.txt실행),mkdocs serve로 미리보기하는 방법, Pull Request 생성 규칙 등을 명확히 기술해야 한다. 이는 문서화를 특정인의 책임이 아닌, 팀 전체의 공동 작업으로 만드는 중요한 문화적 장치이다.
이러한 모범 사례들을 적용함으로써, MkDocs 프로젝트를 단기적인 결과물로 끝내지 않고, 소프트웨어의 진화와 함께 지속적으로 성장하고 발전하는 살아있는 지식 자산으로 만들어나갈 수 있다.
참고 자료
- en.wikipedia.org, 9월 21, 2025에 액세스, https://en.wikipedia.org/wiki/MkDocs
- mkdocs/mkdocs: Project documentation with Markdown. - GitHub, 9월 21, 2025에 액세스, https://github.com/mkdocs/mkdocs
- A beginner guide to using MKDocs - Dasilva Akorede’s Blog, 9월 21, 2025에 액세스, https://coreyodonis.hashnode.dev/a-beginner-guide-to-using-mkdocs
- MkDocs란? 설치, 사용 및 배포 방법 - Apidog, 9월 21, 2025에 액세스, https://apidog.com/kr/blog/how-to-use-mkdocs-kr/
- 홈 - MKDocs 튜토리얼, 9월 21, 2025에 액세스, https://demun.github.io/mkdocs-tuts/
- MkDocs 설치 가이드 (윈도 10) - 써드아이시스템 기술문서, 9월 21, 2025에 액세스, https://docs.3rdeyesys.com/docs/etc/markdown/mkdocs/basic-install-guide/
- Getting Started - MkDocs, 9월 21, 2025에 액세스, https://www.mkdocs.org/getting-started/
- Install MkDocs - Open Water Foundation, 9월 21, 2025에 액세스, https://learn.openwaterfoundation.org/owf-learn-mkdocs/install/
- Installation - Material for MkDocs - GitHub Pages, 9월 21, 2025에 액세스, https://squidfunk.github.io/mkdocs-material/getting-started/
- Command Line Interface - MkDocs, 9월 21, 2025에 액세스, https://www.mkdocs.org/user-guide/cli/
- Writing Your Docs - MkDocs, 9월 21, 2025에 액세스, https://www.mkdocs.org/user-guide/writing-your-docs/
- Deploying Your Docs - MkDocs, 9월 21, 2025에 액세스, https://www.mkdocs.org/user-guide/deploying-your-docs/
- mkdocs build - Fig.io, 9월 21, 2025에 액세스, https://fig.io/manual/mkdocs/build
- Material for MkDocs: Full Tutorial To Build And Deploy Your Docs Portal - YouTube, 9월 21, 2025에 액세스, https://www.youtube.com/watch?v=xlABhbnNrfI
- 5 Features I Like About Material for MkDocs - stevemar.net, 9월 21, 2025에 액세스, https://www.stevemar.net/five-things-about-mkdocs/
- Configuration - MkDocs, 9월 21, 2025에 액세스, https://www.mkdocs.org/user-guide/configuration/
- Themes - MkDocs, 9월 21, 2025에 액세스, https://www.mkdocs.org/dev-guide/themes/
- Choosing Your Theme - MkDocs, 9월 21, 2025에 액세스, https://www.mkdocs.org/user-guide/choosing-your-theme/
- Setting up site search - Material for MkDocs - GitHub Pages, 9월 21, 2025에 액세스, https://squidfunk.github.io/mkdocs-material/setup/setting-up-site-search/
- MkDocs Plugins, 9월 21, 2025에 액세스, https://www.mkdocs.org/dev-guide/plugins/
- Built-in search plugin - Material for MkDocs - GitHub Pages, 9월 21, 2025에 액세스, https://squidfunk.github.io/mkdocs-material/plugins/search/
- mkdocs-exclude-search - PyPI, 9월 21, 2025에 액세스, https://pypi.org/project/mkdocs-exclude-search/
- Overview of TechDocs Plugins - Harness Developer Hub, 9월 21, 2025에 액세스, https://developer.harness.io/docs/internal-developer-portal/techdocs/techdocs-plugins-overview/
- The best MkDocs plugins and customizations | by Christoph Rieke - Medium, 9월 21, 2025에 액세스, https://chrieke.medium.com/the-best-mkdocs-plugins-and-customizations-fc820eb19759
- MkDocs-Mermaid2, 9월 21, 2025에 액세스, https://mkdocs-mermaid2.readthedocs.io/
- Diagrams - Material for MkDocs - GitHub Pages, 9월 21, 2025에 액세스, https://squidfunk.github.io/mkdocs-material/reference/diagrams/
- Create richer and more beautiful pages in MkDocs, by using variables and calls to macros in the markdown code. - GitHub, 9월 21, 2025에 액세스, https://github.com/fralau/mkdocs-macros-plugin
- docs/tutorials/social/basic.md · 34ec8b4e71679ce0f51ded91391cec56d59e5662 · mirrors / squidfunk / mkdocs-material - H3N GitLab, 9월 21, 2025에 액세스, https://git.h3n.eu/mirrors/squidfunk/mkdocs-material/-/blob/34ec8b4e71679ce0f51ded91391cec56d59e5662/docs/tutorials/social/basic.md
- Setting up social cards - Material for MkDocs - GitHub Pages, 9월 21, 2025에 액세스, https://squidfunk.github.io/mkdocs-material/setup/setting-up-social-cards/
- Built-in social plugin - Material for MkDocs - GitHub Pages, 9월 21, 2025에 액세스, https://squidfunk.github.io/mkdocs-material/plugins/social/
- 저는 방금 회사 사용자 문서를 위해 MKDocs 인스턴스를 배포했어요. - Reddit, 9월 21, 2025에 액세스, https://www.reddit.com/r/technicalwriting/comments/wvw2ri/ive_just_deployed_an_instance_of_mkdocs_for_my/?tl=ko
- Deploying MkDocs to GitHub Pages with GitHub Actions - Thomas Thornton Blog, 9월 21, 2025에 액세스, https://thomasthornton.cloud/2024/05/01/deploying-mkdocs-to-github-pages-with-github-actions/