JSFiddle - React, Tailwind, and code Playground

by Manish Agarwal

HTML

<link rel="stylesheet" href="http://arshaw.com/js/fullcalendar-1.5.3/fullcalendar/fullcalendar.css">
<script src="http://www.arshaw.com/js/fullcalendar-1.5.3/fullcalendar/fullcalendar.min.js"></script>
<div style="border:solid 2px red;">
        <div id='calendar'></div>
</div>

JavaScript

$(document).ready(function() {
//Adding entry for 2015-08-10T22:15:00(Monday), it replicates in another day(Tuesday) at 12am also.
        $('#calendar').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'agendaWeek'
            },
            defaultView: 'agendaWeek',
            defaultDate: '2015-08-10',
            editable: true,
            selectable: true,
            eventLimit: true, // allow "more" link when too many events
            events: [
                {
                    title: 'All Day Event',
                    start: '2015-08-10T22:15:00'
                },
                {
                    id: 999,
                    title: 'Repeating Event',
                    start: '2015-08-10T23:15:00'
                }
            ]
        });

    });