This challenge was a lot of fun & I can’t remember the last time I enjoyed the styling part of a solution so much.

It turned out to be strangely useful too - I’ve pulled up this app more times than I’m willing to admit in random debugging scenarios.

Things I learned

React Reducers

I learned a lot about React reducers during this project and this was my first implementation beyond a few example projects. It was originally written with state but I was able to refactor this into a reducer without too much drama, which has helped me to get a bit more confident with not overthinking the setup initially when I can refactor parts as needed.

I feel like the resulting code came out slightly cleaner than before, due to not needing to define my birthday state update logic in each place the update occurred, as well as storing part of the actual update logic in a separate file away from my main validation and component noise.

Will keep looking into reducers and finding the best ways to use them - I’m not sure mine was the most effective given it’s a first go.

Date validation

To get easy date validation alongside a simple date diff function, I went with the Luxon library for datetime in JS. This was an easy library, but I found myself wondering if my implementation of the invalid date error handling was bad.

Array.toSpliced() browser support

I used this method in tons of places before realising that it’s not supported in Firefox yet, and only got support in iOS Safari in iOS 16+.

Wasn’t a massive deal to remove usage of this, but just a reminder that you should check early when thinking of using it for the first time.