```
import './App.css';
import AppRoutes from './AppRoutes'
import {BrowserRouter as Router} from "react-router-dom"
import AppHeader from './modules/platform-components/app-header/AppHeader'

function App() {
  return (
    <div className="App">
      <AppRoutes />
    </div>
  );
}

export default App;```

// Above is my App.js

```import React,{Component} from "react"
import {Route,Switch} from "react-router-dom"
import Login from "./modules/authentication/login/Login"
import BaseApp from "./modules/platform-components/base-app/BaseApp"
export default function AppRoutes (){

        return (
            <Switch>
                <Route path="/" exact component={Login}/>
                <Route path="/login" component={Login}/>       
                <Route exact path="/app" component={BaseApp}/>
            </Switch>           

        )

}```

//above is AppRoutes.js

```

import React,{Component} from "react"
import Routes from './Routes'
import AppHeader from '../app-header/AppHeader'
import {Route,Switch,Link ,withRouter,useRouteMatch} from "react-router-dom"
 function BaseApp(){
 let match= useRouteMatch()
 return (

 Base App Component
 App Header

 )
}
export default BaseApp;```

//this is my baseApp

```
 function Appheader(){
        return (
            <div>App Header Component</div>
        )    
}
export default Appheader;```

//above is my app header 
`when i am entering url /app it isnavigating to baseApp component but when i enter /app/appheader it's not rendering anything but url is changed `

```