For the challenge of Random Quote Machine I decided to try and replicate the example with React. Below is the link to the GitHub repository and the questions I have, which are also in the readme file:
-
I wanted to add Animate.css class, called animated tada, and the only way I’ve been able to do it is the commented out part of the code, handleEnter and handleLeave. I did it by merging the font awesome icon classes with button classes and then changing the className on mouseEnter and mouseLeave. The solution works, but it doesn’t feel right. If my feeling is right, could you explain why it’s not right to do so and what better way is there to do it?
-
In order to apply an animation class on every new quote and author, I added a Math.random key to them. Is this a bad practice and if so, is there a better one?
-
I made an array of Bootstrap classes in state so I can dynamically change colors of background and buttons. Is that an okay way to do it?
-
What’s the best practice when it comes to applying properties of width, height, background to root element? Should I apply it to html, body, #root, .App or all of them?
-
If you have any overall feedback on the project it would be much appreciated as well.
Every answer means a lot as I am still relatively new to the world of web development. Thank you for your time!