cleanup and refinement

Author: karthik-d

l02-react-routing/src/App.js

@@ -1,62 +1,3 @@
-
-//Example for React Routing Incorporation
-
-/*import React, { Component } from 'react';
-import { Route, Link } from 'react-router-dom';
-import './App.css';
-
-
-const Home = () => (
-  <div>
-    <h2> Home </h2>
-  </div>
-);
-
-const Airport = () => (
-  <div>
-     <ul>
-      <li>Jomo Kenyatta</li>
-      <li>Tambo</li>
-      <li>Murtala Mohammed</li>
-    </ul>
-  </div>
-);
-
-const City = () => (
-  <div>
-    <ul>
-      <li>San Francisco</li>
-      <li>Istanbul</li>
-      <li>Tokyo</li>
-    </ul>
-  </div>
-);
-
-class App extends Component {
-  render() {
-    return (
-      <div>
-        <ul>
-          <li><Link to="/">Home</Link></li>
-          <li><Link to="/airports">Airports</Link></li>
-          <li><Link to="/cities">Cities</Link></li>
-        </ul>
-
-        <Route path="/" exact component={Home}/>
-        <Route path="/airports" component={Airport}/> 
-        <Route path="/airports"
-       render={() => (<div> This is the airport route </div>)}/>
-    <Route path="/cities" component={City}/>
-      </div>
-    );
-  }
-}
-
-export default App;
-
-*/
-
-
 //Example for React Nested Routing
 
 import React, { Component } from 'react';
@@ -131,102 +72,3 @@ class App extends Component {
 }
 
 export default App;
-
-
-
-
-
-//React Nested Routing with Parameters
-
-// import React, { Component } from "react";
-// import {
-//   BrowserRouter as Router,
-//   Routes,
-//   Route,
-//   Link,
-//   useMatch,
-//   useParams
-// } from "react-router-dom";
-
-// class App extends Component {
-//   render() {
-//     return (
-//       <Router>
-//         <div>
-//           <p>
-//             Home Page: Karthik D
-//           </p>
-//           <ul>
-//             <li>
-//               <Link to="/">Home</Link>
-//             </li>
-//           </ul>
-//         </div>
-//       </Router>
-//     );
-//   }
-// }
-// export default App;
-
-// function Home() {
-//   return (<div><h2>Home</h2>
-//     <ul>
-//       <li>
-//         <Link to="/Courses">Courses</Link>
-//       </li>
-//       <li>
-//         <Link to="/Colleges">Colleges</Link>
-//       </li>
-//     </ul></div>);
-// }
-
-// function Courses() {
-//   let match = useMatch();
-//   console.log(match);
-//   return (<div><h2>Courses</h2>
-//     <ul>
-//       <li>
-//         <Link to="/Courses/Technology">Technology</Link>
-//       </li>
-//       <li>
-//         <Link to="/Courses/Business">Business</Link>
-//       </li>
-//     </ul>
-//     <Routes>
-//       <Route path={`${match.path}/Technology`}
-//         render={() => (<div> This course is on Technology </div>)}>
-//       </Route>
-//       <Route path={`${match.path}/Business`}
-//         render={() => (<div> This course is on Business </div>)}>
-//       </Route>
-
-//     </Routes>
-//   </div>);
-// }
-// function Colleges() {
-//   let match = useMatch();
-//   console.log(match);
-//   return (<div><h2>Colleges</h2>
-//     <ul>
-//       <li>
-//         <Link to="/Colleges/IIM">IIM</Link>
-//       </li>
-//       <li>
-//         <Link to="/Colleges/SSN">SSN</Link>
-//       </li>
-//     </ul>
-//     <Routes>
-//       <Route path={`${match.path}/IIM`}
-//         render={() => (<div> This college is special in Business studies</div>)}>
-//       </Route>
-//       <Route path={`${match.path}/SSN`}
-//         render={() => (<div> This college is special in Technology studies</div>)}>
-//       </Route>
-
-
-//     </Routes>
-//   </div>);
-// }
-
-
-