https://github.com/aman1-2/weather-api-js

This Project is to understand how the API's works and how we can enable the functionality of javascript in our project.
https://github.com/aman1-2/weather-api-js

css3 html5 javascript

Last synced: 2 days ago
JSON representation

This Project is to understand how the API's works and how we can enable the functionality of javascript in our project.

• Host: GitHub
• URL: https://github.com/aman1-2/weather-api-js
• Owner: aman1-2
• License: gpl-3.0
• Created: 2023-10-03T07:36:18.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-04-26T08:25:56.000Z (9 months ago)
• Last Synced: 2025-01-25T09:13:07.360Z (2 days ago)
• Topics: css3, html5, javascript
• Language: JavaScript
• Homepage:
• Size: 2.1 MB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Weather Application Description

## Overview

This Markdown document provides a descriptive overview of a JavaScript program for a weather application. The application allows users to view weather information based on their current location or a location they search for.

## Program Structure

The program consists of the following key components:

1. **Tab Handling**: Controls switching between the "User Weather" tab (displaying weather based on the user's current location) and the "Search Weather" tab (displaying weather based on a searched location).

   

2. **User Weather Handling**:

   - Grants access to the user's current location.

   - Retrieves user coordinates either from session storage or through geolocation.

   - Handles errors related to geolocation availability or denied permission.

   - Fetches weather information based on the user's coordinates using the OpenWeatherMap API.

   - Renders the weather information on the UI.

![User Search Tab](./Assests/YourWeather-tab.jpeg)

3. **Search Weather Tab Handling**:

   - Allows users to input a location to search for weather information.

   - Fetches weather information based on the searched location using the OpenWeatherMap API.

   - Renders the weather information on the UI.

![Search Tab](./Assests/Search-tab.jpeg)

## Functionality

- **Tab Switching**: Users can switch between the "User Weather" and "Search Weather" tabs to view weather information for their current location or a searched location.

- **User Location**: The application retrieves the user's current location either through geolocation or from session storage if available.

- **Error Handling**: Handles various errors such as denied geolocation permission or invalid search queries.

- **Loading Screen**: Displays a loading screen while fetching weather information from the API.

- **Rendering Weather Information**: Displays weather details such as temperature, wind speed, humidity, and cloudiness for the selected location.

![Result Tab](./Assests/result.jpeg)

## Usage

To use the application:

1. Open the web page containing the weather application.

2. Click on the "User Weather" tab to view weather information based on your current location.

3. Alternatively, click on the "Search Weather" tab and enter a location to view weather information for that location.

## Dependencies

- The application relies on the OpenWeatherMap API to fetch weather information.

## Future Enhancements

- Implement caching mechanisms to reduce API calls and improve performance.

- Add support for additional weather forecast data such as hourly or weekly forecasts.

- Enhance error handling to provide more user-friendly error messages and suggestions.

- Improve UI/UX design for better user interaction and visual appeal.