텍스트 비교기 (Text Diff Checker)

두 텍스트(전/후)의 다른 부분을 색으로 비교하는 무료 온라인 Diff 비교기. 모든 처리는 브라우저 안에서만 이루어지며 어떤 데이터도 서버로 전송되지 않습니다.

🔗 바로 쓰기: https://hanariago.github.io/tool-diff-checker/

기능

• 전 / 후 / 비교 3영역 구조 — 직접 입력 또는 파일 불러오기(드래그앤드롭), 편집 가능
• 추가/삭제/변경을 색으로 구분, 변경된 줄은 바뀐 단어만 추가 강조
• 보기 모드: 나란히(side-by-side) / 한 줄로(unified)
• 비교 단위: 줄 / 단어 / 글자
• 옵션: 공백 무시 · 대소문자 무시 · 자동 비교(실시간)
• 찾기 & 일괄 치환 (Ctrl/Cmd + F) — 전/후/전+후 대상, 대소문자 구분 · 전체 단어 · 정규식(캡처 그룹 $1 치환)
• 결과 복사 / 다운로드(diff-result.txt)
• 한국어 / English (?lang=ko · ?lang=en · 자동 감지 · 토글)
• 라이트/다크 테마, 입력값·설정 자동 저장(localStorage), 모바일 반응형
• 단축키: Ctrl/Cmd + Enter 비교 · Ctrl/Cmd + F 찾기 · Esc 닫기

기술 스택

• 순수 HTML/CSS/JS — 단일 index.html, 외부 라이브러리·빌드 없음
• 자체 구현 LCS 기반 diff 엔진 (공통 접두/접미 제거 후 가운데 구간만 동적계획법으로 비교)
• 서버 전송 없음 (브라우저에서만 동작)

사용한 오픈소스 / 에셋

• 없음 — 모든 코드(diff 엔진 포함) 자체 작성. 외부 라이브러리·폰트·아이콘·이미지 미사용 (이모지 글리프는 시스템 폰트 사용).

파일 구성

tool-diff-checker/
├── index.html      ← 본체 (스타일·스크립트 인라인, 단일 파일)
├── robots.txt      ← 크롤러 허용 + sitemap 경로
├── sitemap.xml     ← 대표 URL + hreflang
├── llms.txt        ← AI 검색용 요약 (AEO)
├── README.md
└── LICENSE         ← MIT

로컬에서 실행

별도 빌드가 필요 없습니다. index.html 을 브라우저로 열거나:

python -m http.server 8000   # http://localhost:8000

GitHub Pages 배포

Public repo로 push → Settings → Pages → Source: Deploy from a branch → main / (root) → 저장. .nojekyll 가 포함되어 정적 파일이 그대로 서빙됩니다.

---

Made by Lena · License: MIT