Routing is configure in App.tsx file. This is the render method of the App.tsx file.
```
<BrowserRouter>
<Menu />
<div className='container'>
<Switch>
<Route exact path='/'>
<h3>In theaters</h3>
<MovieList movies={movies.movies} />
<h3>Upcoming Release</h3>
<MovieList movies={movies.upcoming} />
</Route>
<Route path='/genres'>
<IndexGenre />
</Route>
</Switch>
</div>
</BrowserRouter>
```
export default function Menu() {
return (
<nav className='navbar navbar-expand-md navbar-light bg-light'>
<div className='container-fluid'>
<Link to='/' className='navbar-brand'>
React movies
</Link>
<div className='collapse navbar-collapse'>
<ul className='navbar-nav me-auto mb-2 mb-lg-0'>
<li className='nav-item'>
<Link to='/genres' className='nav-link active'>
genres
</Link>
</li>
</ul>
</div>
</div>
</nav>
);
}
```
Clicking on the genre link, changes the url, but does not display the IndexGenre component. It still displays the same home page info But, if I directly go to the genre page by typing in the browser /genres, It shows the genre page. The github linked https://github.com/crmaccr/React_Movie.git.