Route hierarchy
Routes are organized into a hierarchical tree structure that enables developers to define layouts, manage views, and dynamically render components across various parts of the app.
The key concepts you’ll encounter when building a webforJ routable app include:
- Route Hierarchy: Organizes routes into parent-child structures for modular UI development.
- Route Types: Routes are categorized as either View Routes or Layout Routes, each serving a different purpose.
- Nested Routes: Routes can be nested within each other, allowing parent components to render child components in designated outlets.
- Outlets: Components where child views are dynamically injected into parent layouts.
- Layouts: Special routes that wrap child components without contributing to the URL, providing shared UI elements such as headers, footers, or sidebars.
Topics
📄️ Route Types
Routes are classified into two main types, View Routes and Layout Routes. The choice of route type determines how components are mapped to URLs and how they interact with other parts of your app.
📄️ Nested Routes
Nested routes allow child routes to be rendered within parent routes, creating a modular and reusable UI. Parent routes define shared components, while child routes are injected into specific outlets within these parent components.
📄️ Route Outlets
An outlet is a designated component, either a route layout or a route view, where child routes are dynamically rendered. It defines where the content of the child route will appear within the parent route. Outlets are fundamental to creating modular, nested UIs and flexible navigation structures.