Week 5: React UI Scaffold — Nov 23 – 29, 2024
TL;DR: The React frontend is live with Vite, TailwindCSS, and a glassmorphic design system. Dashboard, login, and navigation are functional.
Highlights This Week
- Scaffolded the React + Vite frontend with TailwindCSS
- Built the glassmorphic sidebar navigation (GlassSidebar)
- Implemented the login page with JWT integration
Design System
We chose a glassmorphic design language — frosted glass panels with subtle transparency and blur effects. It gives Exoserva a premium, modern feel that differentiates it from the utilitarian look of competitors like ServiceTitan or HouseCall Pro. TailwindCSS powers the utility-first styling with custom design tokens for our color palette.
Frontend Architecture
The app structure follows a clear separation: pages/ for route-level components, components/ for reusable UI, hooks/ for shared logic, and domain/ for business logic. The API adapter layer transforms raw API responses into typed frontend models.
What’s Next
Wiring up the customer and job management pages to the API.