🔐로그인하면 문서 작성, 프로젝트 게시, ZIP 기반 버전 업로드, 브랜치 생성 기능을 사용할 수 있습니다. 로그인하러 가기
비교 대상 선택
추가 0줄 삭제 0줄 변경 0줄 동일 74줄
r1 파일 가져오기: 00-overview-macro-guide.md
2026-04-17 14:54

프로젝트 개요

T2Editor는 그누보드5를 비롯한 다양한 PHP 기반 웹 환경에서 사용할 수 있도록 설계된 WYSIWYG 에디터입니다. 모바일 최적화와 직관적인 UI를 제공하며, 플러그인 아키텍처를 통해 쉽게 기능을 확장할 수 있습니다. 본 거시적 안내서는 에디터의 전체 구조, 데이터 흐름, 이벤트 흐름, 주요 기능군을 한눈에 이해할 수 있도록 구성되어 있습니다.

전체 디렉터리 맵

에디터는 루트 디렉터리 아래 여러 서브 디렉터리로 구성되어 있습니다:

  • config: 설정 파일과 API 구성을 포함합니다.
  • js: 에디터의 핵심 로직과 유틸리티 함수들이 위치합니다.
  • css: 기본 스타일과 테마를 정의합니다.
  • plugin: 모든 확장 기능을 제공하는 플러그인들이 저장되어 있습니다.
  • data: 업로드된 파일과 임시 데이터가 저장됩니다.
  • collab: 협업 기능을 위한 저장소입니다.
  • fonts: Material Icons 등 폰트 파일을 저장합니다.

기능군 맵

T2Editor는 여러 기능군으로 나눌 수 있습니다:

  • 텍스트 서식: 폰트 크기, 볼드, 기울임, 밑줄, 취소선, 정렬, 색상 및 배경색 지정.
  • 미디어 삽입: 이미지, 동영상, 파일 업로드 및 미리보기 지원.
  • 테이블 및 코드: 표 삽입 및 편집 도구, 코드 블록 삽입 기능.
  • 검색 및 AI: 에디터 내 검색과 T2Search API 연동, AI 콘텐츠 생성 및 편집 기능.
  • 추가 도구: 링크 삽입, 단축 링크/QR코드 생성, 그림 그리기, 협업 기능, HTML 내보내기 등.

데이터 흐름 및 이벤트 흐름

에디터는 사용자의 입력 이벤트를 받아 편집 영역을 업데이트하고, 필요한 경우 서버와 통신합니다.

  • 입력 이벤트: 키보드 및 마우스 입력은 js/core.js에서 처리됩니다.
  • 플러그인 이벤트: 각 플러그인은 자신의 이벤트 리스너를 등록하여 특정 명령을 수행합니다.
  • 저장 및 불러오기: 컨텐츠는 주기적으로 자동 저장되며, 서버의 data 디렉터리에 저장됩니다.

추천 읽기 순서

  • 초보자와 웹마스터: 먼저 설치 방법, 사용 방법, 기능 소개를 읽은 후 각 플러그인 문서를 참조하세요.
  • 개발자: core 파일 문서와 플러그인 개발 가이드를 읽고, UI 및 이벤트 흐름 문서로 넘어가세요.

참고 자료

r1 파일 가져오기: 00-overview-macro-guide.md
2026-04-17 14:54

프로젝트 개요

T2Editor는 그누보드5를 비롯한 다양한 PHP 기반 웹 환경에서 사용할 수 있도록 설계된 WYSIWYG 에디터입니다. 모바일 최적화와 직관적인 UI를 제공하며, 플러그인 아키텍처를 통해 쉽게 기능을 확장할 수 있습니다. 본 거시적 안내서는 에디터의 전체 구조, 데이터 흐름, 이벤트 흐름, 주요 기능군을 한눈에 이해할 수 있도록 구성되어 있습니다.

전체 디렉터리 맵

에디터는 루트 디렉터리 아래 여러 서브 디렉터리로 구성되어 있습니다:

  • config: 설정 파일과 API 구성을 포함합니다.
  • js: 에디터의 핵심 로직과 유틸리티 함수들이 위치합니다.
  • css: 기본 스타일과 테마를 정의합니다.
  • plugin: 모든 확장 기능을 제공하는 플러그인들이 저장되어 있습니다.
  • data: 업로드된 파일과 임시 데이터가 저장됩니다.
  • collab: 협업 기능을 위한 저장소입니다.
  • fonts: Material Icons 등 폰트 파일을 저장합니다.

기능군 맵

T2Editor는 여러 기능군으로 나눌 수 있습니다:

  • 텍스트 서식: 폰트 크기, 볼드, 기울임, 밑줄, 취소선, 정렬, 색상 및 배경색 지정.
  • 미디어 삽입: 이미지, 동영상, 파일 업로드 및 미리보기 지원.
  • 테이블 및 코드: 표 삽입 및 편집 도구, 코드 블록 삽입 기능.
  • 검색 및 AI: 에디터 내 검색과 T2Search API 연동, AI 콘텐츠 생성 및 편집 기능.
  • 추가 도구: 링크 삽입, 단축 링크/QR코드 생성, 그림 그리기, 협업 기능, HTML 내보내기 등.

데이터 흐름 및 이벤트 흐름

에디터는 사용자의 입력 이벤트를 받아 편집 영역을 업데이트하고, 필요한 경우 서버와 통신합니다.

  • 입력 이벤트: 키보드 및 마우스 입력은 js/core.js에서 처리됩니다.
  • 플러그인 이벤트: 각 플러그인은 자신의 이벤트 리스너를 등록하여 특정 명령을 수행합니다.
  • 저장 및 불러오기: 컨텐츠는 주기적으로 자동 저장되며, 서버의 data 디렉터리에 저장됩니다.

추천 읽기 순서

  • 초보자와 웹마스터: 먼저 설치 방법, 사용 방법, 기능 소개를 읽은 후 각 플러그인 문서를 참조하세요.
  • 개발자: core 파일 문서와 플러그인 개발 가이드를 읽고, UI 및 이벤트 흐름 문서로 넘어가세요.

참고 자료

라인 단위 비교
이전 새 버전
1 --- 1 ---
2 title: T2Editor 거시적 안내서 2 title: T2Editor 거시적 안내서
3 document_id: 00-overview-macro-guide 3 document_id: 00-overview-macro-guide
4 slug: 00-overview-macro-guide 4 slug: 00-overview-macro-guide
5 target_editor_version: 9.0.0 5 target_editor_version: 9.0.0
6 document_type: overview 6 document_type: overview
7 doc_type: overview 7 doc_type: overview
8 target_readers: [초보자, 웹마스터, 개발자, AI agent] 8 target_readers: [초보자, 웹마스터, 개발자, AI agent]
9 importance: High 9 importance: High
10 dependency: Medium 10 dependency: Medium
11 core_type: Overview 11 core_type: Overview
12 stability: [Version-Bound] 12 stability: [Version-Bound]
13 stable_anchor: [] 13 stable_anchor: []
14 version_bound: [] 14 version_bound: []
15 related_docs: [] 15 related_docs: []
16 related_files: [] 16 related_files: []
17 related_functions: [] 17 related_functions: []
18 related_classes_modules: [] 18 related_classes_modules: []
19 related_features: [] 19 related_features: []
20 related_ui: [] 20 related_ui: []
21 change_risk: 수정 범위를 넓게 잡으면 관련 기능과 문서 흐름에 영향이 생길 수 있습니다. 21 change_risk: 수정 범위를 넓게 잡으면 관련 기능과 문서 흐름에 영향이 생길 수 있습니다.
22 reading_order: 01 22 reading_order: 01
23 summary: 에디터 전체 구조와 주요 기능을 설명하는 거시적 안내서 문서 23 summary: 에디터 전체 구조와 주요 기능을 설명하는 거시적 안내서 문서
24 description: 에디터 전체 구조와 주요 기능을 설명하는 거시적 안내서 24 description: 에디터 전체 구조와 주요 기능을 설명하는 거시적 안내서
25 tags: [overview, macro, T2Editor] 25 tags: [overview, macro, T2Editor]
26 version_tag: 9.0.0 26 version_tag: 9.0.0
27 maintenance_difficulty: Medium 27 maintenance_difficulty: Medium
28 test_requirement: Medium 28 test_requirement: Medium
29 ai_agent_risk: Medium 29 ai_agent_risk: Medium
30 source_basis: [현재 코드 분석 기반, 웹 참고 자료 기반] 30 source_basis: [현재 코드 분석 기반, 웹 참고 자료 기반]
31 beginner_section_included: true 31 beginner_section_included: true
32 webmaster_section_included: true 32 webmaster_section_included: true
33 developer_section_included: true 33 developer_section_included: true
34 --- 34 ---
35 ## 프로젝트 개요 35 ## 프로젝트 개요
36   36  
37 T2Editor는 그누보드5를 비롯한 다양한 PHP 기반 웹 환경에서 사용할 수 있도록 설계된 WYSIWYG 에디터입니다. 모바일 최적화와 직관적인 UI를 제공하며, 플러그인 아키텍처를 통해 쉽게 기능을 확장할 수 있습니다. 본 거시적 안내서는 에디터의 전체 구조, 데이터 흐름, 이벤트 흐름, 주요 기능군을 한눈에 이해할 수 있도록 구성되어 있습니다. 37 T2Editor는 그누보드5를 비롯한 다양한 PHP 기반 웹 환경에서 사용할 수 있도록 설계된 WYSIWYG 에디터입니다. 모바일 최적화와 직관적인 UI를 제공하며, 플러그인 아키텍처를 통해 쉽게 기능을 확장할 수 있습니다. 본 거시적 안내서는 에디터의 전체 구조, 데이터 흐름, 이벤트 흐름, 주요 기능군을 한눈에 이해할 수 있도록 구성되어 있습니다.
38   38  
39 ## 전체 디렉터리 맵 39 ## 전체 디렉터리 맵
40   40  
41 에디터는 루트 디렉터리 아래 여러 서브 디렉터리로 구성되어 있습니다: 41 에디터는 루트 디렉터리 아래 여러 서브 디렉터리로 구성되어 있습니다:
42 - **config**: 설정 파일과 API 구성을 포함합니다. 42 - **config**: 설정 파일과 API 구성을 포함합니다.
43 - **js**: 에디터의 핵심 로직과 유틸리티 함수들이 위치합니다. 43 - **js**: 에디터의 핵심 로직과 유틸리티 함수들이 위치합니다.
44 - **css**: 기본 스타일과 테마를 정의합니다. 44 - **css**: 기본 스타일과 테마를 정의합니다.
45 - **plugin**: 모든 확장 기능을 제공하는 플러그인들이 저장되어 있습니다. 45 - **plugin**: 모든 확장 기능을 제공하는 플러그인들이 저장되어 있습니다.
46 - **data**: 업로드된 파일과 임시 데이터가 저장됩니다. 46 - **data**: 업로드된 파일과 임시 데이터가 저장됩니다.
47 - **collab**: 협업 기능을 위한 저장소입니다. 47 - **collab**: 협업 기능을 위한 저장소입니다.
48 - **fonts**: Material Icons 등 폰트 파일을 저장합니다. 48 - **fonts**: Material Icons 등 폰트 파일을 저장합니다.
49   49  
50 ## 기능군 맵 50 ## 기능군 맵
51   51  
52 T2Editor는 여러 기능군으로 나눌 수 있습니다: 52 T2Editor는 여러 기능군으로 나눌 수 있습니다:
53 - **텍스트 서식**: 폰트 크기, 볼드, 기울임, 밑줄, 취소선, 정렬, 색상 및 배경색 지정. 53 - **텍스트 서식**: 폰트 크기, 볼드, 기울임, 밑줄, 취소선, 정렬, 색상 및 배경색 지정.
54 - **미디어 삽입**: 이미지, 동영상, 파일 업로드 및 미리보기 지원. 54 - **미디어 삽입**: 이미지, 동영상, 파일 업로드 및 미리보기 지원.
55 - **테이블 및 코드**: 표 삽입 및 편집 도구, 코드 블록 삽입 기능. 55 - **테이블 및 코드**: 표 삽입 및 편집 도구, 코드 블록 삽입 기능.
56 - **검색 및 AI**: 에디터 내 검색과 T2Search API 연동, AI 콘텐츠 생성 및 편집 기능. 56 - **검색 및 AI**: 에디터 내 검색과 T2Search API 연동, AI 콘텐츠 생성 및 편집 기능.
57 - **추가 도구**: 링크 삽입, 단축 링크/QR코드 생성, 그림 그리기, 협업 기능, HTML 내보내기 등. 57 - **추가 도구**: 링크 삽입, 단축 링크/QR코드 생성, 그림 그리기, 협업 기능, HTML 내보내기 등.
58   58  
59 ## 데이터 흐름 및 이벤트 흐름 59 ## 데이터 흐름 및 이벤트 흐름
60   60  
61 에디터는 사용자의 입력 이벤트를 받아 편집 영역을 업데이트하고, 필요한 경우 서버와 통신합니다. 61 에디터는 사용자의 입력 이벤트를 받아 편집 영역을 업데이트하고, 필요한 경우 서버와 통신합니다.
62 - **입력 이벤트**: 키보드 및 마우스 입력은 js/core.js에서 처리됩니다. 62 - **입력 이벤트**: 키보드 및 마우스 입력은 js/core.js에서 처리됩니다.
63 - **플러그인 이벤트**: 각 플러그인은 자신의 이벤트 리스너를 등록하여 특정 명령을 수행합니다. 63 - **플러그인 이벤트**: 각 플러그인은 자신의 이벤트 리스너를 등록하여 특정 명령을 수행합니다.
64 - **저장 및 불러오기**: 컨텐츠는 주기적으로 자동 저장되며, 서버의 data 디렉터리에 저장됩니다. 64 - **저장 및 불러오기**: 컨텐츠는 주기적으로 자동 저장되며, 서버의 data 디렉터리에 저장됩니다.
65   65  
66 ## 추천 읽기 순서 66 ## 추천 읽기 순서
67   67  
68 - 초보자와 웹마스터: 먼저 설치 방법, 사용 방법, 기능 소개를 읽은 후 각 플러그인 문서를 참조하세요. 68 - 초보자와 웹마스터: 먼저 설치 방법, 사용 방법, 기능 소개를 읽은 후 각 플러그인 문서를 참조하세요.
69 - 개발자: core 파일 문서와 플러그인 개발 가이드를 읽고, UI 및 이벤트 흐름 문서로 넘어가세요. 69 - 개발자: core 파일 문서와 플러그인 개발 가이드를 읽고, UI 및 이벤트 흐름 문서로 넘어가세요.
70   70  
71 ## 참고 자료 71 ## 참고 자료
72   72  
73 - 기능 목록 및 버전 히스토리: [DSclub T2Editor 서비스 페이지](https://dsclub.kr/service/editor) 73 - 기능 목록 및 버전 히스토리: [DSclub T2Editor 서비스 페이지](https://dsclub.kr/service/editor)
74 - 설치 방법과 오류 대처: [DSclub T2Editor 서비스 페이지 - 설치·오류 안내](https://dsclub.kr/service/editor) 74 - 설치 방법과 오류 대처: [DSclub T2Editor 서비스 페이지 - 설치·오류 안내](https://dsclub.kr/service/editor)
T2WIKI · 기술 통합 위키 & 프로젝트 허브 · 나무위키 + Markdown 완벽 지원 · SQLite · PHP 8.2 · 소개 · 문법 안내