> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: Introduction

## Article: Introduction

## Article Link: https://dev.wix.com/docs/sdk/site-sdk/pages-and-navigation/router/introduction.md

## Article Content:

# About the Router API

The Router API lets you send site visitors to another page of the site, or to an external link, from your code. Use it when something a site visitor does, such as choosing a service or finishing a form, should take them somewhere new.

With the Router API, you can:

- Navigate to a page on the site.
- Open an external URL in the current tab or a new tab.
- Keep the current scroll position when you update the current page's query parameters.
- Check whether the method navigated or called `window.open()`.

The Router API navigates to a path you already have. To find the path of a page that an app adds to the site, use `appSectionRelativeUrl()` in `@wix/site-service-url`. To open a popup, use `@wix/site-service-lightbox`.

To link to a page, render a link with a URL from `@wix/site-service-url` instead. Use `navigateTo()` when your code decides where to go, such as after a form submits.

## Use cases

- [Go to an app page after a form submits](https://dev.wix.com/docs/sdk/site-sdk/pages-and-navigation/router/sample-flows.md)

## Terminology

- **Site root URL**: The site's public base URL. On a free Wix domain it includes a path prefix, such as `https://example.wixsite.com/mysite`.
- **Router page**: A page whose path combines a fixed prefix with a per-item suffix, such as `/News/spring-sale`. Here the prefix is `/News` and the suffix varies per item.
- **Popup**: A page that opens over the page a visitor is already on, rather than replacing it.

## SDK setup

@package_metadata:@wix/site-service-router

To use the API, install the `@wix/site-service-router` package:

```bash
npm install @wix/site-service-router
```

#### Import the package

```ts
import { RouterDefinition } from '@wix/site-service-router/definition'
```

#### Import types

Import any type shown in these docs from `@wix/site-service-router/types`:

```ts
import type { <TypeName> } from '@wix/site-service-router/types'
```

#### Resolve the service

In a React component, resolve the service with the `useService` hook:

```tsx
import { useService } from '@wix/services-manager-react'
import { RouterDefinition } from '@wix/site-service-router/definition'
import { UrlDefinition } from '@wix/site-service-url/definition'

function BrowseShopButton() {
    const routerService = useService(RouterDefinition)
    const urlService = useService(UrlDefinition)

    return (
        <button onClick={() => routerService.navigateTo({ href: `${urlService.siteUrl}/shop` })}>
            Browse the shop
        </button>
    )
}
```