Proszę o ocenę mojego kodu i podpowiedzi jak mogę go ulepszyć.
Korzystam z zewnętrznego API aby pobrać obrazek i opis obrazka.
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<img src="" id="image">
<div id="description">
</div>
<button type="button" id="button">Click</button>
</body>
<script>
const apiKey = "Su8G5LQ9U0ZmnBx34MGpqxhsh5Zh2FPmWHA5dCFa";
const apiURL = "https://api.nasa.gov/planetary/apod?api_key=";
const image = document.getElementById("image");
const button = document.getElementById("button");
const description = document.getElementById("description");
const getImage = () => {
requestAPI();
}
const requestAPI = () => {
fetch(`${apiURL}${apiKey}`)
.then(response => {
return response.json();
})
.then(data => {
image.src = data.url;
description.innerText = data.explanation;
});
}
button.addEventListener("click", getImage);
</script>
</html>
EDIT: Kod zaktualizowany po wskazanych poprawkach.