How fastapi-practices/fastapi-best-architecture-ui works
This is the Vue admin frontend for FastAPI Best Architecture. An operator enters through authentication, then uses the routed admin workspace for account, access-control, monitoring, scheduling, and plugin functions backed by API modules. The sampled source confirms application initialization, request-client behavior, and route-generation helpers; most screen-to-API wiring is not sampled, so those links are omitted rather than assumed.
Main entry points: main.ts App initialization · index.ts Router · auth.ts Authentication API · bootstrap.ts App bootstrap
Components 22
Application shell
- App initialization
apps/web-antdv-next/src/main.ts - App bootstrap
apps/web-antdv-next/src/bootstrap.ts - Vue app root
apps/web-antdv-next/src/app.vue - Layouts
apps/web-antdv-next/src/layouts/index.ts
Access and navigation
- Router
apps/web-antdv-next/src/router/index.ts - Route guard
apps/web-antdv-next/src/router/guard.ts - Route access
apps/web-antdv-next/src/router/access.ts - Dynamic routes
packages/utils/src/helpers/generate-routes-backend.ts - Login screens
apps/web-antdv-next/src/views/_core/authentication/login.vue - Auth state
apps/web-antdv-next/src/store/auth.ts
Admin domains
- System administration
apps/web-antdv-next/src/views/system/user/index.vue - System APIs
- Audit logs
apps/web-antdv-next/src/views/log/login/index.vue - System monitoring
apps/web-antdv-next/src/views/monitor/server/index.vue - Job scheduling
apps/web-antdv-next/src/views/scheduler/manage/index.vue - Plugin management
apps/web-antdv-next/src/views/system/plugin/index.vue - Plugin API
apps/web-antdv-next/src/api/plugin.ts
Frontend services
- Authentication API
apps/web-antdv-next/src/api/core/auth.ts - HTTP client
packages/effects/request/src/request-client/request-client.ts - User preferences
apps/web-antdv-next/src/preferences.ts
Other components
- Operator
- FastAPI backend
Connections 21
- Operator → App initialization: opens app
- App initialization → User preferences: initializes
- App initialization → App bootstrap: starts app
- App bootstrap → Vue app root: mounts
- Vue app root → Router: renders routes
- Router → Layouts: uses layouts
- Router → Route guard: checks navigation
- Route guard → Route access: checks access
- Route access → Dynamic routes: generates routes
- Operator → Login screens: submits credentials
- Login screens → Authentication API: requests login
- Authentication API → HTTP client: sends request
- HTTP client → FastAPI backend: HTTP requests
- Auth state → Authentication API: uses authentication
- Operator → System administration: manages records
- System administration → System APIs: uses domain APIs
- Operator → Audit logs: reviews activity
- Operator → System monitoring: views health
- Operator → Job scheduling: manages jobs
- Operator → Plugin management: manages plugins
- Plugin management → Plugin API: uses plugin API