Files
LagerFastApi/README.md
2026-02-12 19:17:28 +01:00

2.4 KiB

FastAPI + Vue 3 (Vite) Monorepo

Dieses Repository enthält ein Backend (FastAPI) und ein Frontend (Vue 3 + Vite). Im Dev-Modus läuft das Frontend über Vite (localhost:5173) und proxyt API-Calls auf das Backend (127.0.0.1:8000) via /api.

Tech Stack

Backend

  • FastAPI
  • SQLAlchemy + Alembic (Migrationen)
  • SQLite (Default, konfigurierbar über DATABASE_URL)

Frontend

  • Vue 3
  • Vite
  • TypeScript
  • Axios (gekapselt in einer API-Schicht)
  • openapi-typescript (typed Client-Types aus FastAPI OpenAPI)

Repository Struktur (High-Level)

. ├─ LagerFastApi/ # Backend (LagerFastApi) │ └─ app/ │ ├─ api/ # Router/Schemas (HTTP Layer) │ ├─ db/ # DB Session/Engine, Alembic Integration │ ├─ domain/ # Domain Model (framework-agnostisch) │ └─ main.py # FastAPI App Entry ├─ alembic/ # Migrationen ├─ data/ # Lokale SQLite (ignored) ├─ frontend/ # Vue 3 + Vite │ ├─ src/ │ │ ├─ api/ # HTTP + API Adapter (einziger Axios-Ort) │ │ ├─ features/ # Feature-Services + Views/Pages │ │ └─ generated/ # Generierte OpenAPI Types (ignored) │ └─ vite.config.ts # Proxy /api -> 127.0.0.1:8000 └─ package.json # Root Dev-Orchestrierung (optional)


Voraussetzungen

  • Python 3.11+ (empfohlen)
  • Node.js 20+ (du nutzt bereits eine aktuelle Version)
  • Git

Setup

1) Backend installieren

Im Projektroot:

python -m venv .venv
# Windows PowerShell:
.\.venv\Scripts\Activate.ps1

pip install -r requirements.txt

Db-Migrationen anwenden: alembic upgrade head
Backend starten: python -m uvicorn fastapi_demo.app.main:app --reload --host 127.0.0.1 --port 8000
Test:
OpenAPI JSON: http://127.0.0.1:8000/openapi.json
Health: http://127.0.0.1:8000/api/health


Frontend Setup
1) Dependencies installieren
cd frontend
npm install
2) Env konfigurieren

frontend/.env.development:

VITE_API_BASE=/api
VITE_OPENAPI_URL=http://127.0.0.1:8000/openapi.json
3) OpenAPI Types generieren

Backend muss laufen!

npm run gen:api
4) Frontend starten
npm run dev

Webpage:

http://localhost:5173

Proxy-Test:

http://localhost:5173/api/health (geht über Vite Proxy zum Backend)

Dev-Orchestrierung (optional, Root)

Du kannst optional eine Root-package.json verwenden, um Backend+Frontend mit einem Command zu starten.