A private family chat interface — "The Domestic Atelier" — built for household communication. Authenticated via PocketBase, with Apprise notifications and optional AI assistance. A cozy, editorial take on messaging that lives inside the home network.

What it is

A self-hosted family messaging application. Unlike public chat apps, it runs on the home network, keeps conversations private, and integrates with the household's own services (PocketBase for auth/data, Apprise for notifications). Designed with a warm, editorial aesthetic to feel like home, not a corporate tool.

Tech stack

Layer	Technology
Framework	React 19
Build	Vite 6
Styling	Tailwind CSS 4 (via `@tailwindcss/vite`)
Backend	PocketBase (`pocketbase` SDK)
Notifications	Apprise
AI	@google/genai (Gemini)
Routing	React Router 7
Animation	Motion 12
Icons	lucide-react
Language	TypeScript

Architecture & design patterns

Auth context — AuthContext wraps the app, managing PocketBase auth state and session (pb.authStore)
Service layer — lib/pocketbase.ts centralizes the PocketBase client, base URL from VITE_POCKETBASE_URL (defaults to the homelab instance), and auth-state hooks
Route-based pages — Chat, Login, Settings, HowTo under a shared Layout
Environment-driven config — PocketBase & Apprise URLs via VITE_* env vars (never committed)
Editorial design — warm, styled messaging UI (The Domestic Atelier aesthetic)
Client-side auth — login flow with PocketBase email/password auth

Pages

Route	Purpose
`/chat`	The family chat interface
`/login`	PocketBase authentication
`/settings`	App & notification settings
`/how-to`	Usage guide for the household

Configuration

Copy .env.example → .env.local:

VITE_POCKETBASE_URL=http://192.168.20.13:8090   # homelab PocketBase
VITE_APPRISE_URL=                                # Apprise notification endpoint

Getting started

npm install
npm run dev      # development server
npm run build    # production build

Structure

src/
├── components/    # Header, Layout
├── contexts/      # AuthContext (PocketBase auth state)
├── lib/           # pocketbase.ts (client + config)
├── pages/         # Chat, Login, Settings, HowTo
├── App.tsx        # Router + providers
└── main.tsx       # Entry point

Standards

TypeScript strict mode
Secrets never committed (.env.* gitignored)
Semantic HTML, accessible landmarks
Fully responsive, mobile-first (messaging on the go)
Self-hosted — data stays in the home

Part of the Sam Rolfe portfolio family.