creazione routing notfound e About

src/About.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import Navbar from './Navbar';
+
+class About extends React.Component {
+    render() {
+        return (
+            <>
+                <Navbar brand="LORDNABBO" />
+            </>
+        );
+    }
+}
+
+export default About;

src/App.js

@@ -2,7 +2,9 @@ import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
 import React, { Suspense, lazy } from 'react';
 
 const Home = lazy(() => import('./Home'));
-//const About = lazy(() => import('./About'));
+const About = lazy(() => import('./About'));
+const Notfound = lazy(() => import('./notfound'));
+
 
 class App extends React.Component {
     render() {
@@ -11,6 +13,9 @@ class App extends React.Component {
                 <Suspense fallback={<div>Loading...</div>}>
                     <Switch>
                         <Route exact path="/" component={Home}/>
+                        <Route path="/About" component={About}/>
+
+                        <Route component={Notfound} />
                     </Switch>
                 </Suspense>
             </Router>

src/Buttons.js

@@ -1,4 +1,5 @@
 import React from 'react'
+import {Link} from 'react-router-dom'
 import 'bootstrap/dist/css/bootstrap.min.css';
 import 'bootstrap/dist/js/bootstrap.min.js';
 import './Buttons.css';
@@ -16,7 +17,7 @@ export default class NavButton extends React.Component {
 export class Button extends React.Component {
     render() {
         return (
-        <button className="btn1">{this.props.name}</button>
+        <button className="btn1" type="button"><Link to="/About">{this.props.name}</Link></button>
         );
     }
 }

src/Navbar.js

@@ -14,11 +14,15 @@ class Navbar extends React.Component {
             </button>
             <div className="collapse navbar-collapse flex" id="navButtons">
                 <ul className="navbar-nav nav-mod">
-                    <NavButton name="Home" />
+                    <NavButton name="Home" lhref="/" />
                     <NavButton name="Film" />
                     <NavButton name="Series" />
-                    <NavButton name="About" />
+                    <NavButton name="About" lhref="/About" />
                 </ul>
+                <form class="form-inline my-2 my-lg-0">
+                    <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search" />
+                    <button class="btn1" type="submit">Search</button>
+                </form>
             </div>
         </nav>
         );

src/notfound.js

@@ -0,0 +1,15 @@
+import React from 'react';
+import Navbar from './Navbar';
+
+class NotFound extends React.Component {
+    render() {
+        return (
+            <>
+                <Navbar brand="LORDNABBO" />
+                <div><h1>I MEME 404</h1></div>
+            </>
+        );
+    }
+}
+
+export default NotFound;