코드 비교 도구

두 코드 또는 텍스트를 줄 단위로 비교해 추가·삭제 내용을 표시합니다.

카테고리: 개발자 도구

언제 사용하나요?

코드 수정 전후를 비교하거나, 두 버전의 설정 파일이 어떻게 달라졌는지 확인해야 할 때 사용합니다.

사용 방법

왼쪽에 원본 코드를 붙여넣습니다.
오른쪽에 수정된 코드를 붙여넣습니다.
추가된 줄(초록)과 삭제된 줄(빨강)이 색상으로 구분됩니다.

입력값 안내

비교 기준이 되는 원본 코드를 좌측에, 수정 내역이 있는 변경 코드를 우측에 붙여넣습니다.

계산·변환 기준

두 문자열의 줄(Line) 단위 배열을 생성하고 Myers Diff 등 최소 편집 거리(Levenshtein) 알고리즘을 적용하여 삭제(Deletion), 삽입(Insertion), 유지(Unchanged)된 줄을 구분한 뒤, CSS 클래스를 입혀 하이라이트 UI로 렌더링합니다.

사용 예시

커밋 전후 변경 확인 - git commit 전 수정된 코드를 이전 버전과 나란히 비교해 실수로 바뀐 줄이 없는지 점검합니다.
설정 파일 버전 비교 - nginx, docker-compose, CI 설정 파일의 두 버전 차이를 빠르게 파악합니다.
PR 리뷰 보조 - Pull Request의 주요 변경 함수를 복사해 붙여넣고 변경 범위(추가·삭제 줄 수)를 한눈에 확인합니다.

예시

원본 "A\nB\nC", 수정 "A\nX\nC" → "B" 삭제(빨간색), "X" 추가(초록색)로 라인 단위 차이 표시
커밋 전후 함수 코드를 좌우에 붙여넣어 바뀐 줄만 확인
SQL 마이그레이션 전후 스크립트 비교 → 추가된 컬럼 정의 즉시 확인
구버전·신버전 nginx.conf 비교 → 변경된 server block 줄만 색상 강조
API 응답 JSON 두 버전 비교 → 필드 추가/삭제/수정 항목 한눈에 파악
번역 파일 en.json vs ko.json → 누락된 키·값 쌍 라인 단위로 탐지

주의사항

줄 단위 비교 방식이므로 들여쓰기·공백 차이도 변경으로 표시됩니다. 공백을 무시한 비교가 필요하면 git diff -w 같은 전용 도구를 사용하세요.
입력한 코드는 브라우저 내에서만 처리되며 외부 서버로 전송되지 않습니다.

계산·사용 가이드

줄 단위 비교

두 코드나 텍스트를 줄 단위로 비교해 추가, 삭제, 변경 흐름을 확인합니다. 작은 문구 수정이나 설정 파일 차이를 볼 때 유용합니다.

포매팅 후 비교

JSON, HTML, CSS, SQL처럼 구조가 있는 코드는 먼저 포매팅한 뒤 비교하면 실제 변경 내용을 더 쉽게 볼 수 있습니다.

자주 묻는 질문

비교 기준은 무엇인가요?

줄 단위 diff를 기준으로 추가(초록)와 삭제(빨강)를 색상으로 구분합니다. Myers Diff 알고리즘을 사용해 두 텍스트 간의 최소 편집 거리를 계산하여 정확한 변경점을 보여줍니다.

비교할 코드가 외부로 전송되나요?

아니요. 두 텍스트 비교는 브라우저 안에서만 처리되어 코드가 외부 서버로 전송되거나 저장되지 않습니다. 내부 소스 코드나 비공개 설정 파일도 안심하고 비교할 수 있습니다.

추가·삭제 줄 수를 알 수 있나요?

추가된 줄과 삭제된 줄의 개수를 함께 집계해 변경 규모를 한눈에 보여 줍니다. 코드 리뷰나 PR 작성 시 변경 범위를 빠르게 파악하는 데 유용합니다.

공백 차이도 다른 것으로 표시되나요?

기본적으로 줄 단위로 비교하므로 줄 끝 공백이나 들여쓰기 차이도 변경으로 표시될 수 있습니다. 공백을 무시한 비교가 필요하면 git diff -w 옵션이나 IDE 내장 diff 도구를 사용하는 것을 권장합니다.

매우 긴 파일도 비교할 수 있나요?

별도 줄 수 제한은 없지만, 매우 긴 코드(수천 줄 이상)를 비교하면 브라우저 처리 속도가 느려질 수 있습니다. 일반적인 함수, 컴포넌트, 설정 파일 수준의 코드는 문제없이 비교됩니다.