react-calendar

Add Full Calendar React Component in your project.

Click to go to live Demo

Features

• Calendar fills the container in which it is added. So to resize the calendar, simply resize the container(modify calendar class in style.css)
• Format Week Day Names as you like by simply passing the array of names as property to Component
  <Calendar weekdayFormat={["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"]}></Calendar>
<Calendar weekdayFormat={["S", "M", "T", "W", "T", "F", "S"]}></Calendar>
<Calendar weekdayFormat={["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]}></Calendar>
• Set the intitial date of Calendar simply by passing a valid date in highlightDate property
  <Calendar highlightDate={new Date().setDate(21)}>

How To Integrate in non-react projects

• Download calendar.js and style.css
• Create a div container as shown below
  <div id="Calendar"></div>
• Add script tags for React,ReactDOM and babel CDN

How to Integrate in react projects

• Download calendar.js and style.css
• In Calendar.js, replace ReactDOM.render(,document.getElementById('Calendar')); with export default Calendar
• Import calendar.js and style.css in your script file and render <Calendar></Calendar>

To clone the repository run the below command

git clone https://github.com/BhatiaGurpreet/react-calendar.git