# Florale Emotion - Website & Backend

Die komplette technische Umsetzung der Florale Emotion Website mit Backend-Services.

## 🌸 Überblick

Diese Website ist ein komplettes Business-Setup für ein Blumengeschäft spezialisiert auf Hochzeiten, Beerdigungen und Events.

## 🚀 Features

### Website (Angular + Tailwind CSS)
- ✅ Responsive Design für alle Geräte
- ✅ Portfolio-Galerie mit Filterung
- ✅ Kontaktformular mit Event-Details
- ✅ SEO-optimiert mit strukturierten Daten
- ✅ Logo-Integration mit passender Typografie

### Backend & Integration (Node.js)
- ✅ E-Mail-System mit Templates
- ✅ Automatische Ticket-Erstellung in Gitea
- ✅ Kundenbenachrichtigungen
- ✅ Team-Benachrichtigungen

### Social Media Automation
- ✅ Multi-Platform Bot (Instagram, Facebook, TikTok, Mastodon, YouTube)
- ✅ Automatische Posts nach Zeitplan
- ✅ Content-Templates für verschiedene Anlässe

## 📁 Projektstruktur

```
website/
├── src/                          # Angular Frontend
│   ├── app/
│   │   ├── components/          # Wiederverwendbare Komponenten
│   │   ├── pages/               # Seiten-Komponenten
│   │   └── services/            # Angular Services
│   ├── assets/                  # Statische Assets (Logo, etc.)
│   └── styles.scss             # Globale Styles
├── backend/                     # Node.js Backend
│   ├── server.js               # Express Server
│   └── package.json            # Backend Dependencies
├── social-media-bot/           # Social Media Automatisierung
│   ├── bot.js                  # Haupt-Bot Logik
│   └── package.json            # Bot Dependencies
├── templates/                   # E-Mail & Content Templates
│   ├── email-templates.html    # E-Mail Templates
│   └── social-media-content.md # Social Media Content
├── gitea-setup.md              # Gitea Ticket-System Setup
└── package.json                # Haupt-Dependencies & Scripts
```

## 🛠️ Installation & Setup

### Voraussetzungen
- Node.js (v16+)
- Angular CLI
- Git

### 1. Dependencies installieren
```bash
npm install
```

### 2. Alle Services starten
```bash
npm run dev  # Startet Frontend, Backend & Bot gleichzeitig
```

### 3. Einzelne Services starten
```bash
# Frontend (Angular) - Port 4200
npm run frontend

# Backend (Node.js) - Port 3000
npm run backend

# Social Media Bot testen
npm run bot
```

## ⚙️ Konfiguration

### E-Mail Setup (mailbox.org)
```bash
# Backend-Konfiguration
cp env.example .env
# .env Datei mit echten SMTP-Daten ausfüllen
```

### Social Media Bot
```bash
# Bot-Konfiguration
cd social-media-bot
cp env.example .env
# .env Datei mit API-Tokens ausfüllen
```

## 🌐 URLs

- **Frontend**: http://localhost:4200
- **Backend API**: http://localhost:3000
- **Health Check**: http://localhost:3000/api/health

## 📊 Verfügbare Scripts

```bash
# Development
npm run dev          # Alle Services gleichzeitig
npm run frontend     # Nur Angular Frontend
npm run backend      # Nur Node.js Backend
npm run bot          # Social Media Bot testen

# Production
npm run build        # Frontend Build
npm run start:prod   # Production Server

# Utilities
npm run lint         # Code Linting
npm run test         # Tests ausführen
```

## 🎨 Design System

### Farbschema (basierend auf Logo)
- **Primary**: Warme Braun-/Beigetöne
- **Secondary**: Harmonische Erdtöne
- **Accent**: Subtile Rosé-Töne

### Typografie
- **Logo Script**: Dancing Script (kalligrafisch)
- **Logo Caps**: Cormorant Garamond (klassisch)
- **Body**: Inter (modern, lesbar)
- **Headings**: Playfair Display (elegant)

## 🔧 Technische Details

### Frontend (Angular 17)
- **Styling**: Tailwind CSS
- **Routing**: Angular Router
- **Forms**: Reactive Forms
- **HTTP**: Angular HttpClient

### Backend (Node.js)
- **Framework**: Express.js
- **E-Mail**: Nodemailer
- **API-Calls**: Axios
- **Environment**: dotenv

### Integrationen
- **E-Mail**: mailbox.org SMTP
- **Tickets**: Gitea API
- **Social Media**: Multi-Platform APIs

## 🚀 Deployment

### Frontend
```bash
ng build --prod
# Dateien aus dist/ Ordner auf Webserver deployen
```

### Backend
```bash
# PM2 für Prozess-Management
npm install -g pm2
pm2 start backend/server.js --name "florale-emotion-backend"
```

## 📞 Support

Bei Fragen zur technischen Umsetzung:
- **E-Mail**: info@florale-emotion.de
- **Dokumentation**: Siehe ../business-plan/

---

**Florale Emotion** - *Blumen für besondere Momente* 🌸