title: creating a custom calendar with moment using days/weeks and headings
body: <p>I am creating a schedule component using moment and react. I have created a custom calendar. How do place the days of the weeks fixed at the top like a normal calendar? So if i pass the date object september, i want to render all the dates with the correct day of the week heading above each date. I have created a fiddle here. </p>
  
  <p><a href="https://jsfiddle.net/4dbwLg6b/" rel="noreferrer">https://jsfiddle.net/4dbwLg6b/</a></p>
  
  <pre><code>var dates = ['Thu Sep 01 2016 00:00:00 GMT+0800 (CST)', 'Fri Sep 02 2016 00:00:00 GMT+0800 (CST)', 'Sat Sep 03 2016 00:00:00 GMT+0800 (CST)', 'Sun Sep 04 2016 00:00:00 GMT+0800 (CST)', 'Mon Sep 05 2016 00:00:00 GMT+0800 (CST)', 'Tue Sep 06 2016 00:00:00 GMT+0800 (CST)', 'Wed Sep 07 2016 00:00:00 GMT+0800 (CST)', 'Thu Sep 08 2016 00:00:00 GMT+0800 (CST)', 'Fri Sep 09 2016 00:00:00 GMT+0800 (CST)', 'Sat Sep 10 2016 00:00:00 GMT+0800 (CST)', 'Sun Sep 11 2016 00:00:00 GMT+0800 (CST)', 'Mon Sep 12 2016 00:00:00 GMT+0800 (CST)', 'Tue Sep 13 2016 00:00:00 GMT+0800 (CST)',' Wed Sep 14 2016 00:00:00 GMT+0800 (CST)',' Thu Sep 15 2016 00:00:00 GMT+0800 (CST)', 'Fri Sep 16 2016 00:00:00 GMT+0800 (CST)', 'Sat Sep 17 2016 00:00:00 GMT+0800 (CST)', 'Sun Sep 18 2016 00:00:00 GMT+0800 (CST)', 'Mon Sep 19 2016 00:00:00 GMT+0800 (CST)',' Tue Sep 20 2016 00:00:00 GMT+0800 (CST)', 'Wed Sep 21 2016 00:00:00 GMT+0800 (CST)', 'Thu Sep 22 2016 00:00:00 GMT+0800 (CST)', 'Fri Sep 23 2016 00:00:00 GMT+0800 (CST)', 'Sat Sep 24 2016 00:00:00 GMT+0800 (CST)', 'Sun Sep 25 2016 00:00:00 GMT+0800 (CST)', 'Mon Sep 26 2016 00:00:00 GMT+0800 (CST)', 'Tue Sep 27 2016 00:00:00 GMT+0800 (CST)', 'Wed Sep 28 2016 00:00:00 GMT+0800 (CST)', 'Thu Sep 29 2016 00:00:00 GMT+0800 (CST)', 'Fri Sep 30 2016 00:00:00 GMT+0800 (CST)']
  var Hello = React.createClass({
    render: function() {
  
  
      return &lt;div className="container"&gt;
         {dates.map(function(day){
       return(
       &lt;div className="calendarDay"&gt;
       {moment(day).format('D').toString()}
       &lt;/div&gt;
       )
       })}
      &lt;/div&gt;;
    }
  });
  
  ReactDOM.render(
    &lt;Hello name="World" /&gt;,
    document.getElementById('container')
  );
  </code></pre>
  
  <p>this is what i have
  <a href="https://i.stack.imgur.com/8M4uA.png" rel="noreferrer"><img src="https://i.stack.imgur.com/8M4uA.png" alt="enter image description here"></a></p>
  
  <p>this is what i want, days of week corresponding to date number. mon,tues,wed.....
  <a href="https://i.stack.imgur.com/4ycBE.png" rel="noreferrer"><img src="https://i.stack.imgur.com/4ycBE.png" alt="enter image description here"></a></p>