diff --git a/JS Weather/README.md b/JS Weather/README.md
new file mode 100644
index 0000000..7cb14df
--- /dev/null
+++ b/JS Weather/README.md
@@ -0,0 +1,12 @@
+## A Simple Javascript Weather App
+##### Uses openweathermap api to fetch weather data.
+
+### Usage
+1. Enter the name of the city
+2. Hit enter
+
+### API
+
+1. Head over to https://openweathermap.org/api, signup to get your api key.
+2. Navigate to `script.js` and replace `const apikey = " "` with your key.
+3. Read the API documentation if you feel like it.
diff --git a/JS Weather/index.html b/JS Weather/index.html
new file mode 100644
index 0000000..9090482
--- /dev/null
+++ b/JS Weather/index.html
@@ -0,0 +1,24 @@
+
+
+
+
+
+ Weather App
+
+
+
+
+
+
+
+
+
+
diff --git a/JS Weather/script.js b/JS Weather/script.js
new file mode 100644
index 0000000..1059ef0
--- /dev/null
+++ b/JS Weather/script.js
@@ -0,0 +1,55 @@
+// Get your own ApiKey from https://openweathermap.org/api
+const apikey = "3265874a2c77ae4a04bb96236a642d2f";
+
+// Grab objects via DOM
+const main = document.getElementById("main");
+const form = document.getElementById("form");
+const search = document.getElementById("search");
+
+// Function that returns weatherdata
+const url = (city) =>
+ `https://api.openweathermap.org/data/2.5/weather?q=${city}&appid=${apikey}`; //
+
+async function getWeatherByLocation(city) {
+ const resp = await fetch(url(city), { origin: "cors" });
+ const respData = await resp.json();
+
+ console.log(respData);
+
+ addWeatherToPage(respData);
+}
+
+// Display the weather data
+function addWeatherToPage(data) {
+ const temp = KtoC(data.main.temp);
+
+ // DOM manipulation
+ const weather = document.createElement("div");
+ weather.classList.add("weather");
+
+ weather.innerHTML = `
+ 
${temp}°C
+ ${data.weather[0].main}
+ `;
+
+ // cleanup
+ main.innerHTML = "";
+
+ main.appendChild(weather);
+}
+
+// Temperature conversion
+function KtoC(K) {
+ return Math.floor(K - 273.15);
+}
+
+// Event listener for form submission
+form.addEventListener("submit", (e) => {
+ e.preventDefault();
+
+ const city = search.value;
+
+ if (city) {
+ getWeatherByLocation(city);
+ }
+});
diff --git a/JS Weather/style.css b/JS Weather/style.css
new file mode 100644
index 0000000..aae8fdf
--- /dev/null
+++ b/JS Weather/style.css
@@ -0,0 +1,42 @@
+@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;400;600&display=swap");
+
+* {
+ box-sizing: border-box;
+}
+
+body {
+ background: linear-gradient(300deg, #ced1d6, #bfc0c0);
+ font-family: "Poppins", sans-serif;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ margin: 0;
+ min-height: 100vh;
+}
+
+input {
+ background-color: #fff;
+ border: none;
+ border-radius: 25px;
+ box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
+ font-family: inherit;
+ font-size: 1rem;
+ padding: 1rem;
+ min-width: 300px;
+}
+
+input:focus {
+ outline: none;
+}
+
+.weather {
+ font-size: 2rem;
+ text-align: center;
+}
+
+.weather h2 {
+ display: flex;
+ align-items: center;
+ margin-bottom: 0;
+}