Skip to content

Commit 09fdc82

Browse files
jwoolbright23jwoolbright23
committed
fetch chapter added with chapter-examples
1 parent e9ee479 commit 09fdc82

File tree

3 files changed

+77
-0
lines changed

3 files changed

+77
-0
lines changed

‎fetch/chapter-examples/fetching-data/fetch-weather-part-1.html

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Launch Status</title>
6+
<script>
7+
window.addEventListener("load", function() {
8+
fetch("https://handlers.education.launchcode.org/static/weather.json").then( function(response) {
9+
console.log(response);
10+
} );
11+
});
12+
</script>
13+
</head>
14+
<body>
15+
<h1>Launch Status</h1>
16+
Weather Conditions
17+
<div id="weather-conditions">
18+
<!-- TODO: dynamically add html about weather using data from API -->
19+
</div>
20+
</body>
21+
</html>

‎fetch/chapter-examples/fetching-data/fetch-weather-part-2.html

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Launch Status</title>
6+
<script>
7+
window.addEventListener("load", function() {
8+
fetch("https://handlers.education.launchcode.org/static/weather.json").then( function(response) {
9+
// Access the JSON in the response
10+
response.json().then( function(json) {
11+
console.log(json);
12+
});
13+
});
14+
});
15+
</script>
16+
</head>
17+
<body>
18+
<h1>Launch Status</h1>
19+
Weather Conditions
20+
<div id="weather-conditions">
21+
<!-- TODO: dynamically add html about weather using data from API -->
22+
</div>
23+
</body>
24+
</html>

‎fetch/chapter-examples/fetching-data/fetch-weather-part-3.html

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Launch Status</title>
6+
<script>
7+
window.addEventListener("load", function() {
8+
fetch("https://handlers.education.launchcode.org/static/weather.json").then( function(response) {
9+
// Access the JSON in the response
10+
response.json().then( function(json) {
11+
const div = document.getElementById('weather-conditions');
12+
div.innerHTML = `
13+
<ul>
14+
<li>Temp ${json.temp}</li>
15+
<li>Wind Speed ${json.windSpeed}</li>
16+
<li>Status ${json.status}</li>
17+
<li>Chance of Precip ${json.chanceOfPrecipitation}</li>
18+
</ul>
19+
`;
20+
});
21+
});
22+
});
23+
</script>
24+
</head>
25+
<body>
26+
<h1>Launch Status</h1>
27+
Weather Conditions
28+
<div id="weather-conditions">
29+
<!-- TODO: dynamically add html about weather using data from API -->
30+
</div>
31+
</body>
32+
</html>

0 commit comments

Comments
 (0)