Change start of the week to Monday

Question

I am trying to follow this tutorial .

It builds a calendar where Sunday is the first day of the week. I don't completely grok how it works, honestly. What I cannot understand is how to make it show a calendar where week starts from Monday, not Sunday. I think the problem is somewhere in this line:

date = this.state.month.clone().startOf("month").add("w" - 1).day(0),

I tried day(1) , then it builds weeks starting from Monday, but if the 1st day of the month is Sunday, then it leaves this day on the screen of the previous month, showing the current one starting from the 2nd day:

How can I do this?

Answer 1

I got it to at least render the current month properly with

date = this.state.month.clone().startOf("month").add("w" -1).day(1),

as you mentioned, along with rearranging the day of the week labels

var DayNames = React.createClass({
    render: function() {
        return <div className="week names">
            <span className="day">Mon</span>
            <span className="day">Tue</span>
            <span className="day">Wed</span>
            <span className="day">Thu</span>
            <span className="day">Fri</span>
            <span className="day">Sat</span>
            <span className="day">Sun</span>
            </div>;
    }
});

Fiddle: https://jsfiddle.net/yy33bmze/3/

Answer 2

OK, I got it. Instead of trying to get explicit day as start of the week, startOf('isoWeek') should be used. So instead of

date = this.state.month.clone().startOf("month").add("w" - 1).day(0),

I did:

date = this.state.month.clone().startOf("month").add("w"-1).startOf('isoWeek'),

and now it looks right: