panphora/overtype

어떤 프로젝트인가요?

핵심 기능

• 01보이지 않는 textarea 오버레이로 입력한 텍스트를 스타일이 적용된 미리보기와 정렬합니다.
• 02굵게, 기울임꼴, 코드, 링크, 제목, 목록, 작업 목록, 인용문 버튼이 있는 선택형 툴바를 제공합니다.
• 03Cmd/Ctrl+B, Cmd/Ctrl+K 등의 키보드 단축키와 GitHub 스타일의 목록 이어쓰기를 지원합니다.
• 04Solar 및 Cave 테마와 사용자 지정 색상 테마를 지원합니다.
• 05정리된 HTML 또는 렌더링된 HTML을 내보내며, 독립형 마크다운 파서를 제공합니다.
• 06npm 패키지, CDN 스크립트 또는 Web Component로 사용할 수 있습니다.

활용 사례

• 빌드 단계 없이 웹 폼이나 댓글 입력란에 경량 마크다운 입력 기능을 추가할 때.
• 단일 파일 웹 앱에 메모 또는 문서 편집기를 만들 때.
• 모바일 키보드 지원이 중요한 페이지에 마크다운 편집기를 삽입할 때.
• 독립형 파서를 사용해 서버에서 마크다운을 HTML로 렌더링할 때.

빠른 시작

1. 1

   npm에서 패키지를 설치합니다

   npm install overtype
2. 2

   OverType을 가져와 컨테이너 요소에 에디터를 생성합니다

   import OverType from 'overtype'; const [editor] = new OverType('#editor', { value: '# Hello' });

토픽

자주 묻는 질문

overtype은(는) 무엇인가요?

스타일이 적용된 미리보기 텍스트 위에 보이지 않는 textarea를 겹쳐 표시하는 경량 JavaScript 마크다운 편집기로, 선택형 툴바를 제공하며 프레임워크에 의존하지 않습니다. OverType는 입력에는 기본 textarea를 사용하고 그 아래에 스타일이 적용된 미리보기를 그리는 마크다운 편집기 라이브러리입니다. textarea는 투명하고 미리보기는 같은 고정폭 레이아웃을 사용하므로, 입력한 텍스트가 렌더링된 결과와 맞춰 표시되고 마크다운 문법 문자는 그대로 보입니다.

overtype은(는) 무료로 사용할 수 있나요? 라이선스는 무엇인가요?

overtype은(는) MIT 라이선스의 오픈소스입니다. 상업용 제품에 사용하기 전에 라이선스 조건을 확인하세요.

overtype은(는) 아직 유지보수되고 있나요?

활발히 유지보수 중. overtype의 마지막 커밋은 2026년 10월 10일입니다.

overtype은(는) 어디에 사용할 수 있나요?

빌드 단계 없이 웹 폼이나 댓글 입력란에 경량 마크다운 입력 기능을 추가할 때. 단일 파일 웹 앱에 메모 또는 문서 편집기를 만들 때. 모바일 키보드 지원이 중요한 페이지에 마크다운 편집기를 삽입할 때. 독립형 파서를 사용해 서버에서 마크다운을 HTML로 렌더링할 때.

overtype는 어떻게 설치하나요?

npm에서 패키지를 설치합니다: npm install overtype OverType을 가져와 컨테이너 요소에 에디터를 생성합니다: import OverType from 'overtype'; const [editor] = new OverType('#editor', { value: '# Hello' });

overtype은(는) 어디서 받을 수 있나요?

소스 코드와 설치 방법은 GitHub에 있습니다: https://github.com/panphora/overtype