diff --git a/package-lock.json b/package-lock.json
index 24bc2e3..c9f06b2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3096,12 +3096,14 @@
             "balanced-match": {
               "version": "1.0.0",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "brace-expansion": {
               "version": "1.1.11",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "balanced-match": "^1.0.0",
                 "concat-map": "0.0.1"
@@ -3116,17 +3118,20 @@
             "code-point-at": {
               "version": "1.1.0",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "concat-map": {
               "version": "0.0.1",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "console-control-strings": {
               "version": "1.1.0",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "core-util-is": {
               "version": "1.0.2",
@@ -3243,7 +3248,8 @@
             "inherits": {
               "version": "2.0.3",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "ini": {
               "version": "1.3.5",
@@ -3255,6 +3261,7 @@
               "version": "1.0.0",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "number-is-nan": "^1.0.0"
               }
@@ -3269,6 +3276,7 @@
               "version": "3.0.4",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "brace-expansion": "^1.1.7"
               }
@@ -3276,12 +3284,14 @@
             "minimist": {
               "version": "0.0.8",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "minipass": {
               "version": "2.3.5",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "safe-buffer": "^5.1.2",
                 "yallist": "^3.0.0"
@@ -3300,6 +3310,7 @@
               "version": "0.5.1",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "minimist": "0.0.8"
               }
@@ -3380,7 +3391,8 @@
             "number-is-nan": {
               "version": "1.0.1",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "object-assign": {
               "version": "4.1.1",
@@ -3392,6 +3404,7 @@
               "version": "1.4.0",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "wrappy": "1"
               }
@@ -3513,6 +3526,7 @@
               "version": "1.0.2",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "code-point-at": "^1.0.0",
                 "is-fullwidth-code-point": "^1.0.0",
@@ -7486,12 +7500,14 @@
             "balanced-match": {
               "version": "1.0.0",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "brace-expansion": {
               "version": "1.1.11",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "balanced-match": "^1.0.0",
                 "concat-map": "0.0.1"
@@ -7506,17 +7522,20 @@
             "code-point-at": {
               "version": "1.1.0",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "concat-map": {
               "version": "0.0.1",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "console-control-strings": {
               "version": "1.1.0",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "core-util-is": {
               "version": "1.0.2",
@@ -7633,7 +7652,8 @@
             "inherits": {
               "version": "2.0.3",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "ini": {
               "version": "1.3.5",
@@ -7645,6 +7665,7 @@
               "version": "1.0.0",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "number-is-nan": "^1.0.0"
               }
@@ -7659,6 +7680,7 @@
               "version": "3.0.4",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "brace-expansion": "^1.1.7"
               }
@@ -7666,12 +7688,14 @@
             "minimist": {
               "version": "0.0.8",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "minipass": {
               "version": "2.3.5",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "safe-buffer": "^5.1.2",
                 "yallist": "^3.0.0"
@@ -7690,6 +7714,7 @@
               "version": "0.5.1",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "minimist": "0.0.8"
               }
@@ -7770,7 +7795,8 @@
             "number-is-nan": {
               "version": "1.0.1",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "object-assign": {
               "version": "4.1.1",
@@ -7782,6 +7808,7 @@
               "version": "1.4.0",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "wrappy": "1"
               }
@@ -7903,6 +7930,7 @@
               "version": "1.0.2",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "code-point-at": "^1.0.0",
                 "is-fullwidth-code-point": "^1.0.0",
diff --git a/src/App.js b/src/App.js
index 15bddc9..694ce01 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,23 +1,39 @@
 import React from "react";
 import TopNav from "./components/TopNav";
 import SideNav from "./components/SideNav";
+import { BrowserRouter as Router, Route, Link } from "react-router-dom";
+import Dashboard from "./components/Dashboard"
+import Profile from "./components/Profile"
+import Marquee from "./components/Marquee"
+import Profiles from "./components/Profiles"
+import Wall from "./components/Wall"
+import Charts from "./components/Charts"
+import Tables from "./components/Tables"
+import Settings from "./components/Settings"
 
 function App() {
   return (
-    <div> 
-      <div id="wrapper">
-        <nav className="navbar navbar-inverse navbar-fixed-top" role="navigation">
-          <TopNav />
-          <SideNav />
-        </nav>
-        <div style={{backgroundColor: "white"}}>
-          {/* PUT YOUR ROUTES HERE */}
+    <Router>
+      <div> 
+        <div id="wrapper">
+          <nav className="navbar navbar-inverse navbar-fixed-top" role="navigation">
+            <TopNav />
+            <SideNav />
+          </nav>
+          <div style={{backgroundColor: "white"}}>
+            <Route path="/tables" exact component={Tables} />
+            <Route path="/charts" exact component={Charts} />
+            <Route path="/settings" exact component={Settings} />
+            <Route path="/wall" exact component={Wall} />
+            <Route path="/profiles" exact component={Profiles} />
+            <Route path="/marquee/:text" exact component={Marquee} />
+            <Route path="/profile/:id" exact component={Profile} />
+            <Route path="/" exact component={Dashboard} />
+          </div>
         </div>
       </div>
-    </div>
-
+    </Router>
   );
 }
 
-
 export default App;
diff --git a/src/components/Charts.js b/src/components/Charts.js
new file mode 100644
index 0000000..af52b50
--- /dev/null
+++ b/src/components/Charts.js
@@ -0,0 +1,7 @@
+import React from "react";
+let Charts = () => {
+    return (
+      <div>These are charts</div>
+    )
+}
+export default Charts
\ No newline at end of file
diff --git a/src/components/Marquee.js b/src/components/Marquee.js
index 820e8c4..21565c7 100644
--- a/src/components/Marquee.js
+++ b/src/components/Marquee.js
@@ -1,7 +1,7 @@
 import React from "react";
 
 function Marquee(props) {
-  const message = "hello";
+  const message = props.match.params.text;
   return (   
     <marquee>{message}</marquee>
   );
diff --git a/src/components/Profile.js b/src/components/Profile.js
index c4eb646..cea9337 100644
--- a/src/components/Profile.js
+++ b/src/components/Profile.js
@@ -1,8 +1,9 @@
 import React from "react";
 import {connect} from "react-redux";
 
+
 function Profile(props) {
-  const userId = 0;
+  const userId = props.match.params.id;
   const user = props.users.find(u => u.id == userId) || {};
   return (   
     <div>
diff --git a/src/components/Profiles.js b/src/components/Profiles.js
index 3409812..1fc9f30 100644
--- a/src/components/Profiles.js
+++ b/src/components/Profiles.js
@@ -1,12 +1,13 @@
 import React from "react";
 import {connect} from "react-redux";
+import { Link } from "react-router-dom"
 
 function Profiles(props) {
   const userDivs = props.users.map((user,i) => {
     return (
       <div key={i}>
         {user.firstName} - {user.lastName}
-        <a href="#"> View </a>
+        <Link to={"/profile/"+user.id}> View </Link>
       </div>);
   });
   return (   
diff --git a/src/components/Settings.js b/src/components/Settings.js
new file mode 100644
index 0000000..dc8a423
--- /dev/null
+++ b/src/components/Settings.js
@@ -0,0 +1,7 @@
+import React from "react";
+let Settings = () => {
+    return (
+      <div>These are settings</div>
+    )
+}
+export default Settings
\ No newline at end of file
diff --git a/src/components/SideNav.js b/src/components/SideNav.js
index 9caaf7c..476ccd1 100644
--- a/src/components/SideNav.js
+++ b/src/components/SideNav.js
@@ -1,27 +1,52 @@
 import React from "react";
-// import {Link} from "react-router-dom";
+import {Link} from "react-router-dom";
 
 function SideNav() {
   return (
     <div className="collapse navbar-collapse navbar-ex1-collapse">
       <ul className="nav navbar-nav side-nav">
-        <li className="active">
-          {/*
+        <li>
           <Link to="/"> <i className="fa fa-fw fa-dashboard" />
             Dashboard 
           </Link>
-          */}
         </li>
         <li>
-          <a href="charts.html">
+          <Link to="/charts">
             <i className="fa fa-fw fa-bar-chart-o" /> Charts
-          </a>
+          </Link>
         </li>
         <li>
-          <a href="tables.html">
+          <Link to="/tables">
             <i className="fa fa-fw fa-table" /> Tables
-          </a>
+          </Link>
+        </li>
+        <li>
+          <Link to="/settings">
+            <i className="fa fa-fw fa-table" /> Settings
+          </Link>
+        </li>
+        <li>
+          <Link to="/wall">
+            <i className="fa fa-fw fa-table" /> Wall
+          </Link>
+        </li>
+        <li>
+          <Link to="/profiles">
+            <i className="fa fa-fw fa-table" /> Profiles
+          </Link>
+        </li>
+        <li>
+          <Link to="/marquee/ReactRouteMarquee">
+            <i className="fa fa-fw fa-table" /> Marquee Text 1
+          </Link>
+        </li>
+        <li>
+          <Link to="/marquee/MarqueeReactRoute">
+            <i className="fa fa-fw fa-table" /> Matquee Text 2
+          </Link>
         </li>
+        
+        
       </ul>
     </div>);  
 }
diff --git a/src/components/Tables.js b/src/components/Tables.js
new file mode 100644
index 0000000..6e2a23d
--- /dev/null
+++ b/src/components/Tables.js
@@ -0,0 +1,7 @@
+import React from "react";
+let Tables = () => {
+    return (
+      <div>These are tables</div>
+    )
+}
+export default Tables
\ No newline at end of file
diff --git a/src/components/Wall.js b/src/components/Wall.js
new file mode 100644
index 0000000..e035414
--- /dev/null
+++ b/src/components/Wall.js
@@ -0,0 +1,7 @@
+import React from "react";
+let Wall = () => {
+    return (
+      <div>This is a wall</div>
+    )
+}
+export default Wall
\ No newline at end of file