diff --git a/app.js b/app.js
new file mode 100644
index 0000000..9960493
--- /dev/null
+++ b/app.js
@@ -0,0 +1,50 @@
+const apiKey = "e7cff01a4f5e000ab6975039c58a127a";
+const apiUrl =
+ "https://api.openweathermap.org/data/2.5/weather?units=metric&q=";
+
+const searchBox = document.querySelector(".search input");
+const searchBtn = document.querySelector(".search button");
+const weatherIcon = document.querySelector(".weather-icon");
+
+async function checkWeather(city) {
+ const response = await fetch(apiUrl + city + `&appid=${apiKey}`);
+
+ if (response.status == 404) {
+ document.querySelector(".error").style.display = "block";
+ document.querySelector(".weather").style.display = "none";
+ } else {
+ var data = await response.json();
+
+ document.querySelector(".city").innerHTML = data.name;
+ document.querySelector(".temp").innerHTML =
+ Math.round(data.main.temp) + "°c";
+ document.querySelector(".humidity").innerHTML = data.main.humidity + "%";
+ document.querySelector(".wind").innerHTML = data.wind.speed + " km/hr";
+
+ if (data.weather[0].main == "Clouds") {
+ weatherIcon.src = "images/clouds.png";
+ }
+
+ if (data.weather[0].main == "Clear") {
+ weatherIcon.src = "images/clear.png";
+ }
+
+ if (data.weather[0].main == "Rain") {
+ weatherIcon.src = "images/rain.png";
+ }
+
+ if (data.weather[0].main == "Drizzle") {
+ weatherIcon.src = "images/drizzle.png";
+ }
+ if (data.weather[0].main == "Mist") {
+ weatherIcon.src = "images/mist.png";
+ }
+
+ document.querySelector(".weather").style.display = "block";
+ document.querySelector(".error").style.display = "none";
+ }
+}
+
+searchBtn.addEventListener("click", () => {
+ checkWeather(searchBox.value);
+});
diff --git a/images/clear.png b/images/clear.png
new file mode 100644
index 0000000..d2bc413
Binary files /dev/null and b/images/clear.png differ
diff --git a/images/clouds.png b/images/clouds.png
new file mode 100644
index 0000000..75ef047
Binary files /dev/null and b/images/clouds.png differ
diff --git a/images/drizzle.png b/images/drizzle.png
new file mode 100644
index 0000000..01cd0e7
Binary files /dev/null and b/images/drizzle.png differ
diff --git a/images/humidity.png b/images/humidity.png
new file mode 100644
index 0000000..804ef0c
Binary files /dev/null and b/images/humidity.png differ
diff --git a/images/mist.png b/images/mist.png
new file mode 100644
index 0000000..15ee1fd
Binary files /dev/null and b/images/mist.png differ
diff --git a/images/rain.png b/images/rain.png
new file mode 100644
index 0000000..5c436c8
Binary files /dev/null and b/images/rain.png differ
diff --git a/images/search.png b/images/search.png
new file mode 100644
index 0000000..95ec64e
Binary files /dev/null and b/images/search.png differ
diff --git a/images/snow.png b/images/snow.png
new file mode 100644
index 0000000..e03778d
Binary files /dev/null and b/images/snow.png differ
diff --git a/images/wind.png b/images/wind.png
new file mode 100644
index 0000000..b9811a6
Binary files /dev/null and b/images/wind.png differ
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..e8e13fc
--- /dev/null
+++ b/index.html
@@ -0,0 +1,45 @@
+
+
+
+
+
+ Weather App
+
+
+
+
+
+
+
+
+
+
+
+
+
+
22°c
+
New York
+
+
+
+
+
+
+
+
+
15 km/hr
+
Wind Speed
+
+
+
+
+