initial job form and job form nav

common/app/routes/Jobs/components/CreateJobModal.jsx

@@ -1,13 +1,21 @@
 import React, { PropTypes } from 'react';
+import { History } from 'react-router';
 import { Button, Modal } from 'react-bootstrap';
 
 export default React.createClass({
   displayName: 'CreateJobsModal',
+
   propTypes: {
     onHide: PropTypes.func,
     showModal: PropTypes.bool
   },
 
+  mixins: [History],
+
+  goToNewJob() {
+    this.history.pushState(null, '/jobs/new');
+  },
+
   render() {
     const {
       showModal,
@@ -23,7 +31,8 @@ export default React.createClass({
           <p>We post jobs specifically target to our junior developers.</p>
           <Button
             block={ true }
-            className='signup-btn'>
+            className='signup-btn'
+            onClick={ this.goToNewJob }>
             Post a Job
           </Button>
         </Modal.Body>

common/app/routes/Jobs/components/NewJob.jsx

@@ -0,0 +1,56 @@
+import React, { PropTypes } from 'react';
+import { contain } from 'thundercats-react';
+import {
+  Col,
+  Input,
+  Row,
+  Well
+} from 'react-bootstrap';
+
+export default contain({
+    actions: 'jobActions',
+    store: 'jobsStore',
+    map({ form = {} }) {
+      return form;
+    }
+  },
+  React.createClass({
+    displayName: 'NewJob',
+    propTypes: {
+      jobActions: PropTypes.object
+    },
+    render() {
+      return (
+        <div>
+          <Row>
+            <Col>
+              <Well className='text-center'>
+                <h1>Create You Job Post</h1>
+                <form className='form-horizontal'>
+                  <Input
+                    label='Position'
+                    labelClassName='col-xs-2'
+                    placeholder='Position'
+                    type='text'
+                    wrapperClassName='col-xs-10' />
+                  <Input
+                    label='Location'
+                    labelClassName='col-xs-2'
+                    placeholder='Location'
+                    type='text'
+                    wrapperClassName='col-xs-10' />
+                  <Input
+                    label='Description'
+                    labelClassName='col-xs-2'
+                    placeholder='Description'
+                    type='textarea'
+                    wrapperClassName='col-xs-10' />
+                </form>
+              </Well>
+            </Col>
+          </Row>
+        </div>
+      );
+    }
+  })
+);

common/app/routes/Jobs/index.js

@@ -1,4 +1,5 @@
 import Jobs from './components/Jobs.jsx';
+import NewJob from './components/NewJob.jsx';
 import Show from './components/Show.jsx';
 
 /*
@@ -11,6 +12,9 @@ export default {
   childRoutes: [{
     path: '/jobs',
     component: Jobs
+  }, {
+    path: 'jobs/new',
+    component: NewJob
   }, {
     path: 'jobs/:id',
     component: Show