As mentioned in the introduction of this module, we’re going to make use of a 3rd part component to implement the date picker.

I searched “React calendar” and “React date picker” on Google, and I went on to analyze all the results

The requirements for this date picker are quite a few.

In particular, it needs to support disabling dates, something that not every date picker does.

Eventually I settled on https://react-day-picker.js.org/ because it supports disabling dates, and it also has an extensive examples library.

From the terminal, in the main project folder, run npm install react-day-picker.

Then run npm run dev to start Next.js again.


Go to the next lesson