# Weather App

This is a simple weather application that allows users to view current weather data for a specified location. The app is built using React and TypeScript, and it fetches weather data from an external API.

> For that we use the OpenWeatherMap API. You can get your own API key by signing up at [OpenWeatherMap](https://openweathermap.org/api).

## Features

- Search for weather by city name
- Display current weather conditions including temperature, humidity, and wind speed
- Responsive design for mobile and desktop views
- Change API key preferences
- Display weather data in a user-friendly format

## Installation

### Prerequisites

To install and run this application, you need the following tools:

- Git (for cloning the repository)

**and**

- Node.js (v14 or higher)
- npm (Node Package Manager)

**or**

- Docker (for running the app in a container)

### 1st step - Get the source code

**You can either clone the repository or download the latest release. Keep in mind that the cloned version may contain bugs.**

1. Clone the repository:
   ```bash
   git clone https://git.the1s.de/theis.gaedigk/weather-app.git
   ```

**or**

1. Download the latest release from the [releases page](https://git.the1s.de/theis.gaedigk/weather-app/releases/latest).
2. Unzip the downloaded file to your desired location.

#### 2nd step - Using Node.js and npm

1. Navigate to the frontend project directory:
   ```bash
   cd weather-app/frontend
   ```
2. Install dependencies:
   ```bash
   npm install
   ```
3. Start the development server:
   ```bash
   npm run dev
   ```
4. Open your browser and go to `http://localhost:7002` to view the app.
   **Note:** There is also a backend server directory, which is currently not in use. - You can ignore it for now.

**or**

#### 2nd step - Using Docker

1. Navigate to the root path project directory:
   ```bash
   cd weather-app
   ```
2. Run in a Docker container:
   ```bash
   docker compose up -d --build
   ```
3. Open your browser and go to `http://localhost:7002` to view the app.
   **Note:** There is also a backend server directory, which is currently not in use. - You can ignore it for now.

## Usage

1. Get an API key from [OpenWeatherMap](https://openweathermap.org/api).
2. Click on the "Set API Key" button in the header to enter your API key.
3. Enter a city name in the search bar and press Enter or click the "Get Weather" button.

**Now you can view the current weather data for the specified city!**

# Other Information

## Technologies Used

- React
- TypeScript
- Tailwind CSS
- OpenWeatherMap API
- Vite

## Version

**1.0.1**