Overview
FullCalendar is a JavaScript UI library for day, week, month, and other calendar views with events and interaction. It supports vanilla JavaScript and official connectors for React, Angular, and Vue.
Features and best fit
Based on official documentation; not hands-on tested · Content checked:
Compose calendar views and event rendering with plugins
Plugins such as dayGrid and timeGrid define views while event data supplies titles, dates, and scheduling information.
Add drag-and-drop editing with interaction plugins
The interaction plugin enables user-driven event manipulation and other interactive calendar behavior.
For booking, shift, and schedule interfaces
It fits web applications that need users to view or manipulate reservations, shifts, appointments, or other scheduled events.
Sources: [2]
Choose between a convenient bundle and smaller plugin sets
The Standard Bundle is easier to install but larger than a hand-picked plugin set. Framework projects should also align the official connector version with the core version.
Sources: [2]
Official sources
- [1]fullcalendar/fullcalendar repository(2026-09-21)
- [2]FullCalendar README(2026-09-21)
- [3]FullCalendar documentation(2026-09-21)
- [4]FullCalendar vanilla package(2026-09-21)
- [5]FullCalendar MIT license(2026-09-21)
Supplemental curator note
The FullCalendar standard repository is MIT-licensed and the current vanilla package is 7.1.0. The README notes that the Standard Bundle is easier to install but larger than selecting individual plugins. React, Angular, and Vue integrations also have official connector repositories, so choose an integration path deliberately.
Try it in 3 steps
- 1
Install FullCalendar
Use the Standard Bundle installation path from the official README.
npm install fullcalendar - 2
Import Calendar and the required plugins
Choose the view and interaction plugins needed for the calendar.
import { Calendar } from 'fullcalendar'; import dayGridPlugin from 'fullcalendar/daygrid' - 3
Create and render the calendar
Render a minimal event calendar, then add interaction plugins or framework connectors as needed.
const calendar = new Calendar(document.getElementById('calendar'), { plugins: [dayGridPlugin], events: [{ title: 'Meeting', start: new Date() }] }); calendar.render()
Growth
Growth trends · Last 30 days
20,645 Stars
Trend data is still being collected.
Development activity
Last 90 days · weekly
- Commits (last 30 days)
- 102
- Open PRs
- 58
Development activity is still being collected.
Built with
Categories and tags
Categories
GitHub data
GitHub dataView detailed GitHub data
GitHub Topics
- calendar
- event
- full-sized
- Stars
- 20,645
- Forks
- 3,717
- Watchers
- 425
- Open issues
- 1,075
- Contributors
- 131
- Primary language
- TypeScript
- License
- MIT
- Repository last updated
- Sep 5, 2026
Related information
Write a related articleShare a guide or use case for this OSS in Markdown. Articles are published after administrator approval.
Explore next
- Puter43,567 Stars
2 shared tag(s) · 2 shared category(s) · Same language
A self-hostable Internet OS combining a browser desktop with cloud storage, AI, databases, and serverless workers.
TypeScript - Angular101,020 Stars
2 shared tag(s) · 1 shared category(s) · Same language
A TypeScript-first web application platform integrating components, DI, routing, forms, SSR, and CLI tooling.
TypeScript - Mermaid90,334 Stars
2 shared tag(s) · 1 shared category(s) · Same language
A diagrams-as-code library that renders flowcharts, sequences, UML, and more from Markdown-like text.
TypeScript - Redux61,490 Stars
2 shared tag(s) · 1 shared category(s) · Same language
A JavaScript/TypeScript state-management library that centralizes application state in a store and updates it predictably through actions and reducers. Redux Toolkit is the officially recommended approach today.
TypeScript - Expo52,361 Stars
2 shared tag(s) · 1 shared category(s) · Same language
A universal React Native framework for building Android, iOS, and web apps from one project model.
TypeScript
Report incorrect information
Tell us if any listing information is incorrect or outdated.