project-manager/web

Todo List — web

Vue 3 + TypeScript + Vite PWA. Talks to the REST API in the parent directory.

Develop on the host

npm install
npm run dev            # http://localhost:5173

The dev server proxies /api to http://localhost:8080 (the Dockerised API — run docker compose up -d in the parent directory first). Override the target with VITE_PROXY_TARGET, or point the app at a different API entirely with VITE_API_BASE_URL (see .env.example).

Develop in Docker

From the parent directory:

docker compose --profile frontend up -d

Runs this dev server alongside the API. /api is proxied to the app container. After changing package.json, rebuild: docker compose build web.

Build

npm run build         # type-checks, then emits dist/
npm run preview

Layout

src/main.ts            App bootstrap; resolves the stored session before mount
src/router/index.ts    Routes + guard (redirects to /login when unauthenticated)
src/stores/auth.ts     Pinia store: token in localStorage, register/login/fetchMe
src/stores/lists.ts    Pinia store: the user's lists (fetch + create)
src/lib/api.ts         fetch wrapper, bearer token, typed ApiError
src/views/             HomeView (lists + create form), LoginView, RegisterView

Auth flow

• The token from POST /api/auth/register or /login is kept in localStorage and sent as Authorization: Bearer ….
• On load, fetchMe() validates the stored token via GET /api/me; a failure clears it.
• Routes with meta.requiresAuth redirect to /login (preserving the intended path) when there is no authenticated user.
• Registration signs the user in immediately; the new account's email is unverified (user.email_verified === false), surfaced in the header and on the home page.