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
Your session has expired please log in again.

Submitted

Advice generator

@VittorioDL

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


I appreciate any suggestion to improve my code! Feel free to tell me what I could have done better.

Community feedback

romila 3,570

@romila2003

Posted

Hi Vittorio,

Congratulations for 🎉 for completing your first challenge, the API looks great and is functional. It is great that you used the right semantic and the flex property to center the card. There are some suggestions I want to give:

  1. Your button is missing the type attribute
  2. Since you already gave your .container a max-width, you do not need to have a media query. Instead, you can give your body a margin property to prevent the card touching the side of the screen e.g. margin: 0 10px;
  3. Even though your API is functional on normal browsers, it won't work on Firefox without the clear cache e.g. fetch(URL, {cache: 'no-cache'})

Overall, great work and wish you the best for your future projects 👍.

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