{"id":48884740,"url":"https://github.com/goldfruit/goldforge","last_synced_at":"2026-04-16T04:32:13.066Z","repository":{"id":285272450,"uuid":"952685020","full_name":"Goldfruit/GoldForge","owner":"Goldfruit","description":"Interaktive Befehlsbibliothek mit Vue-Frontend und FastAPI-Microservice – optimiert für CI/CD-Workflows und GitHub Pages Deployment.","archived":false,"fork":false,"pushed_at":"2025-03-31T20:32:03.000Z","size":144,"stargazers_count":0,"open_issues_count":1,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-08T07:01:43.101Z","etag":null,"topics":["ci-cd","commands","fastapi","goldforge","interactiv","microsevice","pwa","vue"],"latest_commit_sha":null,"homepage":"","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Goldfruit.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2025-03-21T17:41:45.000Z","updated_at":"2025-03-30T17:41:03.000Z","dependencies_parsed_at":null,"dependency_job_id":"a549ab1c-d527-4bf0-8d0d-bb2220a808f0","html_url":"https://github.com/Goldfruit/GoldForge","commit_stats":null,"previous_names":["goldfruit/goldforge"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Goldfruit/GoldForge","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Goldfruit%2FGoldForge","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Goldfruit%2FGoldForge/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Goldfruit%2FGoldForge/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Goldfruit%2FGoldForge/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Goldfruit","download_url":"https://codeload.github.com/Goldfruit/GoldForge/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Goldfruit%2FGoldForge/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31871534,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-15T15:24:51.572Z","status":"online","status_checked_at":"2026-04-16T02:00:06.042Z","response_time":69,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ci-cd","commands","fastapi","goldforge","interactiv","microsevice","pwa","vue"],"created_at":"2026-04-16T04:32:08.278Z","updated_at":"2026-04-16T04:32:13.051Z","avatar_url":"https://github.com/Goldfruit.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Befehlsbibliothek mit Goldanker-Backend – Komplette README\n\n\nDieser Leitfaden vereint zwei Roadmaps (v1 und v2) zu einer umfassenden Dokumentation für deine Interaktive Befehlsbibliothek mit Anbindung an einen **Goldanker**-Microservice.\n\n---\n\n## 1. Architektur \u0026 Idee\n\n### 1.1 Ziel\nEine **Progressive Web App (PWA)** zur **Verwaltung von Befehlen** (z. B. Docker-, Kubernetes-, Git-Befehle) mit\n- **Zweiteiliger Oberfläche** (Bibliothek \u0026 Arbeitsfläche)\n- **Drag \u0026 Drop**-Funktionalität\n- **Kachel-Design**\n- **Backend** (Goldanker CommandService, FastAPI oder Node.js)\n\n### 1.2 Datenfluss\n1. Frontend (Vue + Vite + PWA)\n2. Backend (Goldanker_CommandService)\n3. befehle.json (Serverseitige Ablage)\n4. CI/CD (GitHub Actions / GitLab)\n\n---\n\n## 2. Funktionale Übersicht\n\n### 2.1 Zweiteilige Oberfläche\n- **Bibliothek (links):**\n  - Alle Befehle kategorisiert (Git, Docker, usw.)\n  - Suchfeld, um rasch Befehle zu finden\n- **Arbeitsfläche (rechts):**\n  - Kachel-Design\n  - Drag \u0026 Drop: Befehle aus Bibliothek in Arbeitsfläche schieben\n  - X-Button zum Entfernen\n\n### 2.2 Kachel-Design\n- Enthält:\n  - **Name**, **Beschreibung**, **Command**\n  - Optionale Infos, Tooltips\n- Resizable (per CSS-Resize) \u0026 frei platzierbar\n\n### 2.3 Drag \u0026 Drop\n- Nutzung von [vue-draggable-next](https://github.com/SortableJS/vue.draggable.next)\n  - `v-model`-Synchronisierung\n  - Optional: Reordering in Bibliothek oder Arbeitsfläche\n- Alternativ: manuelles Drag \u0026 Drop (Events `dragstart`, `dragend`)\n\n### 2.4 Persistenz\n- **Frontend**: localStorage\n  - Speichert Position und Größe der Kacheln\n- **Backend**: befehle.json\n  - Speichert Befehle, Kategorien, Beschreibungen\n\n### 2.5 JSON-Struktur\n- `name`, `command`, `category`, `description`, `info`\n\n```json\n[\n  {\n    \"name\": \"Docker Build\",\n    \"command\": \"docker-compose up --build\",\n    \"category\": \"Docker\",\n    \"description\": \"Container neu bauen und starten\",\n    \"info\": \"Nach Änderungen oder Cache-Problemen.\"\n  },\n  {\n    \"name\": \"Kubernetes Pods anzeigen\",\n    \"command\": \"kubectl get pods\",\n    \"category\": \"Kubernetes\",\n    \"description\": \"Zeigt aktuell laufende Pods an\",\n    \"info\": \"Hilfreich für schnellen Überblick der Container.\"\n  }\n]\n```\n\n---\n\n## 3. Goldanker CommandService (Beispiel in FastAPI)\n\n### 3.1 Aufbau\n```\ngoldanker_commands/\n ├── Dockerfile\n ├── requirements.txt\n ├── main.py           \u003c-- FastAPI-Code\n ├── befehle.json      \u003c-- Serverseitig gespeichert\n └── ...\n```\n\n### 3.2 Dockerfile\n```Dockerfile\nFROM python:3.10-slim\n\nWORKDIR /app\nCOPY requirements.txt ./\nRUN pip install --no-cache-dir -r requirements.txt\n\nCOPY . /app\n\nCMD [\"uvicorn\", \"main:app\", \"--host\", \"0.0.0.0\", \"--port\", \"8000\"]\n```\n\n### 3.3 main.py (CRUD-Endpunkte)\n```python\nfrom fastapi import FastAPI, HTTPException\nfrom pydantic import BaseModel\nfrom typing import List, Optional\nimport json\nimport os\n\napp = FastAPI()\n\nJSON_FILE = os.getenv(\"COMMANDS_JSON_PATH\", \"./befehle.json\")\n\nclass Command(BaseModel):\n    name: str\n    command: str\n    category: str\n    description: Optional[str] = None\n    info: Optional[str] = None\n\ndef load_commands() -\u003e List[Command]:\n    if not os.path.exists(JSON_FILE):\n        return []\n    with open(JSON_FILE, \"r\", encoding=\"utf-8\") as f:\n        data = json.load(f)\n        return [Command(**cmd) for cmd in data]\n\ndef save_commands(commands: List[Command]):\n    with open(JSON_FILE, \"w\", encoding=\"utf-8\") as f:\n        json.dump([cmd.dict() for cmd in commands], f, indent=2, ensure_ascii=False)\n\n@app.get(\"/commands\", response_model=List[Command])\ndef get_commands():\n    return load_commands()\n\n@app.post(\"/commands\", response_model=Command)\ndef create_command(new_cmd: Command):\n    commands = load_commands()\n    # Optional: check duplicates\n    commands.append(new_cmd)\n    save_commands(commands)\n    return new_cmd\n\n@app.put(\"/commands/{cmd_name}\", response_model=Command)\ndef update_command(cmd_name: str, updated_cmd: Command):\n    commands = load_commands()\n    for i, c in enumerate(commands):\n        if c.name == cmd_name:\n            commands[i] = updated_cmd\n            save_commands(commands)\n            return updated_cmd\n    raise HTTPException(status_code=404, detail=\"Command not found\")\n\n@app.delete(\"/commands/{cmd_name}\")\ndef delete_command(cmd_name: str):\n    commands = load_commands()\n    filtered = [c for c in commands if c.name != cmd_name]\n    if len(filtered) == len(commands):\n        raise HTTPException(status_code=404, detail=\"Command not found\")\n    save_commands(filtered)\n    return {\"message\": f\"Befehl '{cmd_name}' gelöscht\"}\n```\n\n### 3.4 Docker-Compose Integration\n```yaml\nversion: '3.8'\nservices:\n  goldanker_commands:\n    build: ./goldanker_commands\n    container_name: goldanker_commands\n    environment:\n      - COMMANDS_JSON_PATH=/app/befehle.json\n    volumes:\n      - ./goldanker_commands/befehle.json:/app/befehle.json\n    ports:\n      - \"8000:8000\"\n    # depends_on, networks, etc.\n```\n\n---\n\n## 4. Vue-Frontend (Befehlsbibliothek)\n\n### 4.1 Struktur\n```\nbefehlsbibliothek/\n ├── src/\n │   ├── App.vue\n │   ├── main.js\n │   └── assets/\n │       └── styles.css\n ├── public/\n ├── vite.config.js\n ├── package.json\n └── ...\n```\n\n### 4.2 App.vue (Beispiel mit vue-draggable-next)\n```html\n\u003ctemplate\u003e\n  \u003cdiv class=\"app-layout\"\u003e\n    \u003c!-- Linke Seite (Bibliothek) --\u003e\n    \u003cdiv class=\"left-panel\"\u003e\n      \u003ch2\u003eBibliothek\u003c/h2\u003e\n      \u003cinput type=\"text\" v-model=\"searchQuery\" placeholder=\"Befehle durchsuchen...\" /\u003e\n\n      \u003cdiv v-for=\"cmd in filteredCommands\" :key=\"cmd.name\" class=\"library-item\"\u003e\n        \u003cdiv\u003e{{ cmd.name }} ({{ cmd.category }})\u003c/div\u003e\n        \u003cbutton @click=\"addToWorkspace(cmd)\"\u003e→\u003c/button\u003e\n      \u003c/div\u003e\n    \u003c/div\u003e\n\n    \u003c!-- Rechte Seite (Arbeitsfläche) --\u003e\n    \u003cdiv class=\"right-panel\"\u003e\n      \u003ch2\u003eArbeitsfläche\u003c/h2\u003e\n\n      \u003cdraggable v-model=\"workspace\" class=\"workspace\" @end=\"onDragEnd\"\u003e\n        \u003ctransition-group\u003e\n          \u003cdiv\n            v-for=\"(cmd, idx) in workspace\"\n            :key=\"cmd.name\"\n            class=\"command-box\"\n            :style=\"{\n              position: 'relative',\n              marginBottom: '1rem',\n              // Optional: you could store x/y for absolute positioning,\n              // but Draggable handles basic re-order by default\n            }\"\n          \u003e\n            \u003ch3\u003e{{ cmd.name }}\u003c/h3\u003e\n            \u003cp\u003e{{ cmd.description }}\u003c/p\u003e\n            \u003ccode\u003e{{ cmd.command }}\u003c/code\u003e\n            \u003cbutton @click=\"removeFromWorkspace(idx)\"\u003eX\u003c/button\u003e\n          \u003c/div\u003e\n        \u003c/transition-group\u003e\n      \u003c/draggable\u003e\n    \u003c/div\u003e\n  \u003c/div\u003e\n\u003c/template\u003e\n\n\u003cscript\u003e\nimport { ref, computed, onMounted } from 'vue'\nimport Draggable from 'vuedraggable'\n\nexport default {\n  components: {\n    Draggable,\n  },\n  setup() {\n    const commands = ref([])\n    const workspace = ref([])\n    const searchQuery = ref('')\n\n    // 1) Commands laden\n    const loadCommands = async () =\u003e {\n      const res = await fetch('http://localhost:8000/commands')\n      const data = await res.json()\n      commands.value = data\n    }\n\n    // 2) Filter\n    const filteredCommands = computed(() =\u003e {\n      if (!searchQuery.value) return commands.value\n      return commands.value.filter((cmd) =\u003e\n        cmd.name.toLowerCase().includes(searchQuery.value.toLowerCase()) ||\n        cmd.category.toLowerCase().includes(searchQuery.value.toLowerCase())\n      )\n    })\n\n    // 3) Hinzufügen zur Arbeitsfläche\n    const addToWorkspace = (cmd) =\u003e {\n      // Minimale Kopie, evtl. mit default Position\n      workspace.value.push({ ...cmd })\n      saveWorkspace()\n    }\n\n    // 4) Entfernen von Arbeitsfläche\n    const removeFromWorkspace = (idx) =\u003e {\n      workspace.value.splice(idx, 1)\n      saveWorkspace()\n    }\n\n    // 5) onDragEnd\n    const onDragEnd = () =\u003e {\n      // Speichere Reihenfolge\n      saveWorkspace()\n    }\n\n    // 6) localStorage persist\n    const saveWorkspace = () =\u003e {\n      localStorage.setItem('workspace', JSON.stringify(workspace.value))\n    }\n    const loadWorkspaceLocal = () =\u003e {\n      const saved = localStorage.getItem('workspace')\n      if (saved) {\n        workspace.value = JSON.parse(saved)\n      }\n    }\n\n    onMounted(() =\u003e {\n      loadCommands()\n      loadWorkspaceLocal()\n    })\n\n    return {\n      commands,\n      workspace,\n      searchQuery,\n      filteredCommands,\n      addToWorkspace,\n      removeFromWorkspace,\n      onDragEnd,\n    }\n  },\n}\n\u003c/script\u003e\n\n\u003cstyle scoped\u003e\n.app-layout {\n  display: flex;\n  height: 100vh;\n}\n.left-panel {\n  width: 300px;\n  background: #fff;\n  padding: 1rem;\n  overflow-y: auto;\n}\n.right-panel {\n  flex: 1;\n  position: relative;\n  background: #f5f5f5;\n  overflow: hidden;\n  padding: 1rem;\n}\n.workspace {\n  min-height: 400px;\n  background: #e0e0e0;\n  padding: 1rem;\n  border: 2px dashed #ccc;\n}\n.command-box {\n  background: white;\n  border: 2px solid #ccc;\n  padding: 1rem;\n  margin-bottom: 1rem;\n  transition: transform 0.2s ease;\n}\n.command-box:hover {\n  transform: translateY(-4px);\n}\n\u003c/style\u003e\n```\n\n---\n\n## 5. Kategorien \u0026 Struktur\n\nHier einige sinnvolle Kategorien (erweiterbar):\n\n```yaml\n- Git\n- Docker\n- npm \u0026 Node.js\n- Ubuntu \u0026 Linux\n- Kubernetes \u0026 Helm\n- Kafka\n- Istio\n- Helm\n- Prometheus\n- Grafana\n- CI/CD (GitLab)\n- Python\n- Sicherheit \u0026 VPN\n- IPFS\n```\n\n---\n\n## 6. CI/CD und Deployment\n\n1. **Backend**: Docker build/push\n2. **Frontend**: `npm run build`, deploy nach GitHub Pages oder Docker-Container + Nginx\n3. **Docker-Compose**: orchestriert Services (goldanker_commands + befehlsbibliothek)\n4. **GitHub Actions / GitLab-CI**: automatisiertes Bauen und Ausrollen\n\n---\n\n## 7. Erweiterungsideen\n\n- **Command-Eingabemaske** (POST /commands)\n- **Edit-Funktion** (PUT /commands/{cmd_name})\n- **Git-Commit-Hook** nach Speichern\n- **Nutzer-/Rollenverwaltung**\n- **Tooltip**-Infos mit Tippy.js\n- **Responsive** für Mobile/Tablet\n\n---\n\n## 8. Fazit\n\nMit dieser kombinierten README hast du:\n1. Eine **Architektur-Beschreibung** (Backend/Frontend)\n2. **Konkrete Codebeispiele** (FastAPI + Vue)\n3. **Einen klaren Projektplan** (Phasen, Tools, Docker-Setup)\n4. **Optionale Features** (Git-Commit-Hooks, CI/CD, etc.)befehlsbibliothek/","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgoldfruit%2Fgoldforge","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgoldfruit%2Fgoldforge","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgoldfruit%2Fgoldforge/lists"}