Pineapple Illustration by Mark Sheraton

Baby’s Growing Size

Track the size of a growing baby.

​​Learning by Doing

When I found out that my wife and I were expecting our first child, I was super excited. And I did what I often do when I’m excited about something and bought a new domain name! I wanted to make it easy for friends and family to follow along as our baby grew week-by-week and see its relative size throughout the pregnancy. A lot of pregnancy websites already do this using fruit and vegetables for comparison. So I built a custom website and used PHP to update the size each week. It was specific to our growing daughter and wasn’t useful to anyone else. I recently decided to rebuild that in Javascript, and this time make it into a tool that anyone could use.

​The Functionality

The tool is pretty simple, you enter in the baby’s due date into a text field and then it shows you how big your new baby is that week. I leaned on jQuery UI’s Datepicker widget to limit the available dates to the next 36 weeks. We start at 4 weeks because any earlier than that the baby is too tiny to really compare. The due date gets normalized and passed as a URL parameter to the next page. From there I created a render function, so that people can skip ahead or go backwards without having to refresh the page. All the data is stored in an associative array and the final touch was mapping the left and right arrow keys to allow for easier navigation between weeks. It’s all in the details.

Nothing crazy or super complex, but I learned a lot along the way.