My Weather Application is a modern weather tracking app built with React and Recoil, utilizing the OpenWeather API for fetching real-time weather data. The application supports real-time tracking of the user's current location and allows searching for weather information in other cities.
- Real-time weather tracking for the user's current location
- Search functionality for weather information in other cities
- Responsive and user-friendly interface
- State management with Recoil for efficient data handling
- React: JavaScript library for building user interfaces
- tailwind :
- Recoil: State management library for React
- OpenWeather API: Source of weather data
- Axios: Promise-based HTTP client for making API requests
-
Clone the repository:
git clone https://github.com/your-username/my-weather-app.git cd my-weather-app
-
Install dependencies:
npm install
-
Create a
.env
file in the root directory and add your OpenWeather API key:REACT_APP_OPENWEATHER_API_KEY=your_openweather_api_key
-
Start the development server:
npm run dev
The application will automatically detect the user's location and display the current weather information upon loading.
Users can search for weather information in other cities using the search bar. Simply enter the city name and hit "Enter" to fetch and display the weather details for the specified location.
my-weather-app/
├── public/
│ ├── index.html
│ └── ...
├── src/
│ ├── components/
│ │ ├── Header.js
│ │ ├── WeatherCard.js
│ │ └── ...
│ ├── recoil/
│ │ ├── atoms.js
│ │ └── selectors.js
│ ├── utils/
│ │ └── api.js
│ ├── App.js
│ ├── index.js
│ └── ...
├── .env
├── .gitignore
├── package.json
└── README.md
Contributing
Contributions are welcome! Please open an issue or submit a pull request if you have any improvements or bug fixes.
Contact
For any inquiries, please contact me at rksharma041976@gmail.com .
Thank you for using My Weather Application! Stay updated with the latest weather information, no matter where you are.
Feel free to customize the sections with your specific information, such as your GitHub repository link, contact email, and any additional details about your application.