Advice Generator App using Next.Js, React, and Tailwind

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

With this project, I'm proud to have understood the basic fundamentals of Next.Js. As a junior developer, i have learned how to retrieve data from API, and update the data with a click. I also learned to use Tailwind CSS using this project, which i think is better than Bootstrap because of the customizability. I have made the project to be as close as the design as possible to train my coding accuracy. This web app is also responsive.

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

At first, i encountered a problem where the data cannot be refreshed/randomized when i click the dice icon. But then, I've learned from documentations and forums like StackOverflow to find the solutions. This is the part where i learned how to use react hooks.

Then, another problem is when i hover the dice icon, the design said the circle needs to glow. To solve this problem, i made another div with absolute positioning and lower Z-index than the dice icon, then made a Javascript function to make it blurry when the dice icon is hovered, creating a glowing effect.