scrimba
Frontend Career Path
Working with APIs
Promise Rejection
Weather - Get user's current weather
Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

Weather - Get user's current weather
AboutCommentsNotes
Weather - Get user's current weather
Expand for more info
index.js
run
preview
console
fetch("https://apis.scrimba.com/unsplash/photos/random?orientation=landscape&query=nature")
.then(res => res.json())
.then(data => {
document.body.style.backgroundImage = `url(${data.urls.regular})`
document.getElementById("author").textContent = `By: ${data.user.name}`
})
.catch(err => {
// Use a default background image/author
document.body.style.backgroundImage = `url(https://images.unsplash.com/photo-1560008511-11c63416e52d?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=MnwyMTEwMjl8MHwxfHJhbmRvbXx8fHx8fHx8fDE2MjI4NDIxMTc&ixlib=rb-1.2.1&q=80&w=1080
)`
document.getElementById("author").textContent = `By: Dodi Achmad`
})

fetch("https://api.coingecko.com/api/v3/coins/dogecoin")
.then(res => {
if (!res.ok) {
throw Error("Something went wrong")
}
return res.json()
})
.then(data => {
document.getElementById("crypto-top").innerHTML = `
<img src=${data.image.small} />
<span>${data.name}</span>
`
document.getElementById("crypto").innerHTML += `
<p>🎯: $${data.market_data.current_price.usd}</p>
<p>👆: $${data.market_data.high_24h.usd}</p>
<p>👇: $${data.market_data.low_24h.usd}</p>
`
})
.catch(err => console.error(err))

// function getCurrentTime() {
// const date = new Date()
// document.getElementById("time").textContent = date.toLocaleTimeString("en-us", {timeStyle: "short"})
// }

// setInterval(getCurrentTime, 1000)


/**
* Challenge: Get the user's current weather for their area and
* log it to the console
*
* BaseURL: https://apis.scrimba.com/openweathermap/data/2.5/weather
* Queries to include:
* - lat (latitude)
* - lon (longitude)
* - units (imperial or metric)
*/

navigator.geolocation.getCurrentPosition(position => {
console.log(position)
});
Console
GeolocationPosition
,
/index.html
-4:46