How to organise components for a single page scrolling website in React?

I'm trying to create a single page scrolling portfolio page where all the content is on one page and there's a navbar at the top which can direct you to different sections of the page.

Basically, I'm trying to make this exact same site, but in react: http://codepen.io/drhectapus/pen/bBpYoZ

The problem is, I'm not exactly sure how to organise my components for this single page layout.

This is how I've organised it so far in my index.js file:

ReactDOM.render(
  <Provider store={createStoreWithMiddleware(reducers)}>
    <BrowserRouter>
      <div className='app-container'>
        <Nav />
        <Switch>
          <Route path='/contact' component={Contact} />
          <Route path='/work' component={Work} />
          <Route path='/about' component={About} />
          <Route path='/' component={Home} />
        </Switch>
      </div>
    </BrowserRouter>
  </Provider>,
  document.querySelector('#app')
);

Any help greatly appreciated :)