This project is built using HTML, CSS and React framework. It allows users to get real-time weather information for their current location or any other location they search for. The app fetches weather from a reliable weather API and presents it in a user-friendly and visually appealing manner.
Real-time Weather Data: The app provides up-to-date weather information for any location worldwide.
Search Functionality: Users can search for weather information for a specific location by entering its city name, and displaying the coordinates (latitude and longitude).
Weather Details: The app presents detailed weather information, including temperature, humidity, wind speed, and weather condition.
Weather Forecast: Presents the weather forecast for the next few days, including high and low temperatures, enabling users to plan their travel activities accordingly.
Climate Change: Informs users to learn more about climate change and steps to take action.
This weather app uses OpenWeatherMap and Google Maps API to fetch weather data. To set up and use the API keys:
- Visit OpenWeatherMap website and create an account.
- Visit Google Maps website and create an account
- To obtain an API key after creating an account. This key will be required to make API calls.
- Copy and then paste the API keys into the project code.
- Save the changes.
You can view this project by clicking here
Contributions to this project are welcome. If you would like to contribute to the project, please follow these steps here:
- Fork the WeatherApp repository and then clone the project.
- Create a new branch for a feature or fix a bug.
- Make necessary changes in your new branch (The one you created).
- Test your changes thoroughly.
- Save your changes before committing and pushing them into Github (Most important).
- Submit a pull request to the main repository.
Contribution guidelines for this project
Note
If you have a suggestion that would make this better, please fork the repository and create a pull request. You can also report an issue with the label tag. Provide detailed information about the problem you faced, steps to reproduce it, and any relevant screenshots if possible.