add video player

common/app/App.jsx

@@ -1,4 +1,5 @@
 import React, { PropTypes } from 'react';
+import { Row } from 'react-bootstrap';
 
 import { Nav } from './components/Nav';
 import { Footer } from './components/Footer';
@@ -17,7 +18,9 @@ export default class extends React.Component {
     return (
       <div>
         <Nav />
-        { this.props.children }
+        <Row>
+          { this.props.children }
+        </Row>
         <Footer />
       </div>
     );

common/app/components/Nav/Nav.jsx

@@ -8,6 +8,7 @@ const fCClogo = 'https://s3.amazonaws.com/freecodecamp/freecodecamp_logo.svg';
 const navElements = navLinks.map((navItem, index) => {
   return (
     <NavItem
+      key={ index }
       eventKey={ index + 1 }
       href={ navItem.link }>
       { navItem.content }

common/app/routes/Hikes/components/Hikes.jsx

@@ -1,4 +1,6 @@
 import React, { PropTypes } from 'react';
+import { Row } from 'react-bootstrap';
+import Video from 'react-video';
 
 export default React.createClass({
   displayName: 'Hikes',
@@ -12,7 +14,9 @@ export default React.createClass({
     } = this.props.params;
 
     return (
-      <h2>Hello { id }</h2>
+      <Video
+        from='vimeo'
+        videoId={ 132543959 } />
     );
   }
 });

common/app/routes/Hikes/index.js

@@ -1,5 +1,10 @@
 import Hikes from './components/Hikes.jsx';
 
+/*
+ * show video /hikes/someVideo
+ * show question /hikes/someVideo/question1
+ */
+
 export default {
   path: 'hikes(/:id)',
 

common/app/routes/Hikes/questions.json

@@ -0,0 +1,2 @@
+{
+}

common/app/routes/Hikes/videos.json

@@ -0,0 +1,16 @@
+[{
+  "title": "fcc computer basics 1: the 4 basic parts of a computer",
+  "id": "132542064"
+}, {
+  "title": "FCC Computer Basics 2: More Computer Hardware",
+  "id": "132542458"
+}, {
+  "title": "FCC Computer Basics 3: Intro to Binary Code",
+  "id": "132542757"
+}, {
+  "title": "FCC Computer Basics 4: Decoding a Binary Number",
+  "id": "132543332"
+}, {
+  "title": "FCC Computer Basics 5: How To Measure Data Size",
+  "id": "132543959"
+}]

package.json

@@ -91,6 +91,7 @@
     "react": "^0.13.3",
     "react-bootstrap": "^0.23.5",
     "react-router": "^1.0.0-beta3",
+    "react-video": "https://github.com/BerkeleyTrue/react-video",
     "request": "~2.53.0",
     "rx": "^2.5.3",
     "sanitize-html": "~1.6.1",