> For the complete documentation index, see [llms.txt](https://docs.uncodie.com/1.0/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.uncodie.com/1.0/documentation/figma-plugin/variables/route-variables.md).

# Route Variables

URL and path related variables stored in RouterContext

## Overview

In web applications, there is a very common practice to send parameters as URL variables and keywords to render or get different app behaviors or tracking for your applications.

This is an easy way to handle different use cases without adding extra complexity to your app or DB structure.

## Quickstart

To use Route Variables you have to declare a **Screen** or **Wrapper Route** component in your app and declare some dynamic route variables in the URL of your component example:

#### URL

```
/MyScreenPath/:dynamic_property
```

For more information using screens see:

{% embed url="<https://docs.uncodie.com/1.0/basic-concepts/components/screens>" %}

## Setup

1. Add a Screen Component to your application
2. Add a dynamic property in the URL parameter using the next syntax:

```
":" + "name of your variable as it will be found in the RouteContext"
```

3. Your new variable will be available for your component children to use and pass to other scripts or actions

## Use Cases

### Rendering a specific entry in your Data Base

Select and share the ID of a database entry in your app and pass it as a dynamic parameter for your route to build dynamic queries in your app.

### Build Dynamic Queries

Pass a contextual parameter to your GraphQL queries to render your objects contextually

### Select And Navigate

Select the ID of an object and pass it as a parameter to the next screen to render contextual data or details of the selected object.

## Limitations

### Parameters Amount

For the moment you can use only 1 dynamic parameter by route, so if you have the route

```
/project/:ID_Project
```

You can´t nest more dynamic parameters for the moment, for example:

```
/project/:ID_Project/:status/:settings
```

#### Solution

Use a new path for your new dynamic parameter or use local or global variables instead.