home-automation/apps/ui

Home Automation UI

FastAPI-based web interface with Jinja2 templates for the home automation system.

Features

• Jinja2 Templates: Dynamic HTML rendering
• Responsive Design: Modern, clean UI
• FastAPI Backend: Fast and reliable serving

Port Configuration

• Development Port: 8002
• Access URL: http://localhost:8002

Running the UI

Using uvicorn directly

poetry run uvicorn apps.ui.main:app --reload --port 8002

Using Python module

poetry run python -m apps.ui.main

Docker Container

Build Image

docker build -t ui:dev -f apps/ui/Dockerfile .

Run Container

Linux Server (empfohlen):

# Mit Docker Network für Container-to-Container Kommunikation
docker run --rm -p 8002:8002 \
  -e UI_PORT=8002 \
  -e API_BASE=http://172.19.1.11:8001 \
  -e BASE_PATH=/ \
  ui:dev

macOS mit finch/nerdctl:

docker run --rm -p 8002:8002 \
  --add-host=host.docker.internal:host-gateway \
  -e UI_PORT=8002 \
  -e API_BASE=http://host.docker.internal:8001 \
  -e BASE_PATH=/ \
  ui:dev

Hinweise:

• Linux: Verwende Docker Network und Service-Namen (http://api:8001)
• macOS/finch: Verwende host.docker.internal mit --add-host flag
• Die UI macht Server-Side API-Aufrufe beim Rendern der Seite
• Browser-seitige Realtime-Updates (SSE) gehen direkt vom Browser zur API

Environment Variables

Variable	Default	Description
UI_PORT	8002	Port for UI server
API_BASE	http://localhost:8001	Base URL for API service
BASE_PATH	/	Base path for routing

Project Structure

apps/ui/
├── __init__.py
├── main.py           # FastAPI application
├── templates/        # Jinja2 templates
│   └── index.html   # Main page
└── README.md        # This file

Templates

Templates are located in apps/ui/templates/ and use Jinja2 syntax.

Available Routes

• GET / - Main UI page (renders index.html)

Development

The server runs with auto-reload enabled during development. Any changes to:

• Python files (.py)
• Template files (.html)

will trigger an automatic restart.

Dependencies

• FastAPI: Web framework
• Jinja2: Template engine
• Uvicorn: ASGI server

Template Variables

Templates receive the following context variables:

• request: FastAPI Request object (required by Jinja2Templates)

Future Enhancements

• Add static file serving (CSS, JS, images)
• Implement WebSocket support for real-time updates
• Add device control interface
• Integrate with API for capability discovery