Pricing Component With Toggle

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

I'm just proud of the fact that I completed this project using React, Vite and TypeScript. the jump from plain HTML / CSS / Vanilla JS. to using all of this tooling was a bit overwhelming but after completing this project. I can see the myriad of benefits of using React and Typescript.

Vite seemed to be the best choice when it comes to choosing a bundler. that is because of it's speed and the ton of features it comes with.

I wouldn't do anything different next time. I'd like to practice this tooling as much as I can before jumping to fullstack frameworks like Next.js or Remix.

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

Since this is my first time using React + TS and Vite. I struggled on how to structure the components and CSS. I made each component along with it's types into their separate files.

As for the CSS I used only two files imported into the main JS entrypoint. I thought about using CSS modules however since I'm used to doing my work into a single CSS file and this project seemed small enough to do it I went with that approach.

I used BEM to assign classes to the different elements of my components and used a single CSS file to style them.

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

I would like to know if I should have used CSS Modules or used separate CSS files for each component?

I would like also to know how other developers think about the structure of my components, hooks and their types. and if they are readable and understandable.

Thank you for viewing my solution!