Responsive Multi-Step Form With TypeScript, React, Framer and Zustand.

What are you most proud of, and what would you do differently next time?

This is my first time officially using both Zustand and Framer Motion so I would like so insights to how I handled the global state and how can I make it better.

What challenges did you encounter, and how did you overcome them?

Global State Management and Form Validations.

I solved the state problem with Zustand since it was fun and easy to use.

For form validations I was thinking about React Hook form but didnt want to add more complexity.

Another problem I had was validating the form before moving onto the next step. The form wasnt like the normal forms where you have a submit button to check, so I did an interceptor function(Thats what I call it but basically a wrapper) around the increment function so that before it moves on to the next step it validates the form and only when its correct it will go on to the next one.

What specific areas of your project would you like help with?

Global State Management and better structure of files and components