hwan log 블로그 운영 가이드

로컬 서버 실행

bundle exec jekyll serve --port 4001

브라우저에서 http://localhost:4001 접속

빠른 빌드 (새 파일 추가할 땐 비추):

bundle exec jekyll serve --port 4001 --incremental

포스트 작성

_posts/ 폴더에 파일 생성. 파일명 규칙 필수:

YYYY-MM-DD-제목.md

예시: 2024-03-15-my-first-post.md

포스트 상단 front matter (필수)

---
layout: post
title: 포스트 제목
categories: [algorithm]
tags: [dp, 정렬]
description: 검색엔진에 표시될 짧은 설명 (~150자)
---

카테고리는 URL에 포함됨 → /algorithm/포스트제목/
태그는 URL에 미포함

카테고리 추가

_featured_categories/ 폴더에 카테고리명.md 파일 생성:

---
layout: list
title: Algorithm
slug: algorithm
description: 알고리즘 풀이 모음
---

_config.yml의 menu에도 추가:

menu:
  - title: ALGORITHM
    url: /algorithm/

마크다운 특수 문법

목차 자동 생성

* 목차
{:toc}

노트 박스

이것은 노트입니다.
{:.note}

커스텀 제목 노트
{:.note title="주의"}

큰 텍스트

강조할 내용
{:.lead}

흐린 텍스트

부가 설명
{:.faded}

코드 블록 (파일명 표시)

```js
// file: "example.js"
const hello = "world";
```

수식 (인라인)

$$ f(x) = x^2 $$

수식 (블록)

$$
\begin{aligned}
  y = x^2
\end{aligned}
$$

이미지 삽입

기본:

![설명](이미지경로)

전체 너비 + 지연로딩:

![설명](/assets/img/example.jpg){:.lead width="800" height="400" loading="lazy"}

이미지 캡션:

![설명](/assets/img/example.jpg){:.lead width="800" height="400" loading="lazy"}

이미지 설명 텍스트
{:.figcaption}

표

| 제목1 | 제목2 | 제목3 |
|-------|:-----:|------:|
| 왼쪽  | 가운데 | 오른쪽 |

작은 글씨 표: {:.smaller} 추가
스크롤 표: {:.scroll-table} 추가

프로젝트 페이지

_projects/ 폴더에 파일 생성:

---
layout: project
title: 프로젝트 이름
date: 2024-01-01
image:
  path: /assets/img/projects/example.jpg
caption: 짧은 설명
description: 상세 설명
links:
  - title: GitHub
    url: https://github.com/JeonghwanY/...
---

주요 설정 파일 위치

파일역할
_config.yml블로그 전체 설정 (제목, 메뉴, 색상 등)
_data/authors.yml작성자 정보, 프로필, SNS
_sass/my-style.scss커스텀 CSS
_sass/my-variables.scss색상/폰트 변수 커스텀
assets/img/이미지 저장 위치
_featured_categories/카테고리 페이지

© 2022 JeongHwan Yun.