commit 1

src/App.js

@@ -1,28 +1,32 @@
-import React, { Component } from 'react';
-import logo from './logo.svg';
+import React from 'react';
+import { Route, Switch, Link } from 'react-router-dom'; // eslint-disable-line no-unused-vars
+import 'bootstrap/dist/css/bootstrap.css'; // eslint-disable-line no-unused-vars
+import { Row, Col } from 'react-bootstrap'; // eslint-disable-line no-unused-vars
+import VideoList from './VideoList'; // eslint-disable-line no-unused-vars
+import TopBar from './TopBar'; // eslint-disable-line no-unused-vars
+import VideoPlayer from './VideoPlayer'; // eslint-disable-line no-unused-vars
 import './App.css';
 
-class App extends Component {
-  render() {
-    return (
-      <div className="App">
-        <header className="App-header">
-          <img src={logo} className="App-logo" alt="logo" />
-          <p>
-            Edit <code>src/App.js</code> and save to reload.
-          </p>
-          <a
-            className="App-link"
-            href="https://reactjs.org"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            Learn React
-          </a>
-        </header>
-      </div>
-    );
-  }
+class App extends React.Component {
+	render() {
+		return (
+			<React.Fragment>
+				<TopBar />
+				<Row className="justify-content-center bg-black">
+					<Col xs="12" sm="6">
+						<Switch>
+							<Route path="/video/:id" component={VideoPlayer} />
+							<Route component={VideoPlayer} />
+							{/* <Route path='/search/:q/:token?' component={Search} />  */}
+						</Switch>
+					</Col>
+				</Row>
+				<Row>
+					<VideoList />
+				</Row>
+			</React.Fragment>
+		);
+	}
 }
 
 export default App;