Tutorials: Date Picker and Calendar with Free/Busy Highlighting

These tutorials show how to display a calendar/scheduler component and a date picker with highlighted busy days.

The date picker with highlighted busy days makes it easier to see which days have scheduled events, appointments, tasks or milestones.

The data used to load the free/busy information are in the same format as the calendar data so you can easily reuse the API/data source.

Each tutorial includes a project with source code that you can download and use in your scheduling application.

Vue Resource Calendar (Open-Source)
Vue Resource Calendar (Open-Source)
Use the Vue calendar component to display an interactive schedule for multiple resources.
ASP.NET Core Resource-Scheduling Calendar (Open-Source)
ASP.NET Core Resource-Scheduling Calendar (Open-Source)
How to create a resource-scheduling calendar in ASP.NET Core that displays resources as columns. Add more UI features, such as free/busy highlighting, next/previous date-changing buttons and a modal dialog for editing event details.
Vue Date Picker with Free/Busy Highlighting (Open-Source)
Vue Date Picker with Free/Busy Highlighting (Open-Source)
Use the Vue date picker component (Navigator) to change the current date. The date picker can highlight dates that already have events or are not available.
Articles 1-3 of 3