Skip to content

KhaledGharib/Weather-web-app

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

12 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Weather App

npm Handlebars.js HTML5 CSS3 Axios

Overview

This is a simple weather application that provides weather information based on user-provided location. It utilizes two APIs: Weatherstack for fetching weather data and Mapbox for geocoding user input.

Live Demo

Features

  • Location Search: Users can search for weather information by entering a location name or coordinates.
  • Responsive Design: The application is designed to be responsive, providing a consistent experience across different devices.

Technologies Used

  • Frontend: Handlebars.js, HTML, CSS
  • APIs: Weatherstack, Mapbox
  • JavaScript Libraries: Axios (for API requests), Bootstrap (for styling)

Installation

  1. Clone the repository:
git clone https://github.com/KhaledGharib/Weather-web-app.git
  1. Navigate to the project directory: cd weather-app
  2. Install dependencies: npm install
  3. Create a .env file in the root directory and add your API keys:
    WEATHERSTACK_API_KEY=your_weatherstack_api_key
    MAPBOX_API_KEY=your_mapbox_api_key
    
  4. Start the development server: npm start

Usage

  1. Open the application in your web browser.
  2. Enter a location in the search bar and press Enter or click the search button.
  3. View the current weather information displayed on the screen.

Contributing

Contributions are welcome! If you'd like to contribute to this project, please follow these steps:

  1. Fork the repository.
  2. Create a new branch: git checkout -b feature/new-feature
  3. Make your changes and commit them: git commit -m 'Add new feature'
  4. Push to the branch: git push origin feature/new-feature
  5. Submit a pull request.