`path` ↔ URL path to `<Route\>`

[`tsx":_id" "/settings/:_id"`

to set **`:id`** [<span data-tooltip-id="preview__q8weT2R5ufxFgAL8i">URL Parameter</span>](url-parameter) [<span data-tooltip-id="preview__KZJ29dW5Q88xpMhde">`path`</span>](path) as [<span data-tooltip-id="preview__RaaW37JDFQLpddE7q">Dynamic Route</span>](dynamic-route)

## `"/whatever/*"`

append **`/*`** to mark [<span data-tooltip-id="preview__8NiQnKYhBP6FSNPhy">Nest Route</span>](nest-route) witihin [<span data-tooltip-id="preview__DRjmay4XGEujnmH7o">`element`</span>](element_route) [<span data-tooltip-id="preview__qq2QdodovhM58Jgpz">Child Component</span>](child-component)

## `"/*"`

to set [<span data-tooltip-id="preview__SPbNCzsaaHzk9K4c3">Catch All Route</span>](catch-all-route) to redirect to 404 handler [<span data-tooltip-id="preview__DRjmay4XGEujnmH7o">`element`</span>](element_route)



## References

1. [`<Route>`](route_routes) ↔ [<span data-tooltip-id="preview__rt3eRFTEnZH8WDNn3">React Router FC</span>](react-router-fc) to map route for [<span data-tooltip-id="preview__DRjmay4XGEujnmH7o">`element`</span>](element_route) [<span data-tooltip-id="preview__9Le7zdA2R4LzoE852">FC</span>](fc) to [<span data-tooltip-id="preview__KZJ29dW5Q88xpMhde">`path`</span>](path) 

2. [

```tsx
`":_id"
"/settings/:_id"`
```](id-settings-id) ↔ to set **`:id`** [<span data-tooltip-id="preview__q8weT2R5ufxFgAL8i">URL Parameter</span>](url-parameter) [<span data-tooltip-id="preview__KZJ29dW5Q88xpMhde">`path`</span>](path) as [<span data-tooltip-id="preview__RaaW37JDFQLpddE7q">Dynamic Route</span>](dynamic-route) 

3. [`useParams()`](useparams) ↔ 

```tsx
[<span data-tooltip-id="preview__Cnktk6mYSBeWLB3L3">React Router Hook</span>](react-router-hook) to return **{ **[<span data-tooltip-id="preview__q8weT2R5ufxFgAL8i">URL Parameter</span>](url-parameter)** }** set via [<span data-tooltip-id="preview__8SFKoXqHBqf5cDcvB">`":_id"
"/settings/:_id"`</span>](id-settings-id) in [<span data-tooltip-id="preview__KZJ29dW5Q88xpMhde">`path`</span>](path) 
```

4. [`Recursive Route`](recursive-route) ↔ use [<span data-tooltip-id="preview__8NiQnKYhBP6FSNPhy">Nested Routes</span>](nest-route) with **`/*`** [<span data-tooltip-id="preview__KZJ29dW5Q88xpMhde">`path`</span>](path) to set up nested link within [<span data-tooltip-id="preview__MDHagBbg6pbELzHEZ">`<Route\>`</span>](route_routes) & allow it to return new [<span data-tooltip-id="preview__MDHagBbg6pbELzHEZ">`<Route\>`</span>](route_routes) for [<span data-tooltip-id="preview__dNnKrcgh3H2Tgypao">Recursion</span>](recursion) 




export const PreviewHFvYCsy2ghARywjwZ = React.lazy(() => import("@site/static/preview/PreviewHFvYCsy2ghARywjwZ"))

<React.Suspense fallback={null}><PreviewHFvYCsy2ghARywjwZ/></React.Suspense>


export const PreviewMDHagBbg6pbELzHEZ = React.lazy(() => import("@site/static/preview/PreviewMDHagBbg6pbELzHEZ"))

<React.Suspense fallback={null}><PreviewMDHagBbg6pbELzHEZ/></React.Suspense>


export const Previewq8weT2R5ufxFgAL8i = React.lazy(() => import("@site/static/preview/Previewq8weT2R5ufxFgAL8i"))

<React.Suspense fallback={null}><Previewq8weT2R5ufxFgAL8i/></React.Suspense>


export const PreviewKZJ29dW5Q88xpMhde = React.lazy(() => import("@site/static/preview/PreviewKZJ29dW5Q88xpMhde"))

<React.Suspense fallback={null}><PreviewKZJ29dW5Q88xpMhde/></React.Suspense>


export const PreviewRaaW37JDFQLpddE7q = React.lazy(() => import("@site/static/preview/PreviewRaaW37JDFQLpddE7q"))

<React.Suspense fallback={null}><PreviewRaaW37JDFQLpddE7q/></React.Suspense>


export const Preview8NiQnKYhBP6FSNPhy = React.lazy(() => import("@site/static/preview/Preview8NiQnKYhBP6FSNPhy"))

<React.Suspense fallback={null}><Preview8NiQnKYhBP6FSNPhy/></React.Suspense>


export const PreviewDRjmay4XGEujnmH7o = React.lazy(() => import("@site/static/preview/PreviewDRjmay4XGEujnmH7o"))

<React.Suspense fallback={null}><PreviewDRjmay4XGEujnmH7o/></React.Suspense>


export const Previewqq2QdodovhM58Jgpz = React.lazy(() => import("@site/static/preview/Previewqq2QdodovhM58Jgpz"))

<React.Suspense fallback={null}><Previewqq2QdodovhM58Jgpz/></React.Suspense>


export const PreviewSPbNCzsaaHzk9K4c3 = React.lazy(() => import("@site/static/preview/PreviewSPbNCzsaaHzk9K4c3"))

<React.Suspense fallback={null}><PreviewSPbNCzsaaHzk9K4c3/></React.Suspense>


export const Previewrt3eRFTEnZH8WDNn3 = React.lazy(() => import("@site/static/preview/Previewrt3eRFTEnZH8WDNn3"))

<React.Suspense fallback={null}><Previewrt3eRFTEnZH8WDNn3/></React.Suspense>


export const Preview9Le7zdA2R4LzoE852 = React.lazy(() => import("@site/static/preview/Preview9Le7zdA2R4LzoE852"))

<React.Suspense fallback={null}><Preview9Le7zdA2R4LzoE852/></React.Suspense>


export const PreviewCnktk6mYSBeWLB3L3 = React.lazy(() => import("@site/static/preview/PreviewCnktk6mYSBeWLB3L3"))

<React.Suspense fallback={null}><PreviewCnktk6mYSBeWLB3L3/></React.Suspense>


export const Preview8SFKoXqHBqf5cDcvB = React.lazy(() => import("@site/static/preview/Preview8SFKoXqHBqf5cDcvB"))

<React.Suspense fallback={null}><Preview8SFKoXqHBqf5cDcvB/></React.Suspense>


export const PreviewdNnKrcgh3H2Tgypao = React.lazy(() => import("@site/static/preview/PreviewdNnKrcgh3H2Tgypao"))

<React.Suspense fallback={null}><PreviewdNnKrcgh3H2Tgypao/></React.Suspense>
path ↔ URL path to <Route\>

`path` ↔ URL path to `<Route\>`
