https://github.com/ebrahimahmeddev/weather

Weather App A modern and responsive web application built with React, Vite, and Material UI, designed to display weather information for Cairo (or other cities in the future). It supports multiple languages (Arabic & English) using i18next, and integrates external APIs for accurate prayer and weather data.
https://github.com/ebrahimahmeddev/weather

axios i18n-react mui-material reactjs vite yarn

Last synced: about 2 months ago
JSON representation

Weather App A modern and responsive web application built with React, Vite, and Material UI, designed to display weather information for Cairo (or other cities in the future). It supports multiple languages (Arabic & English) using i18next, and integrates external APIs for accurate prayer and weather data.

• Host: GitHub
• URL: https://github.com/ebrahimahmeddev/weather
• Owner: EbrahimAhmedDev
• Created: 2025-08-03T23:15:32.000Z (11 months ago)
• Default Branch: master
• Last Pushed: 2025-08-14T07:58:28.000Z (10 months ago)
• Last Synced: 2025-09-22T05:25:58.633Z (9 months ago)
• Topics: axios, i18n-react, mui-material, reactjs, vite, yarn
• Language: JavaScript
• Homepage: https://weather-cairo.netlify.app/
• Size: 848 KB
• Stars: 0
• Watchers: 0
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# 🌤️ Cairo Weather App

A simple weather app built using **React + Vite**, displaying the current weather in **Cairo, Egypt**. It supports both **Arabic** and **English** languages with automatic direction adjustment (RTL/LTR), and fetches real-time weather data from the **OpenWeatherMap API**.

---

## 📸 Screenshots

### Arabic Interface 🇪🇬

![Arabic Screenshot](/screenshots%20for%20readme/ar.png)

### English Interface 🇬🇧

![English Screenshot](/screenshots%20for%20readme/en.png)

> 📝 You can place screenshots in a `/screenshots for readme` folder and update the image paths as needed.

---

## 🚀 Features

- ✅ Displays current temperature in °C.

- ✅ Shows max and min temperature.

- ✅ Weather condition description (e.g., cloudy, sunny, rainy...).

- ✅ Weather icon synced with the condition.

- ✅ Current date and day of the week formatted based on the selected language.

- ✅ Smooth language switching with layout direction change (`rtl`/`ltr`).

- ✅ Clean and modern UI built with **Material UI (MUI)**.

---

## 🧰 Tech Stack

| Tool / Library          | Purpose                    |

| ----------------------- | -------------------------- |

| React + Vite            | Frontend framework         |

| Material UI (MUI)       | UI components and styling  |

| Axios                   | Fetching data from API     |

| OpenWeatherMap API      | Source of weather data     |

| i18next + react-i18next | Multi-language translation |

---

## ⚙️ Getting Started

1. **Clone the repository**:

```bash

git clone https://github.com/EbrahimAhmedDev/weather

cd weather-app

yarn install

yarn dev

```

## 🧑 Developer

**Ebrahim Ahmed**  

Frontend Developer (Full Stack coming soon)

- GitHub: [github.com/EbrahimAhmedDev](https://github.com/EbrahimAhmedDev)