florale-emotion/website

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

npm install

2. Alle Services starten

npm run dev  # Startet Frontend, Backend & Bot gleichzeitig

3. Einzelne Services starten

# 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)

# Backend-Konfiguration
cp env.example .env
# .env Datei mit echten SMTP-Daten ausfüllen

Social Media Bot

# 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

# 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

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

Backend

# 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 🌸