Update frontend/src/utils/apiFunc.ts

updated host version to 1.0.1

README.md

@@ -1,98 +1,9 @@
 # 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.
+This version is only meant for publishing on the web. It is not meant for local development or use.
 
-> For that we use the OpenWeatherMap API. You can get your own API key by signing up at [OpenWeatherMap](https://openweathermap.org/api).
+You can find the web version of the Weather App at [https://weather.the1s.de](https://weather.the1s.de).
-
-## 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
 
-**v1.0.1-local**
+Currently hosted version: **1.0.1**

docker-compose.yml

@@ -1,9 +1,11 @@
 services:
   frontend:
-    container_name: frontend
+    container_name: weather-frontend
     build: ./frontend
     ports:
       - "7002:7002"
+    networks:
+      - proxynet
     environment:
       - CHOKIDAR_USEPOLLING=true
     volumes:
@@ -18,3 +20,7 @@ services:
 #volumes:
 #  - ./backend:/bikelane-backend
 # restart: unless-stopped
+
+networks:
+  proxynet:
+    external: true

frontend/src/utils/apiFunc.ts

@@ -7,7 +7,7 @@ export const fetchWeather = async (
 ) => {
   // Get location data
   const location = await fetch(
-    `http://api.openweathermap.org/geo/1.0/direct?q=${city}&appid=${apiKey}`
+    `https://api.openweathermap.org/geo/1.0/direct?q=${city}&appid=${apiKey}`
   ).then((response) => {
     if (response.status === 401) {
       myToast(

frontend/vite.config.ts

@@ -1,12 +1,17 @@
 import { defineConfig } from "vite";
 import tailwindcss from "@tailwindcss/vite";
+
 export default defineConfig({
   plugins: [tailwindcss()],
-    server: {
+  server: {
     host: "0.0.0.0",
+    allowedHosts: ["weather.the1s.de"],
     port: 7002,
-    watch: {
+    watch: { usePolling: true },
-      usePolling: true,
+    hmr: {
+      host: "weather.the1s.de",
+      port: 7002,
+      protocol: "wss",
     },
   },
 });