본문으로 건너뛰기

DHTMLX Scheduler 개요

DHTMLX Scheduler는 TypeScript 정의를 포함한高度한 구성 가능한 JavaScript 이벤트 캘린더 컴포넌트입니다. 브라우저에서 일정 표시, 편집 및 관리를 직접 수행하도록 설계되었습니다. 이 컴포넌트는 React, Angular, Vue 및 기타 프런트엔드 프레임워크와의 통합을 지원합니다. DHTMLX Scheduler는 또한 DHTMLX MCP Server, Agent Skills를 통한 AI 보조 개발과 구조화된 API를 지원합니다.

다음과 같은 프로젝트 관리, CRM, 예약 시스템, 헬스케어, 교육, 현장 서비스, SaaS 및 상호 작용 캘린더, 이벤트 플래너 또는 자원 스케줄링 타임라인이 필요한 비즈니스 애플리케이션에서 사용할 수 있습니다.

프레임워크별 빠른 시작​

DHTMLX Scheduler를 바닐라 JavaScript 위젯으로 사용하거나 현대 프레임워크에 통합할 수 있습니다. 스택에 맞는 단계별 가이드로 시작해 보세요:

javascript
자바스크립트
react
리액트
angular
앵귤러
vue
뷰
svelte
스벨트
salesforce
세일즈포스

React, Angular 및 Vue는 두 가지 통합 방식으로 지원됩니다:

라이브 데모​

실행 중인 DHTMLX Scheduler를 확인하려면 가장 인기 있는 데모 중 일부를 살펴보세요:

scheduler_overview

전체 Scheduler 기능 범위를 확인하려면 All Samples을 보세요.

프레임워크 지향 시작 포인트의 경우, React, Angular, 및 Vue의 예제 저장소를 참조하십시오.

노트

일部 샘플은 PRO 기능을 보여주므로 Standard 에디션 프로젝트에 재사용하기 전에 Standard vs PRO 비교를 확인하십시오.

개발자 리소스​

Scheduler 기능 하이라이트​

DHTMLX Scheduler에는 다중 달력 보기, 풍부한 이벤트 편집 및 자원 계획 도구가 포함되어 있습니다.

달력 뷰 및 내비게이션​

기본적으로 Scheduler는 클래식 달력 뷰를 렌더링하고 사용자가 시간을 통해 이동할 수 있도록 합니다. 포함되는 기능은 다음과 같습니다:

이벤트 생성 및 편집​

이 컴포넌트는 "캘린더 우선(Calendar-first)" 편집을 제공하므로 사용자는 달력에서 바로 이벤트를 빠르게 생성하거나 업데이트할 수 있습니다:

반복 시퀀스 및 예외​

반복 이벤트는 전용 확장 및 iCalendar 호환 RFC 5545 재발생 형식을 통해 지원됩니다:

자원 계획 뷰 (PRO)​

단순 달력 이상이 필요한 팀을 위해 DHTMLX Scheduler의 PRO 에디션은 고급 계획 모드를 제공합니다:

내보내기 및 생태계​

팀은 종종 일정을 공유하거나 로컬 백업을 보관하거나 외부 달력과 동기화해야 합니다. DHTMLX Scheduler는 외부 도구 및 출력 형식을 지원하여 다음과 같이 통합합니다:

커스터마이제이션 및 스타일링​

달력의 외관은 전체 테마에서 단일 이벤트 상자에 이르기까지 모든 수준에서 조정할 수 있습니다:

에디션 및 라이선스​

DHTMLX Scheduler는 두 가지 에디션: Standard 및 PRO로 제공됩니다. 무료 Standard 에디션으로 시작하고 필요에 따라 나중에 PRO 에디션으로 업그레이드할 수 있으며, 더 많은 기능과 공식 지원, 완전한 Scheduler 기반을 이용할 수 있습니다. 또한 공식 체험을 통해 또는 유료 라이선스와 함께 PRO 에디션을 바로 시작할 수도 있습니다. 아래의 옵션 중 하나를 선택하여 DHTMLX Scheduler를 시작하세요:

  • Standard edition. 공개 패키지 소스(npm, CDN)를 통해 배포되며 핵심 대화형 달력 기능을 포함합니다.
  • Official trial. 전체 PRO 기능 세트를 평가하고 체험 기간 동안 기술 지원을 받을 수 있습니다.
  • PRO edition. 운영 환경에 맞춰 설계되었으며 고급 일정 기능, 공식 지원 및 상용 라이선스가 포함됩니다. 개인 npm 레지스트리에서 설치되거나 수동으로 추가됩니다.

에디션 간 기능 차이점을 정확히 확인하려면 Standard vs PRO 비교를 확인하세요. 각 옵션의 설치 흐름은 설치 가이드를 참조하십시오.

노트

Standard 에디션은 GNU GPL v2 라이선스에 한해 제공됩니다. 비-GPL 프로젝트에서 DHTMLX Scheduler를 사용하거나 PRO 버전을 얻으려면 당사 사이트에서 Individual, Commercial, Enterprise, Ultimate 또는 Startup 라이선스를 구입하시거나 sales@dhtmlx.com으로 문의해 주세요.

AI 코딩 도구​

AI 보조 개발을 위해, 코딩 도우미를 위해 특별히 작성된 DHTMLX Scheduler 가이드를 시작점으로 삼으세요:

백엔드 통합​

DHTMLX Scheduler는 서버에서 RESTful API를 구현하여 어떤 백엔드와도 연결할 수 있습니다:

  • 데이터는 일반적으로 events 및 해당 recurrence rules를 JSON 형식으로 로드하고 저장합니다.
  • 내장 DataProcessor가 생성, 업데이트 및 삭제 작업을 서버로 라우팅하는 데 도움을 줍니다.
  • CRUD 작업 및 Scheduler를 데이터베이스와 동기화하는 모범 사례를 다루는 인기 있는 백엔드 플랫폼 및 프레임워크에 대한 튜토리얼이 있습니다(Node.js, ASP.NET Core, Laravel, Ruby on Rails 등).

What's next​

시작이 막 되었다면 다음과 같이 진행하세요:

  1. 선호하는 프런트엔드 프레임워크나 일반 자바스크립트를 위한 시작 가이드를 참조하세요.
  2. 헤더, 뷰, 템플릿 및 편집 동작을 Lightbox를 통해 구성하세요.
  3. 필요한 확장을 활성화하세요. 예: Recurring events, PRO의 Timeline/Units, Quick Info, Tooltips.
  4. 백엔드에 연결하고 Server-Side Integration 및 이벤트용 애플리케이션 엔드포인트를 설정하세요.
  5. Guides 및 API reference를 탐색하여 템플릿, 이벤트 및 확장 기능과 같은 더 깊은 맞춤화를 찾으세요.

이미 DHTMLX Scheduler를 사용 중이고 이전 버전에서 업그레이드 중이라면, 릴리스 노트와 최신 기능 요약 및 마이그레이션 가이드에 대한 내용을 확인하려면 What's New를 보세요.

Need help?
Got a question about the documentation? Reach out to our technical support team for help and guidance. For custom component solutions, visit the Services page.
Need more help?Contact Support