[Winebug] Git 마크다운 가이드(1/3)

게시 2025/07/02

By udjoo

4 분읽는 시간

🎈 마크다운이란?

Git 블로그를 운영하다 보면 자연스럽게 Markdown(마크다운)을 접하게 된다.
그렇다면 마크다운이란?

일반 텍스트 문서에 서식 요소를 추가할 수 있는 가벼운 마크업 언어
개발자, 기술 블로그, 문서 작성 등에 널리 사용된다.

본 포스팅에서는 기본 구문 / 확장 구문 / 기타 구문으로
3개로 나누어서 진행할 예정이다.

구문 분류	설명
기본 구문	글자 속성에 대한 마크업 구문
확장 구문	마크다운 구문을 기반으로 한 고급 기능
기타 구문	이모지 등 특수한 기능 구현 구문

✅ 기본 구문

기본 구문에서는 글자에 대한 서식으로 이해하면 된다.
굵게, 기울임, 코드, [링크], 목록 등 자주 쓰인다.
적용하는 방법도 간단하기때문에 어렵지않게 사용할수있다.

📌 제목 마크다운 형식

문법 예시 (입력값)
`# 제목 레벨1`
`## 제목 레벨2`
`### 제목 레벨3`
`#### 제목 레벨4`

📌 적용 결과 보기

제목 레벨1

제목 레벨2

제목 레벨3

제목 레벨4

📌 텍스트 스타일

마찬가지로 서식을 적용할 텍스트에만 사용하면 된다.
이 중에서 굵게와 취소선은 개인적으로 자주 사용하게 된다.

**굵게** → 굵게
*기울임* → 기울임
~~취소선~~ → ~~취소선~~
`코드` → 코드

📌 목록

순서 없는 목록 (bullet list)

- 항목1
- 항목2
- 항목3

📌 적용 결과 보기

항목1
항목2
항목3
🔢 순서 있는 목록 (Numbered List)
1 2 3 1. 항목1 2. 항목2 3. 항목3
📌 적용 결과 보기
1. 항목1
2. 항목2
3. 항목3

🔗 링크 및 이미지

마크다운 문법 (입력 예시)	설명
`[GitHub](https://github.com)`	하이퍼링크 생성
`![대체 텍스트](이미지경로.png)`	이미지 삽입
`![side-bar](/assets/img/sidebar.png)`	로컬 이미지 삽입 예시

![side-bar](/assets/img/sidebar.png) 이 부분을 예시로 설명하겠다.
본 포스팅 글의 경로는 /Winebug.github.io/_posts다.
이미지 폴더의 최상위 디렉토리는 /assets이다.

따라서 GitHub Pages에서는 이미지 경로를 항상 루트 경로 기준으로 입력해야 한다.
즉, /_posts에서 상대 경로를 쓰기보다는 아래처럼 절대 경로를 사용하는 것이 가장 안전하다.

![side-bar](/assets/img/sidebar.png)

✅ 링크 예시

링크를 거는 마크다운 문법은 아래와 같다.
텍스트를 대괄호 [ ] 로 감싸고, 링크를 소괄호 ( ) 에 적는다.
이 방식은 이미지 삽입 문법과 구조가 유사하다.

[GitHub](https://github.com)

✅ 이미지 예시

이미지 넣는 방식도 링크와 구조가 똑같다.
다만 앞에 느낌표 ! 만 붙여주면 이미지로 출력된다.
이미지 경로는 정확해야 하고, GitHub에 업로드까지 되어 있어야 화면에 표시된다.

마크다운 문법 : ![side-bar](/assets/img/sidebar.png)

# To be Continued #

Git