Is it a bad practice to use Navbar on all the available routes in React?

Question

I always use Navigation bar on all of my screens. Is it a bad practice to use Navigation bar on all the available screens ?

Answer 1

It's always recommended for Reusability to have repeated code in a separate component, and then reuse that component, so that you don't duplicate code. If you want to change something in that component you only have to change it in one part, not everywhere.

If you want that all your routes include this component, add it before the router, so it is always included. For example like this:

render(){
  <div>
    <h1>test</h1>
    <Switch>
      <Route exact path="/"  component={Home} />
      <Route path="/messages" component={Messages} />
      <Route path="/about" component={About} />
    </Switch>
  </div>
}

So test will always render no matter what route you choose.

If what you want is to create a layout, for example for private routes where you only show the navbar for logged in users (which is the most common scenario), have a look at this answer in SO.