Introduction

The Foodable Project has grown significantly in the past few weeks. Many of the UI pages have been developed to near completion and we have adopted several new technologies to aid us in implementing new features. Technologies like React, TanStack, Shadcn, Tailwind CSS, and MongoDB have pushed this application into new heights and are inching it closer to production. Many of the technologies we are using have been new to me and getting adjusted on how to use them have been a challenge. There is one in mind that at first frustrated me but I have come to appreciate its functionality, and have ultimately made development much easier.

Learning to Appreciate Zustand

Zustand is a state management library for React which has come to replace the standard React useStates that we were using previously. At first, it was difficult for me to move from useStates to Zustand, as both states and stores had to be implemented to get Zustand states working, along with wrapping components that use them in their respective providers. This caused a bit of a headache for me as I was ignorant to the several prerequisites that must be in place. Eventually, I came to understand how Zustand worked and now implementing new components and UI features are much easier as these states are global compared to the local useStates, which had forced me to pass functions from component to component when proper interactions were required in the past. I now can’t think of not using Zustand when working on a web application.