Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/luzefiru/odin-weather-app
A weather forecast app that uses OpenWeatherMap's API to practice asynchronous JavaScript & API data fetching.
https://github.com/luzefiru/odin-weather-app
Last synced: 5 days ago
JSON representation
A weather forecast app that uses OpenWeatherMap's API to practice asynchronous JavaScript & API data fetching.
- Host: GitHub
- URL: https://github.com/luzefiru/odin-weather-app
- Owner: Luzefiru
- Created: 2023-03-12T11:31:28.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2023-03-13T05:58:03.000Z (over 1 year ago)
- Last Synced: 2024-04-12T06:19:19.266Z (7 months ago)
- Language: JavaScript
- Homepage: https://luzefiru.github.io/odin-weather-app/
- Size: 44.7 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# odin-weather-app
A weather forecast app that uses OpenWeatherMap's API to practice asynchronous JavaScript & API data fetching.
This project allowed me to practice using the browser's `fetch()` command to do Cross-Origin Resource Sharing with an external API -- specifically the [OpenWeatherMap API](https://openweathermap.org/api). I used Promises and `async/await` to parse the data asynchronously utilizing the JavaScript Event Loop.
```JavaScript
async function getWeatherData(cityInput) {
const response = await fetch(
`https://api.openweathermap.org/data/2.5/weather?q=${cityInput}&units=metric&appid=${apiKey}`,
{ mode: 'cors' }
);
const weatherData = await response.json();return weatherData;
}
```I need to improve on:
- writing clean code
- planning out projects before doing them
- writing code with browser load speeds in mind# Output
### [Visit the Website Here](https://luzefiru.github.io/odin-weather-app/)
# Requirements
These were the requirements in The Odin Project's [Project: Weather App](https://www.theodinproject.com/lessons/node-path-javascript-weather-app) site to serve as project specifications. Website aesthetic choices and implementation solely depended on me, the programmer.