Wrote my Quote Machine in React please give me feedback

Code Feedback
1

Hello,

I wrote my Quote Machine in React and in VSCode text editor/IDE. A little bit outside the box so I could push my envelope even further.

Quote Machine

here is the GitHub repo with the code:

Code Repository

Please to give me suggestions and feedback.

Thanks,
Tim

1 Like
2

I guess it’s not the type of feedback you are looking for, but CSS is a bit broken on the buttons. Scaling the buttons with vh makes them not fit into the width of the card on my screen (I have my task bar on the right side of the screen, so I have a bit more height on a 1920x1080 display).
You could play around with display: flex to keep the quote card to the bottom of the screen if that was your intention.
I have no coments on react.

3

This is exactly the type of feedback I am looking for.

I’ve attached a screen shot to this thread and i see what you mean! I hadn’t considered full screen.

30%20PM
30%20PM2066×1332 87.1 KB
54%20PM
54%20PM1000×1330 24 KB
13%20PM
13%20PM2554×1600 109 KB

4

well, I had switched over some of the styling to vw instead of vh, but not all of it. And I put in some media queries.

6

Randall,

Thanks for the incredible amount of detail. This is exactly the feedback I am looking for! This is my first React project so I am still trying to figure out the paradigm.

I was wondering about accessing the DOM, I felt it was too expensive of an operation, and I’m glad to hear that I was right and that the React paradigm is a solution to this.

I guess I have more to learn, which means I have more to do. Nice explanation of how to use destructuring as well.

Thanks for the help!
Tim

7

Thanks again for the help with the quote machine. I was able to easily change the colors on the components by using the this.state.clrScheme AND thanks for the nudge toward destructuring, now that makes a lot more sense to me.