Submitted about 2 years ago

Advice App Using React and SCSS

bem, react

Hamzat Lawal•560

@EngineerHamziey

A solution to the Advice generator app challenge

Preview Code

Solution retrospective

Hello Seniors, this is my first react project. I Have been so busy at work that It's hard to find time to learn, kindly help me to review this solution.

Here are my questions:

Do I always have to set dummy values for states before data arrive from the API like I did here?

 const [advice, setAdvice] = useState(
    {
      "slip": {
        "id": 0, 
        "advice": ""
      }
    }
  )

Is there any details I am missing in the UI?
kindy go through my react code, what should I improve on?
what do you think of my BEM class name usage? am I getting it?

Code

Please log in to post a comment

Community feedback

visualdennis•8,375
@visualdenniss
Posted about 2 years ago
No, you don't have to set a dummy data with the corresponding object structure.

I've set it so in mine e.g.: const [advice, setAdvice] = useState('Click on Dice below to get an advice')

You can also set useState("") etc. Just make sure if you are expecting array or object, do not try to read data before it is there. For example if you expect an array of objects, and then in your JSX, if you use map method like data.map((item)=> item ), you'll get error of cannot read property of undefined, because it'll try to render initially when you data has not being fetched and put into state yet. But you can fix that usually with data?.map or {data && data.map()}

Hope you find this feedback helpful!
Marked as helpful

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