All solutions

I'm definitely seeing the importance of referencing figma files for this challenge! Without them, I had to do a lot of guesswork on font sizes and styling.

Questions:

• I had difficulty using images in React unless they were in the src folder.

• What are best practices for importing images?

• What if the image URIs are called through an array/JSON? How can I prevent the URI displaying only as a string?

When using the randomly generated link from the adviceslip API, the javascript that I wrote would fetch the URI once, then would not reload a different message even if the function was called again. To workaround this, I created a random number generator. This random number is appended to the end of the API uri to get a pseudo-random URI. Is there a better way to do this? What would best practices be?

I learned a LOT while completing this challenge! A few things that I could not figure out: How can I load content from the JSON file in a way that javascript can parse? How can I change the styling of the active tabs and dots once the content has been changed via javascript? How can I add animation effects to the tabs/dots content so that the loading of content is more elegant?

I feel that I learned so much between the last challenge and this one! Any and all feedback is welcome.

Although I used the provided font family and colors provided in the style guide, they do not seem to match the mockup image. I'm not sure what happened here. Suggestions?