text: import React from "react";
  import ReactDOM from 'react-dom';
  import Nav from "react-bootstrap/Nav";
  import Navbar from "react-bootstrap/Navbar";
  import Container from "react-bootstrap/Container";
  import Row from "react-bootstrap/Row";
  import Col from "react-bootstrap/Col";
  import "bootstrap/dist/css/bootstrap.css";
  
  import { BrowserRouter as Router, Switch, Route, Link } from "react-router-dom";
  import EditExpense from "./components/edit-expense.component";
  import ExpensesList from "./components/expenses-listing.component";
  import CreateExpense from "./components/create-expense.component";
  
  function App() {
    return (<Router>
  
      <div className="App">
  
        <Container>
          <Row>
            <Col md={12}>
              <div className="wrapper">
                <Switch>
                  <Route exact path='/' component={CreateExpense} />
                  <Route path="/create-expense" component={CreateExpense} />
                  <Route path="/edit-expense/:id" component={EditExpense} />
                  <Route path="/expenses-listing" component={ExpensesList} />
                </Switch>
              </div>
            </Col>
          </Row>
        </Container>
      </div>
    </Router>);
  }
  
  export default App;
  
  if (document.getElementById('app')) {
      ReactDOM.render(<App />, document.getElementById('app'));
  }
  