<
New: React Scheduler from DHTMLX with Redux, TypeScript & MUI Support
Download
DHTMLX Scheduler
React

DHTMLX React Scheduler - High-Performance Scheduling for React Apps

Our multi-featured React JS scheduler delivers
an extensible architecture, clean UI, and
dynamic loading - all optimized for performing
in enterprise-grade React apps.

Get free trial
View docs
Get free trial
View docs
Deployment covered
with every license.
100+ awards
No fees on the number
of Scheduler end-users in React
cloud-based apps.
NCI
Deutsche Bank
Siemens
Apple
Airbus
Embraer
Hilton
Tele2
Aprika
FedEx
GanttPro
Oracle
Amazon
Accenture
IBM
Cisco
Intel
Nasa
ABB
Capgemini
BBC News
NCI
Deutsche Bank
Siemens
Apple
Airbus
Embraer
Hilton
Tele2
Aprika
FedEx
GanttPro
Oracle
Amazon
Accenture
IBM
Cisco
Intel
Nasa
ABB
Capgemini
BBC News

React Scheduler Key Features

Timeline view
Recurring and multisection events
Units view
Dynamic and configurable UI/UX
Customization with React components
Redux Toolkit integration
Export to PDF, PNG, Excel, and iCal
Flexible theming and integration with MUI
Timeline view
You can set default calendar views, including Day, Week, Month, and List, and configure their appearance. The Timeline view, commonly used in timeline scheduler React solutions, features a horizontal time scale aligned with vertical resource sections. It supports custom HTML templates for the content of cells in all modes.
Recurring and multisection events
Our React scheduling component supports recurring and multisection events with flexible repeat rules (daily, weekly, monthly, or custom). The React Scheduler with recurring events ensures smooth handling of exceptions. Whether you're managing team workflow or planning appointments, DHTMLX Scheduler handles automatic adjustments and conflict detection across all calendar views.
Units view
Ideal for multi-resource scheduling React scenarios, the Units layout displays multiple columns representing resources and is often used for team planning, healthcare appointments, and equipment allocation. It includes full React drag-and-drop schedule support, dynamic resource updates, and custom templates.
Dynamic and configurable UI/UX
Every element of your React Scheduler can be configured via dedicated props, including view modes, date formats, event rendering, and behavior options. In our React appointment scheduler, new props can be applied dynamically to update the UI without reloading or re-initializing the component. This makes it easy to respond to user interactions or context changes while keeping your code modular and React-friendly.
Customization with React components
DHTMLX Scheduler is a customizable React Scheduler component. You can modify event templates, tooltips, and lightbox forms using custom React components, replacing default UI elements with tailored interfaces through simple property changes, without requiring direct DOM manipulations. This approach fits perfectly into an enterprise-ready React scheduler designed for complex, business-specific workflows.
Redux Toolkit integration
You can connect the React Scheduler to Redux Toolkit to manage event collections, interface state, and filtering rules. Thanks to React Scheduler with Redux integration, updates in the Redux store automatically propagate to the UI through its declarative props. This helps create scalable, maintainable scheduling solutions aligned with your application’s state architecture.
Export to PDF, PNG, Excel, and iCal
You can export React Scheduler events to PDF or Excel for easier sharing and integration with external tools. DHTMLX Scheduler supports multiple export formats, including PNG and iCal, accessible via the built-in export API or online services.
Flexible theming and integration with MUI
DHTMLX Scheduler offers multiple built-in themes out of the box and supports runtime theming via the skin prop. These themes facilitate customization through CSS variables, allowing you to adjust colors, fonts, and other stylistic elements across the entire application with minimal modifications to the source code. Seamless integration of React Scheduler with MUI components ensures your scheduling calendar matches the rest of your UI.
Get free trial

How to Create and Use React Scheduler

Click to copy
Click to copy
Click to copy
Click to copy
Set up a powerful React Scheduler

The dedicated DHTMLX React Scheduler NPM package simplifies installation and ensures a smooth integration process. Created to work seamlessly with React 18 and higher, the Scheduler component uses native React props and state to manage configurations and data. Under the hood, the React wrapper connects with a standard DHTMLX Scheduler instance, automatically mapping props like events and settings into the proper Scheduler structures.

How to create a scheduler in React
Click to copy
Integrate React Scheduler with Redux

Using Redux with DHTMLX React Scheduler helps centralize your app’s state management, ensuring clear data flow and smooth UI behavior. When event data is modified, you simply dispatch an action to update Redux, and the Scheduler re-renders accordingly. React Scheduler with Redux integration simplifies managing complex interactions and data dependencies, especially when multiple parts of your app need to respond to the same data.

Click to copy
Benefit from full support for JSX & TSX

React Scheduler includes comprehensive type definitions, making it a solid choice for TypeScript-based projects. Thanks to JSX and TSX support, you can leverage TypeScript's strong typing alongside React’s declarative syntax to build robust, maintainable Scheduler interfaces. This enhances both development efficiency and code quality, ensuring that your event data and Scheduler props are always correctly aligned.

DHTMLX Scheduler Use Cases

React Scheduler for a custom ERP system
By integrating a React Scheduler, the platform delivers an interactive way to allocate work, visualize capacity, and streamline daily planning workflows.
Read the customer story
Modular resource planning solution
A custom resource-planning tool provides powerful scheduling capabilities to help clients across logistics, call centers, and field services visualize and manage workloads with ease.
Read the customer story
Cloud-based employee scheduling app
A workforce platform revamped its UI with a flexible scheduler component to automate float-staff planning and reporting for financial firms.
Read the customer story
Show all stories

Why Choose DHTMLX React Scheduler?

Simple API
Our library offers a simple yet powerful API, giving you full control over the Scheduler’s UX/UI. With the Scheduler API React, you can adjust date formats, localization settings, and any other configuration option you need, thanks to well-documented methods, properties, and events.
Fully customizable
While working with DHTMLX React JS Scheduler, you can change virtually each of its elements, e.g. colors, text content, and scales. It’s also possible to configure a task editing pop-up form to include custom fields. Plus, you can apply custom styles to specific dates or date ranges.
High-performance rendering
DHTMLX React Scheduler is optimized to handle large datasets smoothly, supporting thousands of events without performance drops. Smart rendering, and lightweight DOM updates ensure a fast and responsive experience, even in complex enterprise-grade scheduling scenarios.
Accessibility-compliant React Scheduler
DHTMLX supports WAI-ARIA, high-contrast themes, and intuitive keyboard navigation. The component also functions as a mobile-friendly React Scheduler, delivering smooth touch interactions on all major mobile devices.
Smooth server-side integration
You can use DHTMLX Scheduler with any back-end technology thanks to the simple and efficient implementation of REST API on the server side and our DHTMLX DataProcessor library on the client side.
Get started for free
Download a free 30-day trial version of DHTMLX React Scheduler and test its functionality, accompanied by our professional technical support and multiple guides.
Download a trial

What Customers Say

We've been using DHTMLX Scheduler for 4-5 years as a part of our planning tool called Flexpep. We really like working with Scheduler views, especially the Timeline view. We are also fond of your solution for data exchange between the client and server.
Flexpep
Lukas Dieterle
Founder of the Flexpep project
We use almost every widget from the Suite UI widgets library and a customized version of the JavaScript scheduling component. So, I'm a big fan of DHTMLX. We've been using your components for probably 20 years.
Point Enterprises
David Basri
President of Point Enterprises Inc.
Normally, we don't use big third-party components, but rather try to build them in-house. But the Scheduler component is very fast and has so many configuration options that there is no way we could develop it ourselves within the cost of the license.
X-Interactive
Ate Bontjer
Founder of the X-Interactive company
The documentation helps clarify many aspects of working with the components. But when we face more serious issues, we usually send a request to your support team, and we get very good and helpful responses.
JobSiteForecast LLC
Ray Smalley
President of JobSiteForecast LLC
Interestingly, we also added support for zoom-in and zoom-out on touch devices. It was thanks to the help of excellent support from the DHTMLX team, and it ensured that a dealbreaker for a new clinic signup in Dubai was overcome. We have the inherent confidence that when it comes to the scheduler, there is no competing clinic management software that we cannot win against, as when we run into a wall, the DHTMLX support is there to back us up.
Clinicea
Lalit Surana
CEO and co-founder of the Clinicea platform
Read more testimonials

Simplify medical scheduling with React pre-configured template

We've combined DHTMLX Scheduler and Booking widget to let
patients book and manage appointments online while clinic staff
view and organize schedules in different calendar views.
Explore React doctor scheduling demo

DHTMLX Scheduler Licensing

Commercial
Total: $1299
Buy now
Enterprise
Total: $2899
Buy now
Ultimate
Total: $5799
Buy now
License Terms Read License Agreement Read License Agreement Read License Agreement
Developers 5 20
Projects 1 5
Use in SaaS (unlimited end-users) Upon request for a fee
Use in Salesforce
Source code
Perpetual distribution rights
Support Plan
 Premium Premium Ultimate
Time Period 1 year 1 year 1 year
Updates Major, minor, and maintenance updates Major, minor, and maintenance updates
Major, minor, and maintenance updates
Priority queue for bug fixing
Support requests 30 50
Response time 48h 48h 24h
Personal Account Manager
Functionality
 PRO + 2 add-ons PRO + 2 add-ons PRO + 3 add-ons
9 PRO features
React Scheduler
Several scheduler instances on 1 page
Online export to PDF/PNG without watermark Free for 1 year Free for 1 year Free for 3 years
Free local PDF/PNG export module
Commercial
$1299
License Terms Read License Agreement
Developers 5
Projects 1
Use in SaaS (unlimited end-users) Upon request for a fee
Use in Salesforce
Source code
Perpetual distribution rights
Support Plan
 Premium
Time Period 1 year
Updates Major, minor, and maintenance updates
Support requests 30
Response time 48h
Personal Account Manager
Functionality
 PRO + 2 add-ons
9 PRO features
React Scheduler
Several scheduler instances on 1 page
Online export to PDF/PNG without watermark Free for 1 year
Free local PDF/PNG export module
Enterprise
$2899
License Terms Read License Agreement
Developers 20
Projects 5
Use in SaaS (unlimited end-users)
Use in Salesforce
Source code
Perpetual distribution rights
Support Plan
 Premium
Time Period 1 year
Updates Major, minor, and maintenance updates
Support requests 50
Response time 48h
Personal Account Manager
Functionality
 PRO + 2 add-ons
9 PRO features
React Scheduler
Several scheduler instances on 1 page
Online export to PDF/PNG without watermark Free for 1 year
Free local PDF/PNG export module
Ultimate
$5799
License Terms Read License Agreement
Developers
Projects
Use in SaaS (unlimited end-users)
Use in Salesforce
Source code
Perpetual distribution rights
Support Plan
 Ultimate
Time Period 1 year
Updates
Major, minor, and maintenance updates
Priority queue for bug fixing
Support requests
Response time 24h
Personal Account Manager
Functionality
 PRO + 3 add-ons
9 PRO features
React Scheduler
Several scheduler instances on 1 page
Online export to PDF/PNG without watermark Free for 3 years
Free local PDF/PNG export module
About
Explore DHTMLX Scheduler
DHTMLX Scheduler is a powerful JavaScript component you can integrate smoothly with React applications. The PRO edition allows creating React scheduling interfaces with a rich set of features for managing events.
Visit JS Scheduler page
Documentation
Work with documentation
To streamline your learning curve, you may access our comprehensive documentation with API references, guides, and video tutorials clearly describing the steps of working with DHTMLX Scheduler.
Visit documentation
Samples
Use code snippets
We're constantly upgrading DHTMLX Scheduler online examples where you can explore its features, play around with the code, preview, and share your results with your team or our tech support.
Visit samples
GitHub
Join project on GitHub
You can explore the GitHub starter project that demonstrates how to integrate DHTMLX Scheduler natively into React applications.
Visit GitHub
Forum
Browse our community forum
In addition to providing official technical support, we moderate the forum, where you and other developers can freely discuss different component-related issues and search for a proper answer.
Visit forum
Demos
Try out Scheduler demo apps
We regularly update a collection of templates that demonstrate real-world scenarios for initializing and configuring DHTMLX Scheduler along with other DHTMLX UI components.
Visit demos

DHTMLX React Scheduler:
Frequently Asked Questions

General
Features Availability & Realization
Performance & Accessibility
Integrations
Customization
Export & Import
General
Which React versions are supported?
DHTMLX React Scheduler supports modern React versions starting from React 16+, ensuring compatibility with most current setups, including hooks-based development. Focusing on up-to-date React versions helps us deliver improved stability and long-term maintainability.
How do I get started with a basic scheduler setup?
You can create a scheduler in React by installing the component, importing it into your project, and initializing the scheduler inside your app using standard React hooks. A minimal setup requires rendering the scheduler container and configuring basic options such as views and data loading.
Where can I find detailed API documentation and examples?
Full API documentation and code samples are available on the official product website. You'll also find a starter project showing how to use DHTMLX React Scheduler in a React app on GitHub.
Does React Scheduler work with TypeScript and TSX?
Yes, the DHTMLX component fully supports TypeScript, making it easy to build a TypeScript React Scheduler with type-safe event models, props, and custom configurations. TSX usage works out of the box.
Is DHTMLX Scheduler suitable for SaaS applications?
Yes, it's a strong fit for React Scheduler for SaaS applications thanks to its scalability, multi-user support, and enterprise-ready architecture. It also works well for real-time calendar updates and complex multi-resource scheduling in React.
Features Availability & Realization
Which calendar views are available in React Scheduler?
You can use Day, Week, Month, Timeline, and Units views, making it flexible for enterprise applications and event management use cases. The DHTMLX React timeline scheduler is especially useful for resource planning.
How do I implement drag-and-drop for events?
Drag-and-drop is available out of the box, allowing end-users to move and resize events on the fly. The DHTMLX drag-and-drop scheduler in React can be tailored via the API to match your application’s workflow.
Does React Scheduler support recurring events?
Yes, it includes built-in logic for recurring rules, allowing you to create a React Scheduler with recurring events easily. Custom repeat patterns can also be configured.
Can I implement real-time collaboration between multiple users?
Simultaneous editing is supported through WebSockets or Firebase, allowing multiple end-users to update schedules at the same time, making DHTMLX Scheduler ideal as a real-time calendar React solution. Learn how to set it up in your project in the official documentation and build a fully-featured real-time collaboration React Scheduler.
How can I update the scheduler dynamically without reloading?
Use React hooks and state management to update events, resources, or configurations on the fly. This makes dynamic event loading in React straightforward.
Can I use multiple scheduler instances on the same page?
Yes, you can render multiple instances as long as each has a unique container and data source. This is useful for multi-resource scheduling dashboards.
Performance & Accessibility
What performance can I expect with thousands of events?
DHTMLX Scheduler is a high-performance React calendar optimized for smooth rendering, capable of handling thousands of events without significant lag. Virtualization and smart rendering ensure smooth scrolling.
Is React Scheduler mobile-friendly and touch-responsive?
Yes, you get a mobile-friendly React Scheduler that supports touch gestures for drag, resize, and navigation. It works well for both mobile and tablet devices.
Does DHTMLX React Scheduler comply with accessibility standards (WAI-ARIA)?
Yes, it includes accessibility-compliant React Scheduler features, including keyboard navigation and ARIA attributes. This ensures usability for diverse audiences.
Are there limitations on the number of end-users in cloud apps?
No strict limitations exist; DHTMLX React Scheduler scales effectively for enterprise applications and small teams. Performance depends mainly on backend architecture.
Integrations
Can I integrate DHTMLX React Scheduler with Redux?
Yes, React Scheduler with Redux integration works smoothly for managing complex app states, event updates, and filters. It’s commonly used in enterprise-grade workflows.
How do I handle server-side data integration?
You can connect the scheduler to any REST API, GraphQL endpoint, or WebSocket stream. Server-side integration for React Scheduler typically involves CRUD operations mapped to event handlers.
Customization
How can I customize event templates and tooltips?
You can override default templates or use custom renderers to style events, tooltips, and popups. This makes the DHTMLX widget a highly customizable React Scheduler component.
Can I customize the scheduler's look with themes or MUI components?
Yes, you can style it with CSS, theme variables, or integrate it with Material UI layouts. This allows seamless branding for enterprise-ready React scheduler apps.
Export & Import
How do I export events to PDF or Excel?
You can export React Scheduler events to PDF or Excel using built-in export utilities or server-side scripts. This is helpful for reporting, backups, and enterprise workflows.

Latest Blog Posts

Integrating DHTMLX with Cloud Firestore for Real-Time Apps
August 27, 2025
8 min read
Creating Task Backlog with Drag-and-Drop Support in DHTMLX Scheduler
August 7, 2025
8 min read
Backend Data Conversion for Integrating DHTMLX Booking and Scheduler
May 8, 2025
9 min read
What's new
Discover the recently launched DHTMLX Scheduler versions, fresh developer guides, and tutorials with code snippets and practical tips from our tech team.
Dive deeper