JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://momentjs.com/downloads/moment.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.2.6/fullcalendar.min.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.2.6/fullcalendar.min.css">
<div id="calendar">
</div>

JavaScript

//get current date 
 var date = new Date();
 var d = date.getDate();
 var m = date.getMonth();
 var y = date.getFullYear();


     var calendar = $('#calendar').fullCalendar({
     theme:true,
     weekNumbers: true,
     //allow a 'more' option if too many events.
     eventLimit: true,  
      //enables agenda view 
     header:{
            left:'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
         }, 

     //events: 'event.php',

     selectable: true,
     selectHelper: true, 
        select: function(start, end, allDay) {
        console.log('testing function 1');
         var title = prompt('Event Title:');
         if (title) {
         var sfmated = start.format("yyyy-MM-dd HH:mm:ss");
         var efmated = end.format("yyyy-MM-dd HH:mm:ss");
         
         $.ajax({
         url: '/echo/json',
         data: 'title='+ title+'&start='+ sfmated +'&end='+ efmated ,
         type: "POST",
         success: function(json) {
         console.log('testing function success');
         alert('OK');
         }
         });
         calendar.fullCalendar('renderEvent',
         {
         title: title,
         start: start,
         end: end,
         allDay: allDay
         },
         true // make the event "stick"
         );
         }
         calendar.fullCalendar('unselect');
        },








     });