/Javascript/React/Add Navbar to React Redux CRUD App

Add Navbar to React Redux CRUD App

import React, { Component } from "react";
import { BrowserRouter as Router, Switch, Route, Link } from "react-router-dom";
import "bootstrap/dist/css/bootstrap.min.css";
import "./App.css";

import AddTutorial from "./components/add-tutorial.component";
import Tutorial from "./components/tutorial.component";
import TutorialsList from "./components/tutorials-list.component";

class App extends Component {
  render() {
    return (
      <Router>
        <nav className="navbar navbar-expand navbar-dark bg-dark">
          <Link to={"/tutorials"} className="navbar-brand">
            bezKoder
          </Link>
          <div className="navbar-nav mr-auto">
            <li className="nav-item">
              <Link to={"/tutorials"} className="nav-link">
                Tutorials
              </Link>
            </li>
            <li className="nav-item">
              <Link to={"/add"} className="nav-link">
                Add
              </Link>
            </li>
          </div>
        </nav>

        <div className="container mt-3">
          <Switch>
            <Route exact path={["/", "/tutorials"]} component={TutorialsList} />
            <Route exact path="/add" component={AddTutorial} />
            <Route path="/tutorials/:id" component={Tutorial} />
          </Switch>
        </div>
      </Router>
    );
  }
}

export default App;

Source: bezkoder.com

Similar codes

144 votes399 views6 answers
How to install react js
Javascript React
0 vote149 views1 answer
Circle button react native
Javascript React
0 vote164 views3 answers
How to serve React JS static files with express JS?
Javascript React
0 vote156 views1 answer
React native stylesheet shortcut
Javascript React
-1 vote151 views1 answer
React-native run-ios command
Javascript React
3 votes183 views1 answer
How to test on user reaction discord.js
Javascript React
108 votes203 views1 answer
How to start react app in windows
Javascript React
64 votes196 views7 answers
React router
Javascript React
0 vote159 views1 answer
Make image circle css react
Javascript React
0 vote170 views2 answers
Remove the warning for setState on unmounted components in React
Javascript React