title: Reactstrap Bootstrap Navbar not working in react app
body: <p>I created a react app with 'create react-app'.</p>
  
  <p>I am trying now to add a navbar from Reactstrap. I do copy-paste from  Reactstrap (I am adding this as one react component) <a href="https://reactstrap.github.io/components/navbar/" rel="noreferrer">website</a>:</p>
  
  <pre><code>import React from 'react';
  import {
    Collapse,
    Navbar,
    NavbarToggler,
    NavbarBrand,
    Nav,
    NavItem,
    NavLink,
    UncontrolledDropdown,
    DropdownToggle,
    DropdownMenu,
    DropdownItem } from 'reactstrap';
  
  export default class Example extends React.Component {
    constructor(props) {
      super(props);
  
      this.toggle = this.toggle.bind(this);
      this.state = {
        isOpen: false
      };
    }
    toggle() {
      this.setState({
        isOpen: !this.state.isOpen
      });
    }
    render() {
      return (
        &lt;div&gt;
          &lt;Navbar color="light" light expand="md"&gt;
            &lt;NavbarBrand href="/"&gt;reactstrap&lt;/NavbarBrand&gt;
            &lt;NavbarToggler onClick={this.toggle} /&gt;
            &lt;Collapse isOpen={this.state.isOpen} navbar&gt;
              &lt;Nav className="ml-auto" navbar&gt;
                &lt;NavItem&gt;
                  &lt;NavLink href="/components/"&gt;Components&lt;/NavLink&gt;
                &lt;/NavItem&gt;
                &lt;NavItem&gt;
                  &lt;NavLink href="https://github.com/reactstrap/reactstrap"&gt;GitHub&lt;/NavLink&gt;
                &lt;/NavItem&gt;
                &lt;UncontrolledDropdown nav inNavbar&gt;
                  &lt;DropdownToggle nav caret&gt;
                    Options
                  &lt;/DropdownToggle&gt;
                  &lt;DropdownMenu right&gt;
                    &lt;DropdownItem&gt;
                      Option 1
                    &lt;/DropdownItem&gt;
                    &lt;DropdownItem&gt;
                      Option 2
                    &lt;/DropdownItem&gt;
                    &lt;DropdownItem divider /&gt;
                    &lt;DropdownItem&gt;
                      Reset
                    &lt;/DropdownItem&gt;
                  &lt;/DropdownMenu&gt;
                &lt;/UncontrolledDropdown&gt;
              &lt;/Nav&gt;
            &lt;/Collapse&gt;
          &lt;/Navbar&gt;
        &lt;/div&gt;
      );
    }
  }
  </code></pre>
  
  <p>and it does not work. I am getting this in my react app:</p>
  
  <p><a href="https://i.stack.imgur.com/aLYso.png" rel="noreferrer"><img src="https://i.stack.imgur.com/aLYso.png" alt="navbar in react app"></a></p>
  
  <p>I had similar problems with Bootstrap, React and Navbar before but I am really surprised it is happening in Reactstrap.
  Do you know why is it so?</p>