basic routing example react

1import React from "react";
2import {
3  BrowserRouter as Router,
4  Switch,
5  Route,
6  Link
7} from "react-router-dom";
8
9export default function App() {
10  return (
11    <Router>
12      <div>
13        <nav>
14          <ul>
15            <li>
16              <Link to="/">Home</Link>
17            </li>
18            <li>
19              <Link to="/about">About</Link>
20            </li>
21            <li>
22              <Link to="/users">Users</Link>
23            </li>
24          </ul>
25        </nav>
26
27        {/* A <Switch> looks through its children <Route>s and
28            renders the first one that matches the current URL. */}
29        <Switch>
30          <Route path="/about">
31            <About />
32          </Route>
33          <Route path="/users">
34            <Users />
35          </Route>
36          <Route path="/">
37            <Home />
38          </Route>
39        </Switch>
40      </div>
41    </Router>
42  );
43}
44
45function Home() {
46  return <h2>Home</h2>;
47}
48
49function About() {
50  return <h2>About</h2>;
51}
52
53function Users() {
54  return <h2>Users</h2>;
55}
56