E-commerce Product Page built with React and Tailwind CSS

Good day Frontend Mentor Community! Here is my solution to the E-commerce Product Page challenge.

I have been out for a while because I am learning React and Tailwind CSS but now I'm back with this completed challenge using newly learned React and Tailwind CSS yay!

It was quite challenging to write clean code in React where you don't litter the code with prop drilling, messy code, and unorganized file structure but overall it was fun and accomplishing. Implemented all the features stated in the objective and it feels great being able to do that!

Where I struggled a lot was how should I write my state management? When shall I use useReducer rather than useState and where shall I put that state? This questions requires a lot of thinking and takes up time in order to write clean code.

P.S. I first started this one with just HTML, SASS, and Javascript only and managed to complete the mobile view of the page but I transitioned to React and Tailwind to hone my knowledge in that area further.

Happy to hear any feedback and advice on how to write cleaner code in React! Have a nice day everyone!