App.js

import { Layout } from 'antd';
import { BrowserRouter as Router, Switch, Route } from "react-router-dom";
import './App.css';

import Nav from './components/nav'
import Home from './components/home'
import Account from './components/account'; 
import Dogs from './components/dogs';
import Login from './components/login';
import Register from './components/register';

const { Header, Content, Footer } = Layout;

function App() {
  return (

    <Layout>
  
      <Router>
        <Header>
          <Nav />
        </Header>
        
        <Content style={{ padding: '0 50px' }}>
          <Switch>
            <Route path="/account" children={<Account />}/>
            <Route path="/login" children={<Login />}/>
            <Route path="/register" children={<Register />}/>
            <Route path="/dog/:id" children={<Dogs />}/>
            <Route path="/" children={<Home />}/>
          </Switch>
        </Content>
  
        <Footer>test</Footer>
      </Router>

    </Layout>
    
  );
}

export default App;