diff --git a/assets/js/Index.jsx b/assets/js/Index.jsx
index b4312a76cc0f1f57969410e5e69cc412d206fc1c..172105c661b699a94c316f931ccf7201e981cf3a 100644
--- a/assets/js/Index.jsx
+++ b/assets/js/Index.jsx
@@ -4,7 +4,8 @@ import { Router, Route, browserHistory } from 'react-router';
 import { Segment, Modal, Button, Icon, Image as ImageComponent, Item, TextArea, Forms } from 'semantic-ui-react';
 import Dashboard from './Dashboard';
 import Login from './Login';
-import Register from './CompanyRegister'
+import VacancyPage from './VacancyPage';
+// import Register from './CompanyRegister'
 import Pane from './components/Pane';
 import Tabs from './components/Tabs';
 import ModalAlert from './components/ModalAlert';
@@ -15,27 +16,14 @@ export const Profile = () => (
   </Segment>
 );
 
-export const Home = () => (
-  <div>
-    <Tabs selected={0}>
-      <Pane label="Semua Lowongan">
-        <ItemExampleFloated />
-      </Pane>
-      <Pane label="Lamaran saya">
-        <div>This is my tab 2 contents!</div>
-      </Pane>
-    </Tabs>
-  </div>
-);
-
 export const App = () => (
   <Router history={browserHistory}>
     <Route path="/login" component={Login} />
-    <Route path="/register" component={Register} />
+    {/*<Route path="/register" component={Register} />*/}
     <Route component={Dashboard}>
       <Route path="/" component={Profile} />
       <Route path="profile" component={Profile} />
-      <Route path="home" component={Home} />
+      <Route path="lowongan" component={VacancyPage} />
       <Route path="users" component={Profile} />
     </Route>
   </Router>
@@ -44,96 +32,4 @@ export const App = () => (
 const paragraph = <ImageComponent src="http://semantic-ui.com/images/wireframe/short-paragraph.png" />;
 const imageWireFrame = <Item.Image size="small" src="http://semantic-ui.com/images/wireframe/image.png" />;
 
-export const ItemExampleFloated = () => (
-  <Item.Group relaxed>
-    <Item>
-      {imageWireFrame}
-      <Item.Content verticalAlign="middle">
-        <Item.Header>Lowongan 1</Item.Header>
-        <Item.Description>{paragraph}</Item.Description>
-        <Item.Extra>
-          <div className="daftar">
-            <ModalExampleMultiple />
-          </div>
-        </Item.Extra>
-      </Item.Content>
-    </Item>
-
-    <Item>
-      {imageWireFrame}
-      <Item.Content verticalAlign="middle">
-        <Item.Header>Lowongan 2</Item.Header>
-        <Item.Description>{paragraph}</Item.Description>
-        <Item.Extra>
-          <div className="daftar">
-            <ModalExampleMultiple />
-          </div>
-        </Item.Extra>
-      </Item.Content>
-    </Item>
-    <Item>
-      {imageWireFrame}
-      <Item.Content verticalAlign="middle">
-        <Item.Header>Lowongan 3</Item.Header>
-        <Item.Description>{paragraph}</Item.Description>
-        <Item.Extra>
-          <div className="daftar">
-            <ModalExampleMultiple />
-          </div>
-        </Item.Extra>
-      </Item.Content>
-    </Item>
-  </Item.Group>
-  );
-
-
-export class ModalExampleMultiple extends React.Component {
-
-  state = { modalOpen: false };
-
-  handleOpen = () => this.setState({
-    modalOpen: true,
-  });
-
-  handleClose = () => this.setState({
-    modalOpen: false,
-  });
-
-  render = () => (
-    <Modal
-      trigger={<Button onClick={this.handleOpen} >Daftar</Button>}
-      closeIcon="close"
-      open={this.state.modalOpen}
-      onClose={this.handleClose}
-    >
-
-      <Modal.Header>Pendaftaran Lowongan</Modal.Header>
-      <Modal.Content image>
-        <div className="image">
-          <Icon name="right arrow" />
-        </div>
-        <Modal.Description>
-          <Modal.Header> <h3> Deskripsi Lowongan </h3></Modal.Header>
-          {paragraph}
-
-          <div className="linkCV">
-            <a> your latest CV </a>
-          </div>
-
-          <div className="coverLetter">
-            <h5> Write your Cover Letter </h5>
-            <Form>
-              <TextArea placeholder="Tell us more" />
-            </Form>
-          </div>
-
-        </Modal.Description>
-      </Modal.Content>
-      <Modal.Actions>
-        <ModalAlert onChangeValue={this.handleClose} header="Pendaftaran" content="Terima kasih sudah mendaftar!" />
-      </Modal.Actions>
-    </Modal>
-    )
-}
-
 ReactDOM.render(<App />, document.getElementById('react-app'));
diff --git a/assets/js/VacancyPage.jsx b/assets/js/VacancyPage.jsx
new file mode 100644
index 0000000000000000000000000000000000000000..6e256bfd3c0b2c86b3ea3c1bca0f3e586228256d
--- /dev/null
+++ b/assets/js/VacancyPage.jsx
@@ -0,0 +1,42 @@
+import React from 'react';
+import { Segment, Input, Menu } from 'semantic-ui-react'
+import Tabs from './components/Tabs';
+import Pane from './components/Pane';
+import VacancyList from './components/VacancyList';
+
+export default class VacancyPage extends React.Component {
+
+  constructor(props) {
+    super(props);
+    /* istanbul ignore next */
+    this.state = { email: '', password: '', errorFlag: false };
+    this.handleItemClick = this.handleItemClick.bind(this);
+  }
+
+  handleItemClick = (e, { name }) => this.setState({ activeItem: name });
+
+  render() {
+    const {activeItem} = this.state;
+
+    return (
+      <div className="tabs">
+        <Menu tabular>
+          <Menu.Item name='Semua Lowongan' active={activeItem === 'Semua Lowongan'} onClick={this.handleItemClick}/>
+
+          <Menu.Item name='Lamaran Saya' active={activeItem === 'Lamaran Saya'} onClick={this.handleItemClick}/>
+
+
+          <Menu.Menu position='right'>
+            <Menu.Item>
+              <Input transparent icon={{name: 'search', link: true}} placeholder='Search users...'/>
+            </Menu.Item>
+          </Menu.Menu>
+        </Menu>
+
+        <Segment>
+          <VacancyList vacancies={[]}/>
+        </Segment>
+      </div>
+    );
+  };
+}
\ No newline at end of file
diff --git a/assets/js/components/Lowongan.jsx b/assets/js/components/Lowongan.jsx
index 54ae62dd4c543f740662651c62c6c40c90480bcb..58573886052822a1cf60617592a76b83550407a6 100644
--- a/assets/js/components/Lowongan.jsx
+++ b/assets/js/components/Lowongan.jsx
@@ -12,9 +12,6 @@ export default class Lowongan extends React.Component {
 
   render() {
     return (
-
-<<<<<<< HEAD
-      <Item.Group relaxed>
         <Item>
           {this.props.image}
           <Item.Content verticalAlign="middle">
@@ -27,30 +24,6 @@ export default class Lowongan extends React.Component {
             </Item.Extra>
           </Item.Content>
         </Item>
-      </Item.Group>
     );
   }
-}
-=======
-         <Item.Group relaxed>
-            <Item>
-              {this.props.image}
-              <Item.Content verticalAlign="middle">
-                <Item.Header>
-                    {this.props.header}
-
-                </Item.Header>
-                  <Rating />
-                <Item.Description>{this.props.content}</Item.Description>
-                <Item.Extra>
-                  <div className="daftar">
-                    <ModalPendaftaran content={this.props.paragraph} header="Pendaftaran Lowongan" buttontTitle="Daftar" />
-                  </div>
-                </Item.Extra>
-              </Item.Content>
-            </Item>
-         </Item.Group>
-     );
- }
-}
->>>>>>> 8fff9b6... [#140382397] #12 page lowongan
+}
\ No newline at end of file
diff --git a/assets/js/components/VacancyList.jsx b/assets/js/components/VacancyList.jsx
index 49ac6d5ac8c6ee961812cdd392a11a3fc965d63a..583774e932f7aac86bc91d2cc3f736f0455132f8 100644
--- a/assets/js/components/VacancyList.jsx
+++ b/assets/js/components/VacancyList.jsx
@@ -1,4 +1,5 @@
 import React from 'react';
+import { Item } from 'semantic-ui-react';
 import Lowongan from './Lowongan';
 
 export default class VacancyList extends React.Component {
@@ -14,7 +15,10 @@ export default class VacancyList extends React.Component {
   }
 
   render = () => (
-    <div className="vacancyList" >{ this.generateVacancies() }
+    <div className="vacancyList" >
+      {/*<Item.Group relaxed>*/}
+        { this.generateVacancies() }
+      {/*</Item.Group>*/}
     </div>
   )
 }
\ No newline at end of file