Weather reporter

weather-reporter.vue

<template>

<div>
    <div>{{ WeatherData }}</div> <!-- Show weather data here -->
    <form action="#" @submit.prevent="getWeatherData">
        <input v-model="zipCode" type="text" placeholder="Enter your ZIP code" />
    </form>
</div>
    
</template>

<script>
const countryCode = 'US'
const apiKey = '' // the openweathermap api key
export default {
    data() {
        return {
            zipCode: '',
            weatherData: null,
        }
    },

    methods: {
        async getWeatherData() {
            this.weatherData = await fetch(`api.openweathermap.org/data/2.5/weather?zip=${this.zipCode},${countryCode}&appid=${apiKey}`).then(res => res.json())
        }
    }
}
</script>