Here is the demo of this project
The Weather App is a dynamic web application developed using React.js that provides real-time weather information for any city around the world. Users can easily search for a city and receive data including temperature, humidity, wind speed, and other essential weather details. This project demonstrates the use of React's component-based architecture, state management, and API integration.
- Search Functionality: Users can input any city name to fetch its current weather information.
- Real-Time Data: The app utilizes the OpenWeatherMap API to display up-to-date weather data.
- Responsive Design: The application is designed to be fully responsive, ensuring a seamless experience on both desktop and mobile devices.
- Weather Details: Displays various weather parameters such as:
- Current Temperature
- Humidity
- Wind Speed
- Weather Conditions (e.g., clear, cloudy, rainy)
- User-Friendly Interface: Intuitive UI for easy navigation and interaction.
- React.js: JavaScript library for building user interfaces.
- OpenWeatherMap API: External API used to fetch real-time weather data.
- CSS/SCSS: For styling the application and ensuring responsiveness.
- Axios: For making HTTP requests to the weather API.
To get a local copy of the project up and running, follow these simple steps:
- Node.js (v14 or later)
- npm (Node Package Manager)
-
Clone the repository:
git clone https://github.com/your-username/weather-app.git
-
Navigate to the project directory:
cd weather-app
-
Install the required packages:
npm install
-
Obtain an API key from OpenWeatherMap and replace it in the
src/config.js
file:const API_KEY = 'YOUR_API_KEY';
-
Start the application:
npm start
-
Open your browser and visit
http://localhost:3000
to view the app.
- Enter the name of a city in the search bar.
- Click on the search button or press Enter to fetch the weather information.
- The app will display the current weather conditions, including temperature, humidity, and wind speed.
Contributions are welcome! If you would like to contribute to the Weather App, please follow these steps:
- Fork the repository.
- Create a new branch (
git checkout -b feature/YourFeature
). - Make your changes and commit them (
git commit -m 'Add some feature'
). - Push to the branch (
git push origin feature/YourFeature
). - Open a Pull Request.
- OpenWeatherMap for providing the weather data API.
- React.js for making web development more efficient.