Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Advice Generator App (HTML, CSS/SASS, JavaScript, API)

@nyrellcl

Desktop design screenshot for the Advice generator app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
  • API
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


This was my first project utilizing an API. I was very excited to start and finally finish this.

Any suggestions on best practices, such as utilizing API's, concise and more convenient SASS coding, and Javascript tips with APIs are very much welcome.

Thank you!

Community feedback

Alex 330

@CallMe-AL

Posted

Looks good Nyrell, congrats on finishing your first project utilizing an API!! Looks very good too. Some minor suggestions:

  1. I'd wrap your code inside the fetchAdvice() function in a try/catch block to catch errors. You could also add an if statement to see if your response returns 200-209 (ex: if (response.ok){ ...some code }). You might find this video useful for some extra tips: https://www.youtube.com/watch?v=_9vgd9XKlDQ

  2. UI-wise the dice remains rotated after I click on it, unless I click off. You might also want to add some styling to let users know there's the 2 second wait between advice (like a countdown timer and a way to prevent clicking the button, or something).

Great job again, keep it up!

0

@nyrellcl

Posted

Hi @CallMe-AL ! Thank you so much! I plan to do even more projects with APIs now lol

  1. I will definitely work on implementing both of those suggestions, which sounds like will make the code operate better. I will also watch the link you provided!

  2. Ah yes, that’s what i forgot to mention and ask a question about. I’m glad you pointed it out as I was stuck on that. The timer idea sounds like a good idea to try out!!

Thank you for taking the time to suggest!!

1
Alex 330

@CallMe-AL

Posted

@nyrellcl Absolutely, I'm glad the advice was helpful! Good luck with the changes and hope you enjoy the video! Happy coding, looking forward to hopefully seeing more from you on the site!

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord