DHTMLX React Scheduler + FastAPI Demo

A full-stack starter pairing DHTMLX React Scheduler with a Python/FastAPI backend. The frontend is React 19 + Vite + TypeScript; the backend is FastAPI + SQLAlchemy 2.x + Pydantic v2 with a SQLite database. Recurring events with rrule, exceptions, and series handling work out of the box.

Features

• Full CRUD over REST: create, read, update, delete events from the Scheduler UI.
• Recurring events with rrule, modified-occurrence exceptions, and series-level deletion.
• Vite dev proxy to the backend (no CORS gymnastics during development).
• Auto-generated FastAPI OpenAPI docs at /docs.
• TypeScript end-to-end on the frontend.

Stack

Backend — Python 3.10+, FastAPI, SQLAlchemy 2.x, Pydantic v2, SQLite (via sqlite3, no extra service needed).

Frontend — React 19, Vite 8, TypeScript, @dhtmlx/trial-react-scheduler.

Requirements

• Python 3.10 or newer
• Node.js 18 or newer
• npm or yarn

How to run

1. Clone the repo

   git clone https://github.com/DHTMLX/react-scheduler-fastapi-demo.git
   cd react-scheduler-fastapi-demo

2. Start the backend (one terminal)

   cd backend
   python -m venv venv
   # macOS/Linux:
   source venv/bin/activate
   # Windows (PowerShell):
   venv\Scripts\Activate.ps1
   
   pip install -r requirements.txt
   python -m uvicorn app.main:app --reload --port 8000

   The API listens on http://localhost:8000 and tables are created automatically on first run. Open http://localhost:8000/docs for the OpenAPI UI.

3. Start the frontend (another terminal)

   cd frontend
   npm install
   npm run dev

   Open the printed URL (default: http://localhost:5173).

If you use the Professional package instead of the trial, replace @dhtmlx/trial-react-scheduler with @dhx/react-scheduler in frontend/package.json and in frontend/src/components/Scheduler.tsx.

Project structure

react-scheduler-fastapi-demo/
├── backend/
│   ├── app/
│   │   ├── main.py        # FastAPI app, CRUD endpoints, recurring logic
│   │   ├── models.py      # SQLAlchemy Event model
│   │   ├── schemas.py     # Pydantic v2 request/response models
│   │   └── database.py    # Engine, session, SQLite config
│   └── requirements.txt
├── frontend/
│   ├── src/
│   │   ├── App.tsx
│   │   ├── main.tsx
│   │   └── components/
│   │       └── Scheduler.tsx   # ReactScheduler with recurring plugin
│   ├── index.html
│   ├── package.json
│   └── vite.config.ts          # /api proxy → http://localhost:8000
└── react-scheduler-fastapi-guide.md   # In-repo walkthrough

Tutorial

The full tutorial lives on the DHTMLX docs site: dhtmlxScheduler with FastAPI.

License

Source code in this repository is released under the MIT License.

DHTMLX React Scheduler is a commercial library — use under a valid DHTMLX license or evaluation agreement.

Useful links

• DHTMLX React Scheduler product page
• DHTMLX Scheduler product page
• Documentation
• React Scheduler documentation
• Blog
• Forum