-
One of the most famous dashboard functionalities over the entire webspace is about the Weather App.
-
Here, we have created the same Weather App Dashboard which includes the weather information and details about the location of the user (The Weather App automatically detects the current location of the user, given that the permission is provided by the user)! These details include:
- Location Weather Description
- Location Temperature (along with Maximum and Minimum Temperatures.
- Location Pressure
- Location Humidity
- Location Wind Speed
-
Taking this Weather App Dashboard to the next level, we have integrated the information about the natural calamities like
- Earthquakes
- Floods
- Storms
- Droughts
- Extreme Temperatures
- Landslides
- Wildfires, Volcanic Activities and Mass Movement (Dry)
-
The above functionalities are fulfilled from the data provided by the followings APIs:
-
OpenWeatherMap API - https://openweathermap.org/api
-
WHO Natural Calamities - https://www.who.int/health-topics/earthquakes#tab=tab_1
-
WHO Economic Losses, Poverty & Disasters (1998-2017) - https://www.preventionweb.net/files/61119_credeconomiclosses.pdf
- React JS
- React ApexChart
- D3 JS
- React Google Charts
- AOS (Animate On Scroll)
- Google Maps Api and more ...
- Clone the main branch
- Open that Folder with VSCode
- In VS Code Sidebar, Search for "API_KEY" and assign your "openweathermap API key".
- Clone the geographs branch in other folder
- Open That folder in new VS Code window.
- Enter your google maps key in place of (*YOUR_KEY)
- Start your Live Server ( If you don't have live server. Search "LIVE SERVER" in vscode extension install it and run it.)
- Now Go to main branch folder open terminal with folder location.
- Write "npm install" in terminal. (It will download the required pakages.)
- Write "npm start" in terminal.
That's it 😀, the website will be up and running in the Browser.