# 🌤️  Complete GitHub Actions CI/CD Weather Forecast App on Ghaymah Cloud

A simple  modern **Flask-based weather forecast application** that fetches real-time weather data from [OpenWeatherMap](https://openweathermap.org/) and provides a beautiful, responsive UI. This project is **Dockerized** and supports **CI/CD deployment** to **Ghaymah Cloud** using the included shell script.  


## 🚀 Features  

- 🌍 Search weather for any city worldwide  
- 🌡️ Shows temperature, feels-like, humidity, pressure, wind speed, and visibility  
- 🌅 Displays sunrise and sunset times  
- 📊 Auto-updating with timestamp  
- 🎨 Responsive and modern UI (HTML, CSS, JS embedded in Flask)  
- 🐳 Dockerized for portability  
- ☁️ CI/CD ready with Ghaymah Cloud 


## 📂 Project Structure  

```
.
├── .github/workflows/cicd.yaml        # GitHub Actions CI/CD workflow for my App 
├── app.py                             # Flask application with weather API integration
├── CICDpipeline.sh                    # CI/CD pipeline script for Docker + Ghaymah Cloud
├── Dockerfile                         # Dockerfile to containerize the Flask app
├── requirements.txt                   # Python dependencies
├── templates/                         # HTML templates (auto-generated by Dockerfile)
└── README.md                          # Documentation
```

## ⚙️ Prerequisites  

Before running or deploying the app, ensure you have:  

- [Python 3.9+](https://www.python.org/downloads/)  
- [Docker](https://docs.docker.com/get-docker/)  
- [Ghaymah CLI (`gy`)](https://docs.ghaymah.io) installed and configured  
- An [OpenWeatherMap API key](https://home.openweathermap.org/api_keys)  




## 🖥️ On Your Terminal

1. **Install Ghaymah CLI**
   ```bash
   curl -sSl https://cli.ghaymah.systems/install.sh | bash
   ```

2. **Navigate to Ghaymah Binary Directory & Create Project Files**
   ```bash
   cd /ghaymah/bin
   ```
   Create the following files:
   - `Dockerfile`
   - `index.html`

3. **Set Project Name**
   ```bash
   gy r c p --set .name="project name"
   ```

4. **Initialize Project with Your Ghaymah Project ID**
   ```bash
   gy r a init -p project-id
   ```

5. **Copy Configuration File**
   - Copy the generated `.ghaymah.json` file to your repository.

## 🌩️ On Your GitPasha Account

1. **Add Repository Secrets**
   - `DOCKERHUB_USERNAME`
   - `DOCKERHUB_PASSWORD`
   - `GHAYMAH_EMAIL`
   - `GHAYMAH_PASSWORD`

2. **Push Your Repository**
   ```bash
   git add .
   git commit -m "Initial commit for Ghaymah deployment"
   git push origin main
   ```

---

✅ **Now your project is ready for automatic deployment via Ghaymah Cloud!**






## 🛠️ Local Development  

1. Clone this repository:  

   ```bash
   git clone https://github.com/your-username/weather-app.git
   cd weather-app
   ```

2. Create and activate a virtual environment:  

   ```bash
   python -m venv venv
   source venv/bin/activate   # Linux/Mac
   venv\Scripts\activate      # Windows
   ```

3. Install dependencies:  

   ```bash
   pip install -r requirements.txt
   ```

4. Run the app:  

   ```bash
   python app.py
   ```

5. Open your browser at:  
   👉 http://127.0.0.1:5000



## 🐳 Running with Docker  

1. Build the Docker image:  

   ```bash
   docker build -t weather-app:1 .
   ```

2. Run the container:  

   ```bash
   docker run -p 5000:5000 weather-app:1
   ```

3. Visit the app at:  
   👉 http://localhost:5000



# ☁️ Deployment to Ghaymah Cloud uisng **CICDpipeline.sh** Script 

This project includes a **CICDpipeline.sh** script that:  
- Builds and tags Docker images  
- Pushes them to Docker Hub  
- Creates a `.ghaymah.json` config  
- Deploys the app to **Ghaymah Cloud**  

### 🔧 Steps  

1. Make the script executable:  

   ```bash
   chmod +x CICDpipeline.sh
   ```

2. Run the deployment script:  

   ```bash
   ./CICDpipeline.sh
   ```

3. Follow the prompts:  
   - Enter your **Ghaymah Project Name**  
   - Enter your **App Name**  

4. If Ghaymah CLI is installed, the app will be deployed automatically.  

✅ Your app will be accessible at:  

```
https://<your-app-name>.hosted.ghaymah.systems
```

## 🎥 Project Record
[Watch the Demo](https://app.gitpasha.com/AhmedGamalYousef/Complete-CI-CD-Project-pipeline-on-Ghaymah-Cloud/src/branch/main/demo/CICDonGhaymahCloud.mp4)