Auth on Jesper Andersen - Blog & DevLog

Maintenance Log Frontend - Fifteenth Week: Frontend Final Wrap-Up (From Kickoff to Deployed App)

cph-ja472@stud.ek.dk (Jesper Andersen) — Mon, 01 Jun 2026 00:00:00 +0000

Devlog Week 15: Frontend Final Wrap-Up (From Kickoff to Deployed App)
#

When I wrote the first frontend entry (Week 9), the React app was basically a shell: Vite setup, a layout route, a drawer menu, and a couple of placeholder pages driven by mock data.

Maintenance Log Frontend - Fourteenth Week: Manager/Admin Flows, Create Pages, and Session Expiry Handling

cph-ja472@stud.ek.dk (Jesper Andersen) — Wed, 20 May 2026 00:00:00 +0000

Devlog Week 14: Manager/Admin Flows, Create Pages, and Session Expiry Handling
#

This entry covers the manager/admin-facing workflows (create pages and domain admin actions), and ends with a centralized error-handling + session expiry (token expiration) flow to keep UX consistent across the app.

Maintenance Log Frontend - Twelfth Week: User Profiles, Employee Admin Actions, and Form Patterns

cph-ja472@stud.ek.dk (Jesper Andersen) — Sat, 16 May 2026 00:00:00 +0000

Devlog Week 12: User Profiles, Employee Admin Actions, and Form Patterns
#

This entry covers the employee-facing parts of the UI: profile views, edit flows, admin actions, and the form patterns used to keep components maintainable.

What Changed
#

UserProfile supports both “me” and viewing other employees via dynamic route params
Profile page extracted into focused subcomponents:
- EditProfileForm, AdminActions, PasswordChangeForm
Form handling uses a mix of controlled inputs and a FormData approach (when appropriate)
useEffect race-condition prevention via an ignore flag to avoid setting state after unmount
Admin-only employee actions (deactivate/reactivate) gated by role and disallowed on own profile

User Profile: “Me” vs “Other Employee”
#

The profile route supports multiple entry points:

Maintenance Log Frontend - Tenth Week: Frontend Auth, Routing, and API Client Structure

cph-ja472@stud.ek.dk (Jesper Andersen) — Fri, 08 May 2026 00:00:00 +0000

Devlog Week 10: Frontend Auth, Routing, and API Client Structure
#

This entry covers the “plumbing” for the React frontend: the route layout, guarded routes by role, auth rehydration, and an API layer split by domain.

What Changed
#

Vite + React + React Router setup with a domain-organized structure (pages/, components/, utils/, context/, styles/)
Declarative nested routing with a layout route and <Outlet />
Auth context for user state, token rehydration, and role checks
ProtectedRoute component for nestable route protection
API layer split by domain with a shared apiRequest() helper

Routing: Nested Layout + Guards
#

The router is set up as nested routes:

Auth on Jesper Andersen - Blog & DevLog

Maintenance Log Frontend - Fifteenth Week: Frontend Final Wrap-Up (From Kickoff to Deployed App)

Devlog Week 15: Frontend Final Wrap-Up (From Kickoff to Deployed App) #

Maintenance Log Frontend - Fourteenth Week: Manager/Admin Flows, Create Pages, and Session Expiry Handling

Devlog Week 14: Manager/Admin Flows, Create Pages, and Session Expiry Handling #

Maintenance Log Frontend - Twelfth Week: User Profiles, Employee Admin Actions, and Form Patterns

Devlog Week 12: User Profiles, Employee Admin Actions, and Form Patterns #

What Changed #

User Profile: “Me” vs “Other Employee” #

Maintenance Log Frontend - Tenth Week: Frontend Auth, Routing, and API Client Structure

Devlog Week 10: Frontend Auth, Routing, and API Client Structure #

What Changed #

Routing: Nested Layout + Guards #

Devlog Week 15: Frontend Final Wrap-Up (From Kickoff to Deployed App)
#

Devlog Week 14: Manager/Admin Flows, Create Pages, and Session Expiry Handling
#

Devlog Week 12: User Profiles, Employee Admin Actions, and Form Patterns
#

What Changed
#

User Profile: “Me” vs “Other Employee”
#

Devlog Week 10: Frontend Auth, Routing, and API Client Structure
#

What Changed
#

Routing: Nested Layout + Guards
#