Date Picker

If I can avoid installing a dependency, I will. I like to keep projects as small as possible in terms of the bundle size but also the amount of external libraries you're depending on. Plus, there's a sense of accomplishment that comes with building something yourself.

Dates, on the other hand, are simply one of those areas where I do find myself reaching for something off the shelf. Generally I use day.js as it's super small and offers the functionality I need when parsing and displaying dates.

A few years ago it was a struggle to find a decent looking date picker component. While I can use day.js to parse dates, it left a lot of work to build a functional date picker. There were a few libraries focusing on this, but they were either too opinionated on their design or they didn't offer the flexibility in their API.

I eventually stumbled upon dayzed. It allowed me to build my own UI on top of its simple API and gave me the tools to present and navigate through a calendar.

I combined it with react-popper to handle placement and a React portal to ensure it was higher up the DOM and help with overlapping issues.

Styled with Tailwind CSS.