diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml new file mode 100644 index 0000000..17276c8 --- /dev/null +++ b/.github/workflows/deploy.yml @@ -0,0 +1,34 @@ +name: Deploy Vue App + +on: + push: + branches: + - main + - dev + +jobs: + build-and-deploy: + runs-on: ubuntu-latest + + steps: + - name: Checkout repository + uses: actions/checkout@v3 + with: + fetch-depth: 0 + + - name: Setup Node.js + uses: actions/setup-node@v3 + with: + node-version: '18' + + - name: Install dependencies + run: npm install + + - name: Build project + run: npm run build + + - name: Deploy to GitHub Pages + uses: JamesIves/github-pages-deploy-action@v4 + with: + branch: gh-pages # Zielbranch für GitHub Pages + folder: dist # Build-Ausgabeordner (Vue + Vite) diff --git a/.github/workflows/tree.yml b/.github/workflows/tree.yml new file mode 100644 index 0000000..d8ae4d3 --- /dev/null +++ b/.github/workflows/tree.yml @@ -0,0 +1,33 @@ +name: Update Tree.md + +on: + push: + branches: [ "dev" ] + +permissions: + contents: write + +jobs: + update-tree: + runs-on: ubuntu-latest + + steps: + - name: Checkout repository + uses: actions/checkout@v3 + with: + fetch-depth: 0 + + - name: Generate tree structure + run: | + echo '```' > Tree.md + tree -I 'node_modules|.git|dist' -a >> Tree.md + echo '```' >> Tree.md + + - name: Commit & push Tree.md + run: | + git config --global user.name "GoldForge Bot" + git config --global user.email "github-actions[bot]@users.noreply.github.com" + git remote set-url origin https://x-access-token:${{ secrets.GITHUB_TOKEN }}@github.com/Goldfruit/GoldForge.git + git add Tree.md + git commit -m "ci: update Tree.md" || echo "nothing to commit" + git push origin dev diff --git a/ATTRIBUTIONS.md b/ATTRIBUTIONS.md new file mode 100644 index 0000000..faa545c --- /dev/null +++ b/ATTRIBUTIONS.md @@ -0,0 +1 @@ +Diese Dateien dienen dazu, die Mitwirkenden oder externe Ressourcen/Tools zu würdigen und aufzuzählen. \ No newline at end of file diff --git a/AUTHORS.md b/AUTHORS.md new file mode 100644 index 0000000..faa545c --- /dev/null +++ b/AUTHORS.md @@ -0,0 +1 @@ +Diese Dateien dienen dazu, die Mitwirkenden oder externe Ressourcen/Tools zu würdigen und aufzuzählen. \ No newline at end of file diff --git a/CHANGELOG.md b/CHANGELOG.md new file mode 100644 index 0000000..357293a --- /dev/null +++ b/CHANGELOG.md @@ -0,0 +1 @@ +Dokumentiert die Änderungen und Verbesserungen in den verschiedenen Versionen des Projekts. \ No newline at end of file diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md new file mode 100644 index 0000000..9a89eef --- /dev/null +++ b/CODE_OF_CONDUCT.md @@ -0,0 +1 @@ +Enthält einen Verhaltenskodex, der klarstellt, wie sich Mitwirkende verhalten sollten, um ein respektvolles Miteinander zu gewährleisten. \ No newline at end of file diff --git a/ISSUE_TEMPLATE.md b/ISSUE_TEMPLATE.md new file mode 100644 index 0000000..828c9a9 --- /dev/null +++ b/ISSUE_TEMPLATE.md @@ -0,0 +1 @@ +Diese Vorlagen helfen dabei, bei der Erstellung von Issues und Pull Requests konsistente Informationen zu liefern und so den Review-Prozess zu vereinfachen. \ No newline at end of file diff --git a/LICENSE.md b/LICENSE.md new file mode 100644 index 0000000..cd8f72e --- /dev/null +++ b/LICENSE.md @@ -0,0 +1 @@ +Legt die Lizenzbedingungen für das Projekt fest, sodass Nutzer und Contributor wissen, unter welchen Bedingungen der Code verwendet werden darf. \ No newline at end of file diff --git a/PULL_REQUEST_TEMPLATE.md b/PULL_REQUEST_TEMPLATE.md new file mode 100644 index 0000000..828c9a9 --- /dev/null +++ b/PULL_REQUEST_TEMPLATE.md @@ -0,0 +1 @@ +Diese Vorlagen helfen dabei, bei der Erstellung von Issues und Pull Requests konsistente Informationen zu liefern und so den Review-Prozess zu vereinfachen. \ No newline at end of file diff --git a/README.md b/README.md index e8ece62..38bed6a 100644 --- a/README.md +++ b/README.md @@ -1,106 +1,347 @@ -# Befehlsbibliothek mit Goldanker-Backend – Komplette README -Dieser Leitfaden vereint zwei Roadmaps (v1 und v2) zu einer umfassenden Dokumentation für deine Interaktive Befehlsbibliothek mit Anbindung an einen **Goldanker**-Microservice. +--- + +```markdown +# GoldForge – Modular Semantic Command Center & Interaktive Befehlsbibliothek + +GoldForge bildet das zentrale, semantisch erweiterte Befehls- und Wissenszentrum im Goldfruit-Ökosystem. Es vereint ein modernes Vue.js‑Frontend mit einer interaktiven, kachelbasierten Befehlsbibliothek, ein robustes FastAPI‑Backend (Goldanker Command Service) sowie fortschrittliche Semantic Search & Retrieval-Augmented Generation (RAG) mit GPT-Modellen. Zusätzlich sorgt die Tampermonkey-Integration für die automatische Erfassung externer Inhalte. Alle Komponenten sind containerisiert und lassen sich mittels Docker Compose (oder Kubernetes) orchestrieren – mit CI/CD-Anbindung und einem zukunftsorientierten, modularen Aufbau. --- -## 1. Architektur & Idee +## Inhaltsverzeichnis + +- [Überblick](#überblick) +- [Gesamtarchitektur](#gesamtarchitektur) +- [Kernkomponenten](#kernkomponenten) + - [GoldForge UI (Frontend)](#goldforge-ui-frontend) + - [Goldanker Command Service (Backend)](#goldanker-command-service-backend) + - [API Gateway & Integrationen](#api-gateway--integrationen) + - [Semantic Search & RAG](#semantic-search--rag) + - [Tampermonkey Integration](#tampermonkey-integration) +- [Workflow-Optimierung & Erweiterungen](#workflow-optimierung--erweiterungen) +- [Interaktive Befehlsbibliothek & Kategorien](#interaktive-befehlsbibliothek--kategorien) +- [Docker-Setup & Beispielhafte Dockerfiles](#docker-setup--beispielhafte-dockerfiles) +- [Backend & Frontend – Code-Beispiele](#backend--frontend--code-beispiele) +- [CI/CD & Deployment](#cicd--deployment) +- [Roadmap & Zukunft](#roadmap--zukunft) +- [Optionale Features & Erweiterungen](#optionale-features--erweiterungen) +- [Lizenz](#lizenz) +- [Fazit & Nächste Schritte](#fazit--nächste-schritte) -### 1.1 Ziel -Eine **Progressive Web App (PWA)** zur **Verwaltung von Befehlen** (z. B. Docker-, Kubernetes-, Git-Befehle) mit -- **Zweiteiliger Oberfläche** (Bibliothek & Arbeitsfläche) -- **Drag & Drop**-Funktionalität -- **Kachel-Design** -- **Backend** (Goldanker CommandService, FastAPI oder Node.js) +--- -### 1.2 Datenfluss -1. Frontend (Vue + Vite + PWA) -2. Backend (Goldanker_CommandService) -3. befehle.json (Serverseitige Ablage) -4. CI/CD (GitHub Actions / GitLab) +## Überblick + +GoldForge dient als zentrales Command Center, das: +- **Befehle interaktiv verwaltet:** Über eine kachelbasierte Befehlsbibliothek, in der Befehle per Drag & Drop von einer übersichtlichen Liste in einen Arbeitsbereich gezogen werden. +- **Ein robustes Backend bereitstellt:** Der Goldanker Command Service (FastAPI) ermöglicht CRUD-Operationen auf einer JSON-Datenquelle, versioniert über automatische Git-Commits. +- **Semantische Such- und Antwortsysteme integriert:** Mittels modernen Embedding-Modellen (z. B. SentenceTransformers) und Vektor-Datenbanken (ChromaDB/Elasticsearch) werden kontextbasierte Antworten via Retrieval-Augmented Generation (RAG) generiert. +- **Externe Inhalte automatisiert erfasst:** Über flexible Tampermonkey-Userscripts. +- **Containerisiert betrieben wird:** Alle Services laufen in Docker-Containern und können bei Bedarf in Kubernetes skaliert werden. --- -## 2. Funktionale Übersicht - -### 2.1 Zweiteilige Oberfläche -- **Bibliothek (links):** - - Alle Befehle kategorisiert (Git, Docker, usw.) - - Suchfeld, um rasch Befehle zu finden -- **Arbeitsfläche (rechts):** - - Kachel-Design - - Drag & Drop: Befehle aus Bibliothek in Arbeitsfläche schieben - - X-Button zum Entfernen - -### 2.2 Kachel-Design -- Enthält: - - **Name**, **Beschreibung**, **Command** - - Optionale Infos, Tooltips -- Resizable (per CSS-Resize) & frei platzierbar - -### 2.3 Drag & Drop -- Nutzung von [vue-draggable-next](https://github.com/SortableJS/vue.draggable.next) - - `v-model`-Synchronisierung - - Optional: Reordering in Bibliothek oder Arbeitsfläche -- Alternativ: manuelles Drag & Drop (Events `dragstart`, `dragend`) - -### 2.4 Persistenz -- **Frontend**: localStorage - - Speichert Position und Größe der Kacheln -- **Backend**: befehle.json - - Speichert Befehle, Kategorien, Beschreibungen - -### 2.5 JSON-Struktur -- `name`, `command`, `category`, `description`, `info` - -```json -[ - { - "name": "Docker Build", - "command": "docker-compose up --build", - "category": "Docker", - "description": "Container neu bauen und starten", - "info": "Nach Änderungen oder Cache-Problemen." - }, - { - "name": "Kubernetes Pods anzeigen", - "command": "kubectl get pods", - "category": "Kubernetes", - "description": "Zeigt aktuell laufende Pods an", - "info": "Hilfreich für schnellen Überblick der Container." - } -] +## Gesamtarchitektur + +Die modulare Architektur von GoldForge ermöglicht den flexiblen Austausch einzelner Komponenten. Zentrale Steuerung übernimmt ein API Gateway, das sämtliche Anfragen (vom Frontend, CI/CD-Systemen, E-Mail-Diensten etc.) an die internen Services verteilt. + +### Systemdiagramm + +```mermaid +graph TD; + A[Developer/User] -->|UI/API Calls| B[GoldForge UI(Vue.js/PWA)] + B -->|Sendet Anfragen| C[API Gateway] + C --> D[Goldanker Command Service(FastAPI)] + D --> I[Command Database(befehle.json/NoSQL)] + C --> E[Semantic Search Service(ChromaDB/Elasticsearch)] + E --> J[Vector Database] + C --> F[GPT Service] + F --> G[Model API Gateway] + G --> H[Model Services] + A --> K[Tampermonkey Agent(Web-Scraping)] + K -->|Sendet Daten| D ``` --- -## 3. Goldanker CommandService (Beispiel in FastAPI) +## Kernkomponenten + +### GoldForge UI (Frontend) +- **Technologien:** Vue.js 3, Vite, Progressive Web App (PWA) +- **Funktionen:** + - Zweigeteilte Oberfläche: Linke Spalte mit durchsuchbarer Befehlsbibliothek, rechte Spalte als Arbeitsfläche (Drag & Drop, resizable Kacheln). + - Lokale Persistenz (via localStorage) zur Speicherung des Workspace-Zustands. + +### Goldanker Command Service (Backend) +- **Technologien:** FastAPI, Python, Uvicorn +- **Funktionen:** + - Verwaltung von Befehlen via CRUD‑Endpunkten (GET, POST, PUT, DELETE). + - Speicherung der Befehle in einer JSON-Datei (befehle.json) und optionaler Git-Commit zur Versionierung. + - Integration externer Webhook-Events (z. B. von GitLab, Mailcow). + +### API Gateway & Integrationen +- **Funktion:** + - Zentraler Eingang für alle externen Anfragen, die an die jeweiligen internen Services weitergeleitet werden. + - Ermöglicht den Zugriff auf das Frontend, den Command Service, Semantic Search, GPT-Service und weitere Integrationen. + +### Semantic Search & RAG +- **Ziel:** + - Umwandlung von Textinhalten in semantische Vektoren (mittels Embedding-Modellen wie SentenceTransformers) und Speicherung in einer Vektor-Datenbank (ChromaDB oder Elasticsearch). + - Nutzung der abgerufenen, kontextrelevanten Dokumente als Basis für die Generierung präziser Antworten via GPT-Modellen (z. B. gpt‑4‑turbo). +- **Beispielcode:** + Siehe Abschnitt [Backend & Frontend – Code-Beispiele](#backend--frontend--code-beispiele). + +### Tampermonkey Integration +- **Technologien:** Tampermonkey Userscript (JavaScript) +- **Funktionen:** + - Automatisches bzw. manuelles Erfassen von Webseiteninhalten. + - Übertragung extrahierter Text-Snippets an den Goldanker Command Service, um neue Befehle zu generieren. -### 3.1 Aufbau -``` -goldanker_commands/ - ├── Dockerfile - ├── requirements.txt - ├── main.py <-- FastAPI-Code - ├── befehle.json <-- Serverseitig gespeichert - └── ... +--- + +## Workflow-Optimierung & Erweiterungen + +Aus der Datei *workflow_upgrade.md* lassen sich folgende Verbesserungspotenziale ableiten: +- **Befehle als lebendige Ressource:** + - Befehle werden nicht mehr statisch in einer Datei verwaltet, sondern über eine API hinzugefügt, bearbeitet und gelöscht. + - Automatische Git-Commits nach jedem Update gewährleisten Versionskontrolle. +- **Live-Interaktion:** + - Simulation von Terminal-Outputs (z. B. `docker ps`, `kubectl get pods`) und ggf. reale Ausführung über einen sicheren, containerbasierten `command-runner`. +- **Modularer Aufbau & erweiterbare Kategorien:** + - Eine flexible Kategoriestruktur (z. B. Git, Docker, Kubernetes) ermöglicht die systematische Organisation des gesamten Ökosystems. +- **Workspace-Sharing & Export:** + - Funktionen, um den aktuellen Arbeitsbereich (Workspace) als JSON oder QR-Code zu exportieren und zu teilen. + +--- + +## Interaktive Befehlsbibliothek & Kategorien + +Die Befehlsbibliothek bildet das Herzstück des Systems. Sie besteht aus zwei Bereichen: +- **Bibliothek (links):** + - Enthält alle Befehle, sortiert und filterbar nach Kategorien (z. B. Git, Docker, Kubernetes, CI/CD etc.). + - Suche und Filterung ermöglichen eine schnelle Übersicht. +- **Arbeitsfläche (rechts):** + - Befehle können per Drag & Drop als Kacheln platziert, verschoben und resized werden. + - Der Zustand wird in localStorage gespeichert, sodass die Anordnung geräteübergreifend bestehen bleibt. + +### Beispielhafte Kategorien (siehe Roadmap_v2.md) +```yaml +Befehlsbibliothek: + - Git + - Docker + - npm & Node.js + - Ubuntu & Linux + - Kubernetes & Container-Orchestrierung + - Kafka & Datenverarbeitung + - Istio & Service Mesh + - Helm & Paketmanagement + - Prometheus & Monitoring + - Grafana & Visualisierung + - CI/CD & GitLab + - Python-Umgebung + - Sicherheit & VPN + - IPFS & dezentrale Speicherung ``` -### 3.2 Dockerfile -```Dockerfile -FROM python:3.10-slim +Zusätzlich empfiehlt sich folgende Tabelle für das Goldfruit-Ökosystem: + +| Kategorie | Beispiel-Befehle | +|-----------------------------|-------------------------------------------------------| +| **Kubernetes & Helm** | `kubectl apply`, `kubectl get pods`, `helm upgrade` | +| **Docker & Container** | `docker-compose build`, `docker-compose up -d` | +| **Git & Versionskontrolle** | `git pull`, `git merge`, `git rebase`, `git clone` | +| **CI/CD & GitLab** | `gitlab-runner exec`, YAML-Jobs für Deployment | +| **Monitoring & Prometheus** | `promtool check config`, PromQL Queries | +| **Visualisierung (Grafana)**| Starten von Dashboards | +| **Kafka & Event Streams** | `kafka-topics.sh`, `kafka-console-consumer.sh` | +| **Service Mesh & Istio** | `istioctl install`, `istioctl analyze` | +| **VPN & Sicherheit** | ProtonVPN CLI, SSH-Tunnel | +| **IPFS & Storage** | `ipfs add`, `ipfs pin`, `ipfs daemon` | +| **Python-Umgebung** | `pipenv`, `poetry`, `python -m venv` | -WORKDIR /app -COPY requirements.txt ./ -RUN pip install --no-cache-dir -r requirements.txt +--- -COPY . /app +## Docker-Setup & Beispielhafte Dockerfiles -CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "8000"] +### Docker Compose Beispiel + +```yaml +version: '3.8' +services: + goldforge_ui: + build: ./goldforge_ui + container_name: goldforge_ui + ports: + - "3000:80" + networks: + - goldforge_net + + tampermonkey_api: + build: ./tampermonkey_api + container_name: tampermonkey_api + ports: + - "3001:3001" + networks: + - goldforge_net + + goldanker_commands: + build: ./goldanker_commands + container_name: goldanker_commands + environment: + - COMMANDS_JSON_PATH=/app/befehle.json + volumes: + - ./goldanker_commands/befehle.json:/app/befehle.json + ports: + - "8000:8000" + networks: + - goldforge_net + + api_gateway: + build: ./api_gateway + container_name: api_gateway + ports: + - "8080:8080" + networks: + - goldforge_net + + semantic_search: + image: chromadb/chromadb:latest + container_name: semantic_search + ports: + - "9200:9200" + networks: + - goldforge_net + + gpt_service: + build: ./gpt_service + container_name: gpt_service + ports: + - "8500:8500" + networks: + - goldforge_net + + model_api_gateway: + build: ./model_api_gateway + container_name: model_api_gateway + ports: + - "8600:8600" + networks: + - goldforge_net + + gitlab_runner: + image: gitlab/gitlab-runner:latest + container_name: gitlab_runner + volumes: + - /var/run/docker.sock:/var/run/docker.sock + - ./gitlab-runner/config:/etc/gitlab-runner + networks: + - goldforge_net + + mailcow: + image: mailcow/mailcow-dockerized:latest + container_name: mailcow + ports: + - "8081:80" + - "8443:443" + networks: + - goldforge_net + + monitoring: + image: prom/prometheus:latest + container_name: prometheus + ports: + - "9090:9090" + networks: + - goldforge_net + + message_broker: + image: wurstmeister/kafka:latest + container_name: kafka + ports: + - "9092:9092" + networks: + - goldforge_net + +networks: + goldforge_net: + driver: bridge ``` -### 3.3 main.py (CRUD-Endpunkte) +### Beispielhafte Dockerfiles + +1. **GoldForge UI (Frontend – Vue.js & Nginx)** + + ```dockerfile + # Stage 1: Build mit Node.js + FROM node:16-alpine AS builder + WORKDIR /app + COPY package*.json ./ + RUN npm install + COPY . . + RUN npm run build + + # Stage 2: Auslieferung mit Nginx + FROM nginx:alpine + COPY --from=builder /app/dist /usr/share/nginx/html + EXPOSE 80 + CMD ["nginx", "-g", "daemon off;"] + ``` + +2. **Goldanker Command Service (FastAPI Backend)** + + ```dockerfile + FROM python:3.9-slim + WORKDIR /app + COPY requirements.txt . + RUN pip install --no-cache-dir -r requirements.txt + COPY . . + EXPOSE 8000 + CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "8000"] + ``` + +3. **Tampermonkey API (Node.js Service)** + + ```dockerfile + FROM node:16-alpine + WORKDIR /app + COPY package*.json ./ + RUN npm install --production + COPY . . + EXPOSE 3001 + CMD ["node", "server.js"] + ``` + +4. **GPT Service & Model API Gateway (Python, Uvicorn)** + + ```dockerfile + FROM python:3.9-slim + WORKDIR /app + COPY requirements.txt . + RUN pip install --no-cache-dir -r requirements.txt + COPY . . + EXPOSE 8500 + CMD ["uvicorn", "gpt_gateway:app", "--host", "0.0.0.0", "--port", "8500"] + ``` + +5. **Optional: VS Code im Container (code‑server)** + + ```dockerfile + FROM linuxserver/code-server:latest + ENV PUID=1000 + ENV PGID=1000 + ENV TZ=Europe/Berlin + ENV PASSWORD=deinPasswort + EXPOSE 8443 + CMD ["/init"] + ``` + +--- + +## Backend & Frontend – Code-Beispiele + +### Backend: FastAPI Beispiel (siehe Roadmap_v1.md) + ```python from fastapi import FastAPI, HTTPException from pydantic import BaseModel @@ -109,7 +350,6 @@ import json import os app = FastAPI() - JSON_FILE = os.getenv("COMMANDS_JSON_PATH", "./befehle.json") class Command(BaseModel): @@ -137,7 +377,6 @@ def get_commands(): @app.post("/commands", response_model=Command) def create_command(new_cmd: Command): commands = load_commands() - # Optional: check duplicates commands.append(new_cmd) save_commands(commands) return new_cmd @@ -162,145 +401,91 @@ def delete_command(cmd_name: str): return {"message": f"Befehl '{cmd_name}' gelöscht"} ``` -### 3.4 Docker-Compose Integration -```yaml -version: '3.8' -services: - goldanker_commands: - build: ./goldanker_commands - container_name: goldanker_commands - environment: - - COMMANDS_JSON_PATH=/app/befehle.json - volumes: - - ./goldanker_commands/befehle.json:/app/befehle.json - ports: - - "8000:8000" - # depends_on, networks, etc. -``` - ---- - -## 4. Vue-Frontend (Befehlsbibliothek) +### Frontend: Vue.js Beispiel (siehe Roadmap_v1.md) -### 4.1 Struktur -``` -befehlsbibliothek/ - ├── src/ - │ ├── App.vue - │ ├── main.js - │ └── assets/ - │ └── styles.css - ├── public/ - ├── vite.config.js - ├── package.json - └── ... -``` - -### 4.2 App.vue (Beispiel mit vue-draggable-next) ```html - Bibliothek - {{ cmd.name }} ({{ cmd.category }}) → - - Arbeitsfläche - - - - - {{ cmd.name }} - {{ cmd.description }} - {{ cmd.command }} - X - - - + + {{ cmd.name }} + {{ cmd.description }} + {{ cmd.command }} + X + @@ -332,76 +518,93 @@ export default { position: relative; background: #f5f5f5; overflow: hidden; - padding: 1rem; -} -.workspace { - min-height: 400px; - background: #e0e0e0; - padding: 1rem; - border: 2px dashed #ccc; } .command-box { + width: 200px; background: white; border: 2px solid #ccc; + cursor: move; padding: 1rem; - margin-bottom: 1rem; - transition: transform 0.2s ease; -} -.command-box:hover { - transform: translateY(-4px); } ``` --- -## 5. Kategorien & Struktur +## CI/CD & Deployment -Hier einige sinnvolle Kategorien (erweiterbar): +- **Backend:** + - Docker-Build des Goldanker Command Service (FastAPI) und automatisierte Git-Commits bei Änderungen der `befehle.json`. + - CI/CD-Pipelines (GitHub Actions oder GitLab CI) bauen und deployen den Service automatisch. +- **Frontend:** + - Vue-App wird mittels `npm run build` erstellt und über Nginx oder GitHub Pages ausgeliefert. +- **Orchestrierung:** + - Alle Services laufen in Docker-Containern (via Docker Compose oder Kubernetes). -```yaml -- Git -- Docker -- npm & Node.js -- Ubuntu & Linux -- Kubernetes & Helm -- Kafka -- Istio -- Helm -- Prometheus -- Grafana -- CI/CD (GitLab) -- Python -- Sicherheit & VPN -- IPFS -``` +--- + +## Roadmap & Zukunft + +Die weitere Entwicklung gliedert sich in folgende Phasen: + +### **Phase 1 – Konzept & Vorbereitung** +- Konzept finalisieren und JSON-Befehlsdatei erstellen. +- Grundstruktur (Frontend & Backend) aufsetzen. + +### **Phase 2 – Frontend-Entwicklung** +- Aufbau des zweigeteilten Layouts (Bibliothek links, Arbeitsfläche rechts). +- Implementierung von Drag & Drop, Resize und Suchfunktionen. + +### **Phase 3 – Backend-Optimierung** +- CRUD-Operationen via FastAPI und automatische Git-Commit-Integration. +- Erweiterung in Microservices (z. B. separate Module für User-, Search- und Command-Service). + +### **Phase 4 – Semantic Search & RAG** +- Integration von ChromaDB/Elasticsearch und Embedding-Modellen. +- Entwicklung eines RAG-Workflows zur Generierung kontextbasierter Antworten. + +### **Phase 5 – Workflow-Optimierung** +- Live-Interaktion (Terminal-Simulation, echter Command-Runner). +- Workspace-Export und Sharing-Funktionalität. + +### **Phase 6 – Deployment & Skalierung** +- Vollständiges Testen und Deployment via CI/CD. +- Skalierung in Kubernetes inklusive Monitoring (Prometheus, Grafana, Jaeger). + +--- + +## Optionale Features & Erweiterungen + +- **Befehlseingabemaske im Frontend:** Formular für das Erstellen neuer Befehle (POST `/commands`). +- **Edit- und Vorschaufunktionen:** Markdown-Preview, Versionierung einzelner Befehle. +- **Benutzer- und Rollenverwaltung:** Absicherung der API. +- **Live-Ausführung von Befehlen:** Simulation oder tatsächliche Ausführung in einem sicheren Container. +- **Slack- oder E-Mail-Benachrichtigungen** bei Änderungen. +- **Erweiterung des Workspace-Konzepts:** Export als JSON oder QR-Code, um die Anordnung zu teilen. --- -## 6. CI/CD und Deployment +## Lizenz -1. **Backend**: Docker build/push -2. **Frontend**: `npm run build`, deploy nach GitHub Pages oder Docker-Container + Nginx -3. **Docker-Compose**: orchestriert Services (goldanker_commands + befehlsbibliothek) -4. **GitHub Actions / GitLab-CI**: automatisiertes Bauen und Ausrollen +Dieses Projekt ist unter der MIT‑Lizenz lizenziert – siehe [LICENSE](LICENSE) für Details. --- -## 7. Erweiterungsideen +## Fazit & Nächste Schritte + +GoldForge bietet ein umfassendes, modulares und zukunftssicheres System, das die Entwicklung, Verwaltung und Ausführung von Befehlen in deinem Goldfruit-Ökosystem revolutioniert. Die Integration von Semantic Search, RAG und interaktiver Befehlsverwaltung, gekoppelt mit modernem Deployment via Docker und CI/CD, ermöglicht es dir, Arbeitsabläufe effizient und dynamisch zu gestalten. -- **Command-Eingabemaske** (POST /commands) -- **Edit-Funktion** (PUT /commands/{cmd_name}) -- **Git-Commit-Hook** nach Speichern -- **Nutzer-/Rollenverwaltung** -- **Tooltip**-Infos mit Tippy.js -- **Responsive** für Mobile/Tablet +**Nächste Schritte:** +- Feedback zur JSON-Datenstruktur und Kategoriestruktur einholen. +- Konkrete Implementierung einzelner Module (z. B. das POST /commands-Formular) starten. +- Praktische Hands-on-Übungen durchführen, um den Workflow (z. B. Drag & Drop, Git-Commit-Hooks) zu validieren. +- Weitere Erweiterungen (z. B. Live-Interaktion, Workspace-Export) schrittweise implementieren. --- -## 8. Fazit +*Diese README.md fasst sämtliche Konzepte, Code-Beispiele und strategischen Roadmap-Schritte zusammen. Feedback und Anpassungswünsche sind jederzeit willkommen!* +``` + +--- -Mit dieser kombinierten README hast du: -1. Eine **Architektur-Beschreibung** (Backend/Frontend) -2. **Konkrete Codebeispiele** (FastAPI + Vue) -3. **Einen klaren Projektplan** (Phasen, Tools, Docker-Setup) -4. **Optionale Features** (Git-Commit-Hooks, CI/CD, etc.)befehlsbibliothek/ \ No newline at end of file +Ist diese Zusammenführung so in deinem Sinne? Möchtest du an einzelnen Abschnitten noch weitere Details oder spezifische Anpassungen vornehmen? \ No newline at end of file diff --git a/SECURITY.md b/SECURITY.md new file mode 100644 index 0000000..4d146aa --- /dev/null +++ b/SECURITY.md @@ -0,0 +1 @@ +Beschreibt, wie Sicherheitslücken gemeldet werden können und welche Maßnahmen im Falle eines Sicherheitsproblems zu ergreifen sind. \ No newline at end of file diff --git a/Tree.md b/Tree.md index 337aed2..2351760 100644 --- a/Tree.md +++ b/Tree.md @@ -1,26 +1,43 @@ -befehlsbibliothek/ -├── .github/ -│ └── workflows/ -│ └── deploy.yml # GitHub Actions Workflow für Deployment -├── public/ -│ └── vite.svg -├── src/ -│ ├── assets/ -│ │ └── styles.css # Globale CSS-Datei -│ ├── components/ -│ │ └── CommandItem.vue -│ ├── data/ -│ │ └── befehle.json # Beispiel-Befehlsdaten -│ ├── App.vue -│ └── main.js -├── goldanker_commands/ -│ ├── Dockerfile -│ ├── requirements.txt -│ ├── main.py <-- FastAPI-Code -│ ├── befehle.json <-- Serverseitig gespeichert -│ └── ... +``` +. +├── .github +│ └── workflows +│ ├── deploy.yml +│ └── tree.yml ├── .gitignore +├── ATTRIBUTIONS.md +├── AUTHORS.md +├── CHANGELOG.md +├── CODE_OF_CONDUCT.md +├── ISSUE_TEMPLATE.md +├── LICENSE.md +├── PULL_REQUEST_TEMPLATE.md +├── README.md +├── SECURITY.md +├── Tree.md +├── docker-compose.yml +├── goldanker_commands +│ ├── Dockerfile +│ ├── befehle.json +│ ├── main.py +│ └── requirements.txt ├── index.html +├── nächste_Schritte +│ ├── Contributing_guidelinie_GoldForge.md +│ ├── Roadmap_v1.md +│ ├── Roadmap_v2.md +│ ├── Treebefehl.md +│ └── workflow_upgrade.md +├── package-lock.json ├── package.json -├── README.md -└── vite.config.js \ No newline at end of file +├── src +│ ├── App.vue +│ ├── assets +│ │ └── styles.css +│ ├── components +│ │ └── CommandItem.vue +│ └── main.js +└── vite.config.js + +8 directories, 31 files +``` diff --git a/docker-compose.yml b/docker-compose.yml new file mode 100644 index 0000000..e926857 --- /dev/null +++ b/docker-compose.yml @@ -0,0 +1,12 @@ +version: '3.8' +services: + goldanker_commands: + build: ./goldanker_commands + container_name: goldanker_commands + environment: + - COMMANDS_JSON_PATH=/app/befehle.json + volumes: + - ./goldanker_commands/befehle.json:/app/befehle.json + ports: + - "8000:8000" + # depends_on, networks, etc. \ No newline at end of file diff --git a/goldanker_commands/Dockerfile b/goldanker_commands/Dockerfile new file mode 100644 index 0000000..e3baf69 --- /dev/null +++ b/goldanker_commands/Dockerfile @@ -0,0 +1,19 @@ +# Dockerfile für goldanker_commands + +FROM python:3.11-slim + +# Arbeitsverzeichnis im Container +WORKDIR /app + +# requirements.txt kopieren und Abhängigkeiten installieren +COPY requirements.txt . +RUN pip install --no-cache-dir -r requirements.txt + +# Projektdateien kopieren +COPY . . + +# Port angeben (optional) +EXPOSE 8000 + +# Startbefehl für Uvicorn (FastAPI Server) +CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "8000"] diff --git a/src/data/befehle.json b/goldanker_commands/befehle.json similarity index 100% rename from src/data/befehle.json rename to goldanker_commands/befehle.json diff --git a/goldanker_commands/main.py b/goldanker_commands/main.py new file mode 100644 index 0000000..d9667ae --- /dev/null +++ b/goldanker_commands/main.py @@ -0,0 +1,58 @@ +from fastapi import FastAPI, HTTPException +from pydantic import BaseModel +from typing import List, Optional +import json +import os + +app = FastAPI() + +JSON_FILE = os.getenv("COMMANDS_JSON_PATH", "./befehle.json") + +class Command(BaseModel): + name: str + command: str + category: str + description: Optional[str] = None + info: Optional[str] = None + +def load_commands() -> List[Command]: + if not os.path.exists(JSON_FILE): + return [] + with open(JSON_FILE, "r", encoding="utf-8") as f: + data = json.load(f) + return [Command(**cmd) for cmd in data] + +def save_commands(commands: List[Command]): + with open(JSON_FILE, "w", encoding="utf-8") as f: + json.dump([cmd.dict() for cmd in commands], f, indent=2, ensure_ascii=False) + +@app.get("/commands", response_model=List[Command]) +def get_commands(): + return load_commands() + +@app.post("/commands", response_model=Command) +def create_command(new_cmd: Command): + commands = load_commands() + # Optional: check duplicates + commands.append(new_cmd) + save_commands(commands) + return new_cmd + +@app.put("/commands/{cmd_name}", response_model=Command) +def update_command(cmd_name: str, updated_cmd: Command): + commands = load_commands() + for i, c in enumerate(commands): + if c.name == cmd_name: + commands[i] = updated_cmd + save_commands(commands) + return updated_cmd + raise HTTPException(status_code=404, detail="Command not found") + +@app.delete("/commands/{cmd_name}") +def delete_command(cmd_name: str): + commands = load_commands() + filtered = [c for c in commands if c.name != cmd_name] + if len(filtered) == len(commands): + raise HTTPException(status_code=404, detail="Command not found") + save_commands(filtered) + return {"message": f"Befehl '{cmd_name}' gelöscht"} \ No newline at end of file diff --git a/goldanker_commands/requirements.txt b/goldanker_commands/requirements.txt new file mode 100644 index 0000000..a4325a6 --- /dev/null +++ b/goldanker_commands/requirements.txt @@ -0,0 +1,13 @@ +from pathlib import Path + +# Inhalt der requirements.txt +requirements_content = """fastapi +uvicorn[standard] +pydantic +""" + +# Speicherort für requirements.txt +requirements_path = Path("/mnt/data/requirements.txt") +requirements_path.write_text(requirements_content) + +requirements_path.name diff --git "a/n\303\244chste_Schritte/Contributing_guidelinie_GoldForge.md" "b/n\303\244chste_Schritte/Contributing_guidelinie_GoldForge.md" new file mode 100644 index 0000000..d34242b --- /dev/null +++ "b/n\303\244chste_Schritte/Contributing_guidelinie_GoldForge.md" @@ -0,0 +1,141 @@ +Hier ist ein Beispiel für eine ansprechende und umfassende CONTRIBUTING.md, die du direkt in dein Projekt integrieren kannst: + +--- + +# CONTRIBUTING Guidelines for GoldForge_aktuel_v1 + +Vielen Dank, dass du zur Weiterentwicklung von GoldForge_aktuel_v1 beitragen möchtest! Diese Richtlinien helfen uns, einen strukturierten und effizienten Workflow sicherzustellen – egal ob du ein neues Feature einführst, Bugs behebst oder die Dokumentation erweiterst. + +--- + +## Inhaltsverzeichnis + +- [CONTRIBUTING Guidelines for GoldForge\_aktuel\_v1](#contributing-guidelines-for-goldforge_aktuel_v1) + - [Inhaltsverzeichnis](#inhaltsverzeichnis) + - [Code of Conduct](#code-of-conduct) + - [Branch-Konvention](#branch-konvention) + - [Workflow \& Pull Request-Prozess](#workflow--pull-request-prozess) + - [Commit-Richtlinien](#commit-richtlinien) + - [Testen und CI/CD](#testen-und-cicd) + - [Feedback und Kommunikation](#feedback-und-kommunikation) + - [Weitere Hinweise](#weitere-hinweise) + +--- + +## Code of Conduct + +Bitte verhalte dich respektvoll und konstruktiv. Wir schätzen freundliche, sachliche Kommunikation. Bei Konflikten hilft uns eine offene und lösungsorientierte Diskussion. + +--- + +## Branch-Konvention + +Unsere Branches folgen einem klaren Namensschema, um Übersicht und Automatisierung zu erleichtern. Die Branch-Namen bestehen aus zwei Teilen: + +``` +/- +``` + +**Bereiche:** +- **`frontend/`** – Für alle Änderungen an der GoldForge UI (Vue.js, PWA, etc.) +- **`backend/`** – Für den Goldanker Command Service (FastAPI) +- **`infra/`** – Für Docker, Kubernetes, CI/CD und Infrastruktur-Anpassungen +- **`docs/`** – Für Dokumentationsupdates, Setup-Guides oder Tutorials +- **`ci/`** – Für Änderungen an unseren CI/CD-Pipelines +- **`misc/`** – Für sonstige Anpassungen, die keiner der o.g. Kategorien eindeutig zugeordnet werden können + +**Typen:** +- **`feature/`** – Neue Funktionen oder Erweiterungen +- **`fix/`** – Bugfixes und Korrekturen +- **`refactor/`** – Umstrukturierungen und Optimierungen im Code +- **`hotfix/`** – Kritische Fehlerbehebungen im Produktionssystem +- **`test/`** – Temporäre oder experimentelle Änderungen + +**Beispiele:** +- `frontend/feature-login-ui` +- `backend/fix-authentication` +- `infra/refactor-docker-compose` +- `docs/update-setup-guide` + +--- + +## Workflow & Pull Request-Prozess + +1. **Fork & Branch erstellen:** + Erstelle zunächst einen Fork des Projekts (falls du nicht direkt im Repository arbeitest) und dann einen neuen Branch, der auf dem aktuellen Stand von `main` basiert: + ```bash + git checkout main + git pull + git checkout -b /- + ``` + +2. **Entwicklung:** + Arbeite an deinem Feature oder Fix. Committe regelmäßig und benutze aussagekräftige Commit-Messages. + +3. **Tests & Lokale Überprüfung:** + Stelle sicher, dass dein Code lokal alle Tests besteht und den vorgegebenen Code-Standards entspricht. + +4. **Pull Request (PR) erstellen:** + Eröffne einen Pull Request, in dem du deine Änderungen beschreibst. Bitte um Review und Feedback. Bei größeren Änderungen oder Unsicherheiten nutze gerne unseren Discord- oder Slack-Kanal, um vorab Rücksprache zu halten. + +5. **Code Review & Merge:** + Ein Teammitglied wird deinen PR überprüfen. Sobald alle Tests erfolgreich sind und das Feedback berücksichtigt wurde, erfolgt der Merge in den `dev`-Branch (oder direkt in `main`, falls es sich um einen Hotfix handelt). + +--- + +## Commit-Richtlinien + +- **Klar und prägnant:** + Schreibe Commit-Messages, die klar den Zweck der Änderung beschreiben. + _Beispiel:_ `frontend/feature-login-ui: Implementiere Login-Oberfläche und Validierung` + +- **Konsistente Formatierung:** + Nutze das Format `/: Kurze Beschreibung` für die erste Zeile deiner Commit-Messages. + Weitere Details können in den nächsten Zeilen folgen. + +- **Squash Commits:** + Falls möglich, fasse mehrere kleine Commits zusammen, bevor du deinen Branch in den Integrationszweig mergst. + +--- + +## Testen und CI/CD + +- **Automatisierte Tests:** + Stelle sicher, dass alle automatisierten Tests lokal und in der CI/CD-Pipeline erfolgreich laufen, bevor du einen PR eröffnest. + +- **Pre-Commit Hooks:** + Wir empfehlen die Nutzung von Git-Hooks (z. B. pre-commit) zur Code-Formatierung und Linting, um die Code-Qualität zu sichern. + +- **Branch-spezifische Builds:** + Unsere CI/CD-Pipeline führt Builds und Tests für alle Branches durch. Achte darauf, dass deine Änderungen branchübergreifend kompatibel sind. + +--- + +## Feedback und Kommunikation + +- **Offene Diskussion:** + Wenn du Fragen oder Verbesserungsvorschläge hast, eröffne bitte ein Issue oder sprich uns direkt an. + +- **Review-Prozess:** + Wir schätzen konstruktives Feedback – sei offen für Änderungsvorschläge und versuche, bei Diskussionen stets sachlich zu bleiben. + +--- + +## Weitere Hinweise + +- **Dokumentation:** + Ergänze die README.md oder andere Dokumentationsdateien, wenn deine Änderungen neue Features oder Anpassungen betreffen. + +- **Automatisierung:** + Falls du Skripte oder Automatisierungstools entwickelst, die den Workflow verbessern (z. B. automatische Branch-Erstellung oder Versionierung), dokumentiere diese bitte ebenfalls. + +- **Branch Protection:** + Um versehentliche Änderungen an `main` zu vermeiden, sind direkte Pushes in diesen Branch deaktiviert. Änderungen müssen immer über einen PR erfolgen. + +--- + +Vielen Dank für deinen Beitrag und dein Engagement! Gemeinsam machen wir GoldForge_aktuel_v1 noch besser und zukunftssicher. + +--- + +Hast du Fragen zu einem der Punkte oder weitere Anregungen? Dann melde dich gerne – wir sind stets offen für Verbesserungen! \ No newline at end of file diff --git "a/n\303\244chste_Schritte/Treebefehl.md" "b/n\303\244chste_Schritte/Treebefehl.md" new file mode 100644 index 0000000..65e0bc5 --- /dev/null +++ "b/n\303\244chste_Schritte/Treebefehl.md" @@ -0,0 +1 @@ +tree -a -I 'node_modules|.git|dist|__pycache__' > Tree.md diff --git "a/n\303\244chste_Schritte/workflow_upgrade.md" "b/n\303\244chste_Schritte/workflow_upgrade.md" new file mode 100644 index 0000000..466ff1e --- /dev/null +++ "b/n\303\244chste_Schritte/workflow_upgrade.md" @@ -0,0 +1,111 @@ +Dein aktueller Workflow mit der **Befehlsbibliothek** ist schon richtig stark aufgestellt – du hast Vue, PWA, Drag & Drop, FastAPI als Backend (Goldanker CommandService) und sogar GitHub Actions für automatisiertes Deployment im Einsatz. Aber du kannst das Ganze noch **viel produktiver, modularer und zukunftssicherer** machen. + +--- + +## 🚀 **Wie du deinen Workflow verbessern kannst** + +### 🔁 1. **Befehle als lebendige Ressource** +Aktuell liegt deine `befehle.json` als Datei vor. Du könntest daraus eine **API-gesteuerte Datenquelle** machen: + +- Nutze den `Goldanker_CommandService`, um Befehle nicht nur anzuzeigen, sondern auch **hinzuzufügen, zu bearbeiten und zu löschen**. +- Dadurch wird deine Bibliothek zu einem echten Tool – wie ein **Command-CMS für Developer**. + +📌 *Vorteil:* Du musst die Datei nicht manuell bearbeiten, sondern kannst alles in der Oberfläche steuern – inklusive Git-Commit per Hook. + +--- + +### 💡 2. **Live-Interaktion mit deinem System** + +Statt nur Befehle darzustellen, könntest du optional auch: +- **Terminal-Output simulieren**, z. B. für `docker ps` oder `kubectl get pods`. +- **Befehle wirklich ausführen** (lokal im Container über einen `command-runner` Service – optional und sicher!) + +📌 *Vorteil:* Die Bibliothek wird interaktiv – ein Spielplatz und gleichzeitig Werkzeug. + +--- + +### 🧱 3. **Modularer Aufbau & Kategorien erweitern** +Mit der Kategorie-Struktur aus `Roadmap_v2.md` kannst du systematisch dein ganzes **Goldfruit-Ökosystem** abbilden: + +| Agent | Kategorie | Beispiel-Befehle | +|------------------|----------------------------|---------------------------------------| +| Goldstrom | Monitoring & Prometheus | `prometheus --config.file=...` | +| Goldfeder | Git & Docs | `git log`, `pandoc` | +| Goldanker | APIs, GitHub/GitLab | `gh`, `curl`, `gitlab-runner exec` | +| DashGold | Visualisierung | `grafana-cli plugins install` | +| TensorGold | Training, ML-Tools | `torchrun`, `optuna`, `ray` | +| GoldChain | IPFS, Ethereum, Wallet | `ipfs add`, `geth`, `clef` | + +📌 *Vorteil:* Du trainierst dich und deine Agenten direkt mit der Struktur, die später dein Backend bildet. + +--- + +### 🔄 4. **Synchronisiertes Git-Repo (Goldanker als Git-Committer)** + +Nach jedem `POST`, `PUT`, `DELETE` in deiner API kannst du automatisch: +- ein `git add`, `git commit` und `git push` triggern. +- so bleibt `befehle.json` **immer versioniert** und auf GitHub synchron. + +> 🎯 Mit `subprocess` oder GitHub API in FastAPI umsetzbar. + +--- + +### ☁️ 5. **Backend in Microservices aufteilen** +Jetzt hast du: +``` +goldanker_commands/ + └─ main.py (FastAPI) +``` + +Später könntest du das in Module wie `CommandService`, `UserService`, `SearchService` splitten und mit Kafka verbinden → perfekt für dein Triangle-Pattern im Goldfruit-System. + +--- + +### ⚡ 6. **Workspace teilen & exportieren** +Momentan ist dein Workspace `localStorage`-basiert. + +📌 *Zukunftsidee*: +- Button: „Workspace exportieren“ → JSON-Datei (oder QR-Code!) +- oder: "Workspace teilen" → Push an Goldanker & Link zurückbekommen. + +So kannst du deine Arbeitsfläche mit anderen teilen oder auf mehreren Geräten nutzen. + +--- + +## 🛠️ **Wie du das Tool weiterentwickeln könntest** + +### 🔮 **Nächste Ausbaustufen für die Befehlsbibliothek** + +| Funktion | Nutzen | +|------------------------------|----------------------------------------------------| +| **Benutzerverwaltung** | Verschiedene User mit Rechten, Rollen, Favoriten | +| **Versionierung pro Befehl** | Änderungen nachverfolgbar, wie bei GitHub Files | +| **Vorschau für Befehle** | Markdown-Preview oder Beispiel-Ausgabe anzeigen | +| **Markdown-Export** | Arbeitsfläche als Dev-Doku exportieren (PDF / MD) | +| **Mobile Optimierung** | Per Smartphone schnell einen Befehl nachsehen | +| **GPT-Integration** | Automatisch neue Befehle vorschlagen lassen | +| **CI/CD Integration** | Befehle gleich als GitLab/YAML-Jobs exportieren | + +--- + +## 🧭 Zusammenfassung: Optimierter Workflow + +1. **Frontend (PWA):** + - Kachel-Design, Drag & Drop, Kategorien, Tooltip-Infos + +2. **Backend (Goldanker):** + - REST-API mit FastAPI (CRUD für `befehle.json`) + - Optional: Command-Ausführung, Git-Autosync + +3. **CI/CD:** + - GitHub Actions oder GitLab zum automatischen Deployment + +4. **Ausbaustufen:** + - Teilen von Workspaces + - GPT-gestützte Befehlsvorschläge + - Microservice-Architektur + - Integration mit Goldfruit-Agenten + +--- + +Wenn du magst, kann ich dir den nächsten konkreten Schritt vorschlagen – z. B. `POST /commands`-Formular bauen, oder `vue-draggable-next` implementieren. Sag einfach, in welchem Bereich du loslegen willst. \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index eacf5d0..93d81d7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,7 +10,8 @@ "dependencies": { "tippy.js": "^6.3.7", "vue": "^3.2.47", - "vue-tippy": "^6.7.0" + "vue-tippy": "^6.7.0", + "vuedraggable": "^2.24.3" }, "devDependencies": { "@vitejs/plugin-vue": "^4.0.0", @@ -3842,6 +3843,11 @@ "dev": true, "license": "MIT" }, + "node_modules/sortablejs": { + "version": "1.10.2", + "resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.10.2.tgz", + "integrity": "sha512-YkPGufevysvfwn5rfdlGyrGjt7/CRHwvRPogD/lC+TnvcN29jDpCifKP+rBqf+LRldfXSTh+0CGLcSg0VIxq3A==" + }, "node_modules/source-map": { "version": "0.8.0-beta.0", "dev": true, @@ -4371,6 +4377,14 @@ "vue": "^3.2.0" } }, + "node_modules/vuedraggable": { + "version": "2.24.3", + "resolved": "https://registry.npmjs.org/vuedraggable/-/vuedraggable-2.24.3.tgz", + "integrity": "sha512-6/HDXi92GzB+Hcs9fC6PAAozK1RLt1ewPTLjK0anTYguXLAeySDmcnqE8IC0xa7shvSzRjQXq3/+dsZ7ETGF3g==", + "dependencies": { + "sortablejs": "1.10.2" + } + }, "node_modules/webidl-conversions": { "version": "4.0.2", "dev": true, diff --git a/package.json b/package.json index e6371ce..333ac0d 100644 --- a/package.json +++ b/package.json @@ -9,7 +9,8 @@ "dependencies": { "tippy.js": "^6.3.7", "vue": "^3.2.47", - "vue-tippy": "^6.7.0" + "vue-tippy": "^6.7.0", + "vuedraggable": "^2.24.3" }, "devDependencies": { "@vitejs/plugin-vue": "^4.0.0", diff --git a/src/App.vue b/src/App.vue index 8836b71..d550d79 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,29 +1,153 @@ - - Befehlsbibliothek - - + + + + Bibliothek + + + + {{ cmd.name }} ({{ cmd.category }}) + → + + + + + + Arbeitsfläche + + + + + {{ cmd.name }} + {{ cmd.description }} + {{ cmd.command }} + X + + + + + - + \ No newline at end of file diff --git a/vite.config.js b/vite.config.js index 1f139d1..696847f 100644 --- a/vite.config.js +++ b/vite.config.js @@ -29,5 +29,6 @@ export default defineConfig({ } }) ], - base: "./", // Wichtig für relative Pfade, gerade wenn du GitHub Pages nutzen willst + base: "/GoldForge/" + });
{{ cmd.description }}
{{ cmd.command }}