The Weather Forecast is a simple web application to display 5-day wearher forecast for selected location.
To get forecast data and cities locations the following APIs was used:
You need to create an account on https://openweathermap.org/ to get your free api key.
Demo version was deployed on Heroku, using CircleCI, and can be accesed here.
To setup the project locally you need to follow these steps:
-
Create an account on https://openweathermap.org/ website to get your API key.
-
Install node (if you haven't installed it yet)
- Installation: https://nodejs.org/en/download/
- Clone the repo
$ git clone https://github.com/wikk2207/Weather-Forecast.git- Install project dependencies in the project root directory
$ cd Weather-Foreast
$ npm install-
Create
.envfile in the project root directory. You can find needed variables in.env.examplefile. Use there your API key from https://openweathermap.org/. -
Start the app
$ npm start- Run the appplication with
npm start - Run the storybook with
npm run storybook - Run tests with
npm test
This project is only a basic implementation, which I was able to do in such a short time, that was given for this task, so structure and styles may need some improvement.
Some explanation to "Missing data" on forecast details modal:
I used the forecast API which returns hourly forecast only for next 48 hours and I show the statisctis only if a selected day contains complete data set with hourly forecast (24 hours). It mean that in current implementation the statisctis are shown only for the next day.
- Add padding to the main page, because it looks bad on small devices
- Enlarge a text in an icon tooltip
- Use an API with more hourly forecast data :)
- Use some API to get cities instead of having them hardcoded