10 Best Calendar Components For React & React Native Apps (2021 Update)

The calendar is one of the most commonly used components that can be used to pick dates or to display & manage activities, tasks, or any scheduled events in modern web and mobile apps.

If you find that it is difficult to find a perfect calendar for your React and/or React Native app, this post might help you.

Originally Published Dec 06 2017, updated Feb 01 2021

Table Of Contents:

Best Calendar Components For React:

1. Dynamic Calendar Scheduler For React – react-big-scheduler

Dynamic Calendar Scheduler For React – react-big-scheduler

Demo Download

A scheduler and resource planning component built for React and made for modern browsers (IE10+).


2. React Booking Calendar

React Booking Calendar

Demo Download

A React component to create a modern, responsive, customizable booking calendar app.


3. Google Calendar & Outlook Like Calendar Component For React

Google Calendar & Outlook Like Calendar Component For React

Demo Download

A Google Calendar & Outlook like events calendar component built for React and made for modern browsers (read: IE10+) and uses flexbox over the classic tables-ception approach.


4. Responsive React Calendar Timeline Component

Responsive React Calendar Timeline Component

Demo Download

A modern and responsive react timeline component designed for both desktop and mobile.


5. Fully Functional Calendar With Reminders – react-calendar

Fully Functional Calendar With Reminders – react-calendar

Demo Download

A fully functional calendar with reminders using React and Redux.


Best Calendar Components For React Native:

1. Add Events To Native Calendar In React Native

Add Events To Native Calendar In React Native

Demo Download

The react-native-add-calendar-event component allows you to start an activity (Android) or show a modal window (iOS) for adding events to calendar. Through a promise, you can find out if a new event was added and get its id.


2. React Native iOS Style Event Calendar

React Native iOS Style Event Calendar

Demo Download

A React Native iOS style calendar implemented using VirtualizedList.


3. React Native Material Calendar

React Native Material Calendar

Demo Download

React-native shell to material-calendarview component.


4. Common Date Picker & Calendar Component For React Native

Common Date Picker & Calendar Component For React Native

Demo Download

An awesome and cross-platform React Native date picker and calendar component for iOS and Android.


5. React Native General Calendars

React Native General Calendars

Demo Download

This module includes various customizable react native calendar components. Compatible with iOS and Android.


More Resources:

There’re lots of web & mobile event libraries out there and you can find more React & React Native resources about calendar on our Calendar category.

To learn more about date picker on modern web & mobile development, here are a few resources available online:

You Might Be Interested In:

Add Comment