An open API service indexing awesome lists of open source software.

https://github.com/dak79/odin-weather

Weather app
https://github.com/dak79/odin-weather

css html javascript openweather-api webpack

Last synced: 2 months ago
JSON representation

Weather app

Awesome Lists containing this project

README

          

# Weather App

## Live Preview

[Weather](https://dak79.github.io/odin-weather/)

## Description

This project is part of The Odin Project - Full Stack JavaScript Path. The main goals is to implement a maintainable web app, exploring promises and API usage.
Weather informations are provided by [OpenWeather](https://openweathermap.org/).

## Technologies

- HTML
- CSS
- JavaScript ES6
- Git
- Npm
- Webpack

## Assignment

- Set up a blank HTML document with the appropriate links to your JavaScript and CSS files.
- Write the functions that hit the API. You’re going to want functions that can take a location and return the weather data for that location. For now, just `console.log()` the information.
- Write the functions that process the JSON data you’re getting from the API and return an object with only the data you require for your app.
- Set up a simple form that will let users input their location and will fetch the weather info (still just `console.log()` it).
- Display the information on your webpage!
- Add any styling you like!
- Optional: add a ‘loading’ component that displays from the time the form is submitted until the information comes back from the API.
- Push that baby to GitHub and share your solution below!

## Credit

Background pictures:

- Thunderstorm photo by Michelle McEwen on Unsplash
- Drizzle photo by Thom Milkovic on Unsplash
- Rain photo by Valentin Müller on Unsplash
- Snow photo by Aaron Burden on Unsplash
- Mist photo by Alessio Soggetti on Unsplash
- Smoke photo by Damon Lam on Unsplash
- Haze photo by Jaleel Akbash on Unsplash
- Dust photo by Artin Bakhan on Unsplash
- Fog photo by Anna Goncharova on Unsplash
- Sand photo by Wolfgang Hasselmann on Unsplash
- Ash photo by Yosh Ginsu on Unsplash
- Squall photo by Nick Fewings on Unsplash
- Tornado photo by NOAA on Unsplash
- Clear photo by Joakim Berglund on Unsplash
- Clouds photo by Łukasz Łada on Unsplash
- General photo by NASA on Unsplash