Instruction:

If you have a such routes:

<BrowserRouter>
    <div>
        <Route path="/" component={PostsIndex}/>
        <Route path="/posts/new" component={PostsNew}/>
    </div>
</BrowserRouter>

You'll have this routes combined together in one screen, beacuse path /posts/new includes / path. So, to solve this problem, you should include Switch component to your file:

import {BrowserRouter, Route, Switch} from 'react-router-dom';

And finally you should just add your routes into the Switch element:

<Switch>
    <Route path="/" component={PostsIndex}/>
    <Route path="/posts/new" component={PostsNew}/>
</Switch>

And then, you should place most specific URL on the top:

<Switch>
    <Route path="/posts/new" component={PostsNew}/>
    <Route path="/" component={PostsIndex}/>
</Switch>