Preview:
<html>
   <head>
      <title>Launch Status</title>
      <script>
         window.addEventListener("load", function() {
            fetch("https://handlers.education.launchcode.org/static/weather.json").then( function(response) {
               response.json().then( function(json) {
                  const div = document.getElementById("weather-conditions");
                  // Add HTML that includes the JSON data
                  div.innerHTML = `
                     <ul>
                        <li>Temp ${json.temp}</li>
                        <li>Wind Speed ${json.windSpeed}</li>
                        <li>Status ${json.status}</li>
                        <li>Chance of Precip ${json.chanceOfPrecipitation}</li>
                     </ul>
                  `;
               });
            });
         });
      </script>
   </head>
   <body>
      <h1>Launch Status</h1>
      <h3>Weather Conditions</h3>
      <div id="weather-conditions">
         <!-- Weather data is added here dynamically. -->
      </div>
   </body>
</html>
downloadDownload PNG downloadDownload JPEG downloadDownload SVG

Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!

Click to optimize width for Twitter