OSS探訪

FullCalendar — イベント表示とドラッグ操作を備えたカレンダーUIをWebアプリへ組み込む

スコアの見方

OSS規模スコアはStars・Watchers・Forks・Contributorsを対数圧縮して重み付けした現在の規模指標(上限なし)です。発掘スコアは現在のOSS規模スコアから発掘時点のOSS規模スコアを引いた値、更新ペースは直近30日Commit数、成長モメンタムは直近の観測期間におけるOSS規模スコア差、OSS健全度は取得できた更新状況・Community Health・Releaseの0〜100評価です。

Stars
20,645
主要言語
TypeScript
ライセンス
MIT
リポジトリ最終更新
2026/09/05

概要

FullCalendarは、日・週・月などのカレンダー表示へイベントを配置し、ドラッグ操作や表示切替を追加できるJavaScript UIライブラリです。Vanilla JSのほかReact、Angular、Vue向けの公式connectorがあります。

特徴と向いている用途

公式資料に基づく紹介・実機未検証 · 内容確認日:

複数のcalendar viewとイベント表示を組み立てる

dayGrid、timeGridなどのpluginを組み合わせ、イベントのタイトル・開始日時などをカレンダー上へ表示できます。

出典:[2][3]

interaction pluginでドラッグ編集を追加する

interaction pluginを有効にすると、イベントのドラッグやユーザー操作に応じた編集UIを構成できます。

出典:[2][3]

予約・シフト・予定管理のカレンダー画面に

スケジュール、予約、社内予定などをカレンダー形式で表示・操作するWebアプリのUI基盤に向きます。

出典:[2]

bundleサイズとconnector構成を選ぶ

Standard Bundleは導入しやすい代わりに個別plugin構成よりファイルサイズが大きくなります。フレームワーク統合では公式connectorの版も合わせて確認してください。

出典:[2]

参考にした公式資料

  1. [1]fullcalendar/fullcalendar repository(2026-09-21)
  2. [2]FullCalendar README(2026-09-21)
  3. [3]FullCalendar documentation(2026-09-21)
  4. [4]FullCalendar vanilla package(2026-09-21)
  5. [5]FullCalendar MIT license(2026-09-21)
編集部からの補足

FullCalendarのStandardリポジトリはMITライセンスで、現在のvanillaパッケージは7.1.0です。READMEは標準bundleを導入しやすい一方でファイルサイズが大きくなると説明しています。React/Angular/Vueは別の公式connectorリポジトリもあるため、採用する統合方法を先に決めてください。

3ステップで試す

  1. 1

    FullCalendarを追加

    公式READMEのStandard Bundleを使う最短導線です。

    npm install fullcalendar
  2. 2

    Calendarと必要なpluginを読み込む

    表示したいviewとinteractionに必要なpluginを選んで読み込みます。

    import { Calendar } from 'fullcalendar'; import dayGridPlugin from 'fullcalendar/daygrid'
  3. 3

    Calendarを生成して描画

    最小のイベントを表示し、必要に応じてinteraction pluginやframework connectorを追加します。

    const calendar = new Calendar(document.getElementById('calendar'), { plugins: [dayGridPlugin], events: [{ title: 'Meeting', start: new Date() }] }); calendar.render()
公式READMEで確認

成長

成長の推移 · 直近30日

20,645 Stars

推移データを蓄積中です。

開発アクティビティ

直近90日・週次

Commit(直近30日)
102
Open PR
58

開発アクティビティを蓄積中です。

Built with

カテゴリとタグ

GitHubデータ

GitHubのデータGitHubの詳細データを見る

GitHub Topics

  • calendar
  • event
  • full-sized
Stars
20,645
Forks
3,717
Watchers
425
Open Issues
1,075
Contributors
131
主要言語
TypeScript
ライセンス
MIT
リポジトリ最終更新
2026/09/05

このOSSの使い方や活用事例をMarkdownで投稿できます。管理者が承認した後に公開されます。

情報の誤りを報告

掲載内容に誤りや古い情報があればお知らせください。