How to do navigation with React Router?

React Router is designed to work in a browser environment, but it can also be used in other environments such as React Native.

To install `React Router`, use npm or yarn. You need to install the main `react-router-dom` package and `react-router-native` if you are working on a mobile application:

```
npm install react-router-dom
```

```
yarn add react-router-dom
```

Here’s a simple example of how to create navigation with React Router in a web environment.

First, you need to import the necessary components from `react-router-dom`:

```
import { BrowserRouter as Router, Switch, Route, Link
} from “react-router-dom”;
```

Next, you wrap your app in the `Router` component in your root component:

```
export default function App() { return (

{/* THIS PART IS FOR ROUTING */}

); } ``` Define the `Home`, `About`, and `Users` components, which will render when you navigate to a certain `Route`:

```
function Home() { return

Home

;
}

function About() { return

About

;
}

function Users() { return

Users

;
}
```
In the code above, navigation links are created using the `Link` component from the React Router package, and different components are rendered based on the current location’s pathname using `Switch` and `Route` components.

- The `Link` component is used to create links in your application. It renders an `a` tag in the DOM and takes a `to` prop, which tells the app which path to navigate to.

- The `Switch` component is used to wrap `Route` components. Its job is to render only the first `Route` or `Redirect` that matches the current location.

- The `Route` component is perhaps the most important component in React Router to understand. It renders some UI if the current location matches the route’s `path`.

For more complex navigation, you might want to build nested routes, redirect from one route to another, programmatically navigate, etc. Refer to the React Router documentation for these advanced topics.