Scheduling tutorials & source code
Tutorials and downloadable examples using DayPilot calendar and scheduling components. Start with a component, connect your backend, or explore application workflows.
Find a starting pointFeatured tutorial
How to configure the JavaScript Scheduler component to display a dedicated sub-row for each priority level. This allows you to group tasks with the same priority and display them at the same position within a row.
Application workflows and a smaller starting point.
Application exampleJavaScript · PHP
A tutorial that shows how to create a PHP reservation system for hotel rooms with JavaScript/HTML5 frontend. The user interface includes a visual scheduling calendar with drag and drop support. MySQL and SQLite databases.
Quick startAngular
An Angular project template that you can use as a starting point for your own implementation of an interactive timesheet. Learn how to adjust the timesheet appearance and add visual elements.
Application exampleJavaScript · ASP.NET Core
How to create a visual, color-coded, and easily adjustable maintenance schedule in ASP.NET Core using DayPilot Lite, the open-source calendar/scheduling UI library.
Step-by-step guides to scheduling features, UI customization, and backend integration.
Explore the built-in UI elements that let your users manage (create, edit, move, delete) resources displayed using the React Scheduler component.
When removing events from the scheduler, it is possible to remove them completely or to move them to a queue of unscheduled tasks or a row with unassigned events (while keeping the scheduled time).
An overview of Scheduler settings that let you control the vertical event position within rows. Includes custom sorting, forcing a specific line within a row, dedicated lines, keeping related events together using virtual containers.
How to customize the Vue Scheduler row header using Vue templates: add icons, badges, buttons and Vue components.
Find the view that fits your application.
Control how users work with schedules.
Adapt the display and handle larger schedules.
DayPilot
