TypeScript Tutorials

This is a list of calendar and scheduling tutorials written in TypeScript. TypeScript is a new programming language created by Microsoft that extends JavaScript and adds new features to it, like static typing. 

Applications written in in TypeScript need to be compiled to JavaScript before they can be run in the browser. This adds a complication step to the deployment workflow (JavaScript can be run directly) which makes the deployment more complicated. However, there are tools available that automate the compilation. Also, the compiler can perform additional optimizations (like the Angular compiler does) and that can compensate for the hassle.

The most prominent use of TypeScript is probably the Angular framework which chooses TypeScript as its primary language.

DayPilot Pro for JavaScript includes TypeScript definitions that describe the DayPilot API. Some IDEs (like WebStorm or Visual Studio) can read the TypeScript definitions and offer code hints for JavaScript projects as well.

Angular Calendar: CSS Themes
Angular Calendar: CSS Themes
Angular application that shows how to apply a custom CSS theme to the calendar component and change it on the fly.
Angular Scheduler: Resource Management
Angular Scheduler: Resource Management
This tutorial shows how to use Angular Scheduler component to manage resources (create, edit, delete, move) using the Scheduler UI.
Angular Scheduler: Full Screen Layout
Angular Scheduler: Full Screen Layout
Angular application that displays the Scheduler in a full screen layout. The project includes a collapsible sidebar with a date picker.
Angular Scheduler: Event Copy & Paste
Angular Scheduler: Event Copy & Paste
Angular scheduling application that allows creating events from existing ones using copy and paste.
Angular Gantt Chart Component (TypeScript + PHP/MySQL)
Angular Gantt Chart Component (TypeScript + PHP/MySQL)
Angular project that displays a hierarchy of tasks using a Gantt Chart UI component. The frontend Angular application is connected to a JSON backend implemented in PHP with MySQL database.
Angular Scheduler Tutorial (TypeScript + PHP/MySQL)
Angular Scheduler Tutorial (TypeScript + PHP/MySQL)
Simple Angular application that shows how to use DayPilot Scheduler with PHP/MySQL backend.
Angular Resource Calendar Tutorial
Angular Resource Calendar Tutorial
Angular application that shows how to create a resource calendar Angular component that displays event data in multiple columns. The resource calendar supports drag and drop out of the box.
React Scheduler: TypeScript Project
React Scheduler: TypeScript Project
This tutorial shows how to use the React Scheduler component to create a reservation application in React, using TypeScript language.
Angular Scheduler UI with Spring Boot Backend (Java)
Angular Scheduler UI with Spring Boot Backend (Java)
Angular project that shows how to create Scheduler UI using DayPilot Pro for Angular. Includes a backend REST/JSON application implemented using Spring Boot (Java).
Angular Work Order Scheduling (PHP/MySQL)
Angular Work Order Scheduling (PHP/MySQL)
Angular web application that lets you assign and schedule work orders using drag and drop. Built using DayPilot Scheduler Angular component. Includes a REST backend implemented in PHP/MySQL
Angular Appointment Calendar Component (TypeScript + PHP/MySQL)
Angular Appointment Calendar Component (TypeScript + PHP/MySQL)
Simple appointment scheduling application built using Angular. The calendar view is created using DayPilot Pro Angular Calendar component. The server-side backend is created using PHP and stores events in a MySQL or SQLite database.
Angular 11 Scheduler Quick Start Project
Angular 11 Scheduler Quick Start Project
Add an Angular Scheduler component to your application and use it to manage a schedule online. Add, move, edit, and delete reservations using drag and drop.
Angular Hotel Room Booking Tutorial (PHP/MySQL)
Angular Hotel Room Booking Tutorial (PHP/MySQL)
Angular hotel room reservation application. The user interface supports managing rooms (create, edit, delete, change status) and reservations (create, edit, move, delete, change status). Includes a PHP/MySQL backend with token-based authentication.
Angular Restaurant Table Reservation (PHP/MySQL)
Angular Restaurant Table Reservation (PHP/MySQL)
Angular application that lets you manage restaurant table reservations. Includes a PHP/MySQL backend.
Angular Scheduler: Date Navigation
Angular Scheduler: Date Navigation
Angular 11 application that uses DayPilot Navigator component as a date picker for the Scheduler.
Angular Scheduler: Displaying Event Phases
Angular Scheduler: Displaying Event Phases
Angular 11 project that shows how to display events split into phases in the Scheduler component.
Angular Calendar: Day/Week/Month Views
Angular Calendar: Day/Week/Month Views
Angular project that displays an event calendar component with day, week and month views that share the same data and can be easily switched. A date picker component is used to switch the current date and highlight busy days.
Angular Scheduler: Rendering Angular Components Inside Events
Angular Scheduler: Rendering Angular Components Inside Events
How to add custom components to events displayed in the Angular Scheduler.
Angular Scheduler: Read-Only and Edit Mode Switching
Angular Scheduler: Read-Only and Edit Mode Switching
Angular 10 application that shows how to switch the Scheduler (which is in "edit" mode by default) to read-only mode.
Angular 10 Timesheet Quick Start Project
Angular 10 Timesheet Quick Start Project
A quick start project that shows how to use the Angular 10 Timesheet component.
Articles 1-20 of 55 Next