Outcome
Adding or renaming a service becomes a one-line config edit that propagates to routes, nav, and sitemap with zero orphaned or 404 pages.
Medium Websites system
Service Hub Route Architecture
A typed, single-source-of-truth route map that generates every service hub and its child pages (proof, case-studies, systems, packages) from one config array, so the App Router tree, navigation, breadcrumbs, and sitemap all stay in sync from the same data instead of drifting apart.
HMX Zone
TypeScript
Verified HMX-owned system
System facts
Service Hub Route Architecture uses a web app route, data, and conversion layer for Full-Stack Websites. A typed, single-source-of-truth route map that generates every service hub and its child pages (proof, case-studies, systems, packages) from one co... The architecture connects the hub + child schema in, next, typescript, and live site with an explicit control path.
Main risk
Config and the real route tree drift, leaving dead links or pages with no nav entry.
Prevention
A CI test enumerates config slugs against the generated params and fails the build on any mismatch.
Fallback
Unknown hub slugs hit notFound() and a 410/301 table catches retired URLs instead of soft-404ing.
System architecture
Service Hub Route Architecture Architecture
6 nodes
the hub + child schema in
Generate App Router segments
Next
TypeScript
Fallback Path
Live Site
- 01the hub + child schema in
A typed, single-source-of-truth route map that generates every service hub and its child pages (proof, case-studies, systems, packages) from one co...
- 02Generate App Router segments
Generate App Router segments with a dynamic [hub] route and generateStaticParams from the config
- 03Next
Next.js 16 App Router supports the route, form, or data boundary for Service Hub Route Architecture so public UX and backend state stay connected.
- 04TypeScript
Derive nav, breadcrumbs, and internal links from the same config so labels and paths never diverge
- 05Fallback Path
Unknown hub slugs hit notFound() and a 410/301 table catches retired URLs instead of soft-404ing.
- 06Live Site
Adding or renaming a service becomes a one-line config edit that propagates to routes, nav, and sitemap with zero orphaned or 404 pages.
3-6 days
How it is built
A typed, single-source-of-truth route map that generates every service hub and its child pages (proof, case-studies, systems, packages) from one config array, so the App Router tree, navigation, breadcrumbs, and sitemap all stay in sync from the same data instead of drifting apart.
- 01Define the hub + child schema in one lib config (slug, name, accent, child kinds) as the single source of truth
- 02Generate App Router segments with a dynamic [hub] route and generateStaticParams from the config
- 03Derive nav, breadcrumbs, and internal links from the same config so labels and paths never diverge
- 04Add a build-time test that asserts every config slug resolves to a real route and every route maps back to a slug
Tools
Workflow surface
- Next.js 16 App Router
- TypeScript
- generateStaticParams
- Vitest
- Experience layer: Define the hub + child schema in one lib config (slug, name, accent, child kinds) as the single source of truth
- Server layer: Generate App Router segments with a dynamic [hub] route and generateStaticParams from the config
- Database layer: Next.js 16 App Router supports the route, form, or data boundary for Service Hub Route Architecture so public UX and backend state stay connected.
- Automation layer: TypeScript handles routine steps while a CI test enumerates config slugs against the generated params and fails the build on any mismatch.
- Measurement layer: Adding or renaming a service becomes a one-line config edit that propagates to routes, nav, and sitemap with zero orphaned or 404 pages.
Data flow
- 01Define the hub + child schema in one lib config (slug, name, accent, child kinds) as the single source of truth
- 02Generate App Router segments with a dynamic [hub] route and generateStaticParams from the config
- 03Derive nav, breadcrumbs, and internal links from the same config so labels and paths never diverge
- 04Add a build-time test that asserts every config slug resolves to a real route and every route maps back to a slug
Controls and fallbacks
- Config and the real route tree drift, leaving dead links or pages with no nav entry.
- A CI test enumerates config slugs against the generated params and fails the build on any mismatch.
- Unknown hub slugs hit notFound() and a 410/301 table catches retired URLs instead of soft-404ing.
System path inside the website build
Full-stack websites for service businesses and operators: route architecture, service pages, lead capture, metadata, proof boundaries, blog/database paths, analytics, and deployment checks.
Route map
Service architecture
Clear service routes
01active
Progress72%
Lead capture
Form and context flow
Lead capture that saves context
02active
Progress86%
Public metadata
SEO and schema layer
SEO and schema on public pages
03active
Progress64%
Launch QA
Analytics and deployment checks
Analytics events tied to CTAs
04active
Progress91%