Raed Alnan• 160
@raedalnan
Submitted
I have a problem dealing with api like every time I call the generate function ,return with the same advice .
Marija H.
@mh1251
All comments
- Marija H.• 110
@mh1251
Posted
I checked the live version of the exercise, it returns a new quote everytime i click on the button and it works :)) good job!
Also i wanted to comment about your commented out part (with fetch) of the app.js file. The code would work like that also, if you didn't store everything in the obj variable. In the obj variable you should store the data you retrieve from the fetch and then use it. Instead you should do it like this:
async function adviceGen(){ let obj = await fetch("https://api.adviceslip.com/advice") .then(res => res.json()) // It returns a promise by default, so you wont need the 'return' in front of res.json() // Now the data is stored in the obj variable, and we wait for the promise inside the fetch(with async/await) and now you can use it do the following: id.innerText = obj.slip.id ; advice.innerText = obj.slip.advice ; }so your function should work likes this:
async function adviceGen(){ let obj = await fetch("https://api.adviceslip.com/advice") .then(res => res.json()) id.innerText = obj.slip.id ; advice.innerText = obj.slip.advice ; }I hope this will help you also with further exercises, fetch is easier to use in my opinion so it will come in handy :)!!
Marked as helpful
1 - Jem0• 120
@Jem0
Submitted
I'm having trouble creating the hover effect in the design. Any advice would be appreciated!
Marija H.• 110@mh1251
Posted
Great job on the solution!! For the hover effect you can do this, it worked for me:
#btn-generate:hover { box-shadow: 0px 0px 30px 5px hsl(150, 100%, 66%); /*for a neon green color*/ transition: ease-in-out 500ms; }the box shadow property syntax is: horizontal-offset / vertical-offset / blur / spread / color
Marked as helpful
1
