I personally like free stuff so I would just stick to Figma XD.
With that aside, keep in mind that React is a component based architecture so focus on identifying segments of your existing site that would make good candidates for a component. Avoid giant components. These become impossible to maintain in the future. Also, think about whether your application will require a global state management solution like Redux (or Context) and plan that out before hand.
Thank you for your advice! I most likely will stick with free side of things so I can save myself money XD. As for React I am fully aware that it is component based, which is what drew me to it. The way it handles and creates components compared to Angular is beautiful and way easier for me to keep my code consistent. As for Redux I briefly touched upon it this past semester but I will do some thorough research to incorporate in my planning to see if I need to use it.
Great to hear and weigh your options aside from Redux. I personally prefer an Angular Services style approach using Contexts to provide singleton service objects over Redux which can be hard to reason with in certain edge cases. It really depends on what you're most comfortable with since you can achieve the same functionality.
We're a place where coders share, stay up-to-date and grow their careers.
We strive for transparency and don't collect excess data.