Weather Prediction with React JS
Getting Started
To get started, run the following code in your terminal
$ create-react-app weather_app
Once done, run the following two lines in your terminal:
$ cd weather_app
$ npm start
This will allow you to see your React app update live on a localhost server.
Next, open your project and delete the default contents that App.js comes with.
Here is the folder structure.
I am using OpenWeatherMap API for weather data, Semantic UI React, and Weather Icons for icons.
By default, we will show a forecast of the current location. To get the current location
This API will provide you with the latitude, longitude, country, city of the current location.
Now once you have location ,we need to get weather details.
In order to do this, I used the OpenWeatheropeAPI . I’ll walk you through the steps of getting an API key and using api.
1 .Go to → https://home.openweathermap.org/api_keys and signUp.
2 .Go to https://home.openweathermap.org/api_keys and get api_key.
OpenWeatherapi provides with many services.
1 . We want forecast of today and next 7 days .
2 .We want temperature of next 24 hour.
There is an api which will provide both ONE-CAll-API .
const url = `https://api.openweathermap.org/data/2.5/onecall?lat=${lat}&lon=${lon}&appid=${api_key}`
we will get daily data of 8 days and hourly data of next 48hours.
