215 lines
5.4 KiB
Markdown
215 lines
5.4 KiB
Markdown
# dgray.io
|
|
|
|
Eine anonyme, dezentrale Kleinanzeigen-Plattform mit Monero-Bezahlung.
|
|
|
|
## 🎯 Vision
|
|
|
|
dgray.io ermöglicht es Nutzern, Kleinanzeigen zu schalten und Waren/Dienstleistungen sicher über Monero (XMR) zu handeln. Besonderheiten:
|
|
|
|
- **Anonymität**: Nutzung ohne Account möglich
|
|
- **Käuferschutz**: Monero MultiSig Escrow
|
|
- **Dezentral**: Keine zentrale Zahlungsabwicklung
|
|
- **Privacy-First**: E2E-Verschlüsselung für Kommunikation
|
|
|
|
---
|
|
|
|
## 📊 Machbarkeitsanalyse
|
|
|
|
### Technisch realisierbar
|
|
|
|
| Feature | Komplexität | Status |
|
|
|---------|-------------|--------|
|
|
| Anzeigen CRUD | Niedrig | 🔲 Offen |
|
|
| Fiat/XMR Preisanzeige | Niedrig | 🔲 Offen |
|
|
| Anonyme Nutzung | Mittel | 🔲 Offen |
|
|
| PWA | Mittel | ✅ Grundgerüst |
|
|
| Light/Dark Mode | Niedrig | ✅ Fertig |
|
|
| i18n (DE/EN/FR) | Niedrig | ✅ Fertig |
|
|
| E2E-Chat | Hoch | 🔲 Offen |
|
|
| **Monero MultiSig** | **Sehr hoch** | 🔲 Offen |
|
|
| KI-Assistenz | Mittel | 🔲 Offen |
|
|
| Rating-System | Mittel | 🔲 Offen |
|
|
| 2FA | Mittel | 🔲 Offen |
|
|
| Forum/Gruppen | Hoch | 🔲 Offen |
|
|
|
|
### ⚠️ Kritische Punkte
|
|
|
|
1. **Monero MultiSig Escrow**
|
|
- Komplexeste Komponente
|
|
- Erfordert eigene Wallet-Integration via `monero-wallet-rpc`
|
|
- Nutzer müssen Wallet-Keys verwalten → UX-Hürde
|
|
- Alternative für MVP: Trusted Escrow-Service
|
|
|
|
2. **Rechtliche Aspekte**
|
|
- AGB, Datenschutz, Impressum erforderlich
|
|
- Geldwäsche-Regularien (je nach Jurisdiktion)
|
|
- Haftung bei Betrug klären
|
|
|
|
3. **E2E-Verschlüsselung**
|
|
- Key-Management für anonyme Nutzer
|
|
- Optionen: Signal-Protokoll, Matrix-Protokoll
|
|
|
|
---
|
|
|
|
## 🛠️ Tech-Stack
|
|
|
|
### Frontend (aktuell)
|
|
- **Vanilla JavaScript** (ES Modules)
|
|
- **Web Components** (Custom Elements)
|
|
- **CSS Custom Properties** (Theming)
|
|
- **PWA** (Service Worker, Manifest)
|
|
|
|
### Backend (geplant)
|
|
- **Directus** (Headless CMS)
|
|
- REST/GraphQL API
|
|
- Auth, Rollen, Berechtigungen
|
|
- Custom Extensions für XMR-Integration
|
|
|
|
### Infrastruktur (geplant)
|
|
- PostgreSQL + Redis
|
|
- monero-wallet-rpc
|
|
- Matrix/Signal für Chat
|
|
|
|
---
|
|
|
|
## 🚀 Setup
|
|
|
|
### Voraussetzungen
|
|
- Moderner Browser mit ES Module Support
|
|
- Python 3 (für lokalen Server) oder beliebiger HTTP-Server
|
|
|
|
### Installation
|
|
|
|
```bash
|
|
# Repository klonen
|
|
git clone https://gitea.pro/schmidt1024/dgray.git
|
|
cd tausch.app
|
|
|
|
# Lokalen Server starten
|
|
python3 -m http.server 8080
|
|
|
|
# Oder mit Live-Reload (Node.js erforderlich)
|
|
npx live-server
|
|
```
|
|
|
|
Öffne http://localhost:8080
|
|
|
|
### Projektstruktur
|
|
|
|
```
|
|
dgray/
|
|
├── index.html # Entry Point
|
|
├── manifest.json # PWA Manifest
|
|
├── service-worker.js # Offline-Support
|
|
├── css/
|
|
│ ├── fonts.css # Web Fonts (Inter, Space Grotesk)
|
|
│ ├── variables.css # Theming (Light/Dark)
|
|
│ ├── base.css # Reset, Grundstyles
|
|
│ └── components.css # UI-Komponenten
|
|
├── js/
|
|
│ ├── app.js # App-Initialisierung
|
|
│ ├── router.js # Hash-basiertes Routing
|
|
│ ├── i18n.js # Übersetzungssystem
|
|
│ ├── services/
|
|
│ │ └── api.js # API-Client (Vorbereitung)
|
|
│ └── components/
|
|
│ ├── app-shell.js # Layout-Container
|
|
│ ├── app-header.js # Header mit Navigation
|
|
│ ├── app-footer.js # Footer
|
|
│ └── pages/ # Seiten-Komponenten
|
|
├── locales/
|
|
│ ├── de.json # Deutsch
|
|
│ ├── en.json # English
|
|
│ └── fr.json # Français
|
|
└── assets/
|
|
├── fonts/ # Self-hosted Fonts (Inter, Space Grotesk)
|
|
└── icons/ # App-Icons
|
|
```
|
|
|
|
---
|
|
|
|
## 📋 Offene Punkte / Roadmap
|
|
|
|
### Phase 1: MVP Frontend ⬅️ **Aktuell**
|
|
- [x] Projektstruktur
|
|
- [x] Routing
|
|
- [x] i18n (DE/EN/FR)
|
|
- [x] Light/Dark Mode
|
|
- [x] PWA Grundgerüst
|
|
- [x] Startseite mit Suche, Kategorien, Listings-Grid
|
|
- [x] Typografie (Inter + Space Grotesk)
|
|
- [x] Such-Komponente mit Accordion-Kategorien
|
|
- [ ] Suchseite mit Filtern
|
|
- [ ] Anzeige-Detailseite
|
|
- [ ] Anzeige-Erstellen-Formular
|
|
- [ ] Responsive Optimierungen
|
|
|
|
### Phase 2: Backend-Integration
|
|
- [ ] Directus aufsetzen
|
|
- [ ] Anzeigen-Collection
|
|
- [ ] User-Auth (optional/anonym)
|
|
- [ ] Bilder-Upload
|
|
- [ ] API-Anbindung im Frontend
|
|
|
|
### Phase 3: Kommunikation
|
|
- [ ] Chat-System (E2E-verschlüsselt)
|
|
- [ ] Benachrichtigungen
|
|
- [ ] Merkliste
|
|
|
|
### Phase 4: Payments
|
|
- [ ] XMR-Kursabfrage API
|
|
- [ ] Fiat ↔ XMR Umrechnung
|
|
- [ ] Wallet-Anbindung (monero-wallet-rpc)
|
|
- [ ] MultiSig Escrow
|
|
|
|
### Phase 5: Trust & Safety
|
|
- [ ] Rating-System
|
|
- [ ] 2FA
|
|
- [ ] Reporting/Moderation
|
|
- [ ] AGB, Datenschutz
|
|
|
|
---
|
|
|
|
## 🎨 Design-Entscheidungen
|
|
|
|
### Typografie
|
|
- **Headlines**: Space Grotesk (Medium, Bold)
|
|
- **Body**: Inter (Regular, Medium, SemiBold, Bold)
|
|
- Self-hosted Fonts (SIL Open Font License)
|
|
|
|
### Farbpalette
|
|
- **Light Mode**: Lavender-Töne (#FAF8FC, #6B5B95)
|
|
- **Dark Mode**: Deep Purple (#1A1424, #B8A5D6)
|
|
- WCAG AAA konform (Kontrast > 7:1)
|
|
|
|
### Mobile-First
|
|
- Responsive Grid (2 Spalten Mobile, 5 Spalten Desktop)
|
|
- Touch-optimierte Buttons
|
|
- Icon-only Buttons auf kleinen Screens
|
|
|
|
---
|
|
|
|
## 🤝 Contributing
|
|
|
|
1. Feature-Branch erstellen
|
|
2. Änderungen committen
|
|
3. Pull Request öffnen
|
|
|
|
### Code-Konventionen
|
|
- ES Modules verwenden
|
|
- Web Components für UI-Komponenten
|
|
- CSS Custom Properties für Theming
|
|
- Übersetzungsschlüssel für alle Texte
|
|
|
|
---
|
|
|
|
## 📄 Lizenz
|
|
|
|
TBD
|
|
|
|
---
|
|
|
|
## 📞 Kontakt
|
|
|
|
TBD
|