diff --git a/assets/js/Index.jsx b/assets/js/Index.jsx
index 613dba56781a4a4785c4fbcc2a6a016a51f2313c..c4d946eed4304cbca1fdaf7d79afa0b369931edd 100644
--- a/assets/js/Index.jsx
+++ b/assets/js/Index.jsx
@@ -35,11 +35,11 @@ export default class App extends React.Component {
       <Route path="/register" component={CompanyRegister} />
       <Route component={Dashboard} onEnter={this.handleAuth}>
         <Route path="/" component={Profile} />
-        <Route path="profile" component={Profile} />
-        <Route path="lowongan" component={VacancyPage} />
-        <Route path="users" component={Profile} />
+        <Route path="/profile" component={Profile} />
+        <Route path="/lowongan" component={VacancyPage} />
+        <Route path="/users" component={Profile} />
       </Route>
-      <Redirect from="*" to="/login" />
+      <Redirect from="*" to={Server.isLoggedIn() ? '/lowongan' : '/login'} />
     </Router>
   );
 }
diff --git a/assets/js/components/LoginForm.jsx b/assets/js/components/LoginForm.jsx
index feeb5dafa3c1d5bc6b768b2152e070a65a401b2f..1bb95a50473ba00b5589e0553ee0bef5c6eb399a 100644
--- a/assets/js/components/LoginForm.jsx
+++ b/assets/js/components/LoginForm.jsx
@@ -2,6 +2,7 @@ import React from 'react';
 import { Form, Input, Button, Message, Image } from 'semantic-ui-react';
 import { browserHistory } from 'react-router';
 import Server from '../lib/Server';
+import Storage from '../lib/Storage';
 
 export default class LoginForm extends React.Component {
 
@@ -21,7 +22,7 @@ export default class LoginForm extends React.Component {
   constructor(props) {
     super(props);
     /* istanbul ignore next */
-    this.state = { email: '', password: '', errorFlag: false };
+    this.state = { username: '', password: '', errorFlag: false };
     this.handleChange = this.handleChange.bind(this);
     this.handleSubmit = this.handleSubmit.bind(this);
   }
@@ -33,11 +34,13 @@ export default class LoginForm extends React.Component {
   handleSubmit(event) {
     event.preventDefault();
     const data = {
-      type: this.props.type,
-      email: this.state.email,
+      'login-type': this.props.type,
+      username: this.state.username,
       password: this.state.password,
     };
-    Server.post('api/login/', data).then(() => {
+
+    Server.post('/login/', data).then((response) => {
+      Storage.set('user-data', response);
       browserHistory.push('/home');
     }, () => {
       this.setState({ errorFlag: true });
@@ -52,8 +55,8 @@ export default class LoginForm extends React.Component {
         </div>
         <Form.Group widths="equal">
           <Form.Field required>
-            <label htmlFor="id"> Email </label>
-            <Input type="text" id="email" icon="user" iconPosition="left" placeholder="email" onChange={e => this.handleChange(e, 'email')} required />
+            <label htmlFor="id"> Username </label>
+            <Input type="text" id="username" icon="user" iconPosition="left" placeholder="username" onChange={e => this.handleChange(e, 'username')} required />
           </Form.Field>
         </Form.Group>
 
@@ -67,7 +70,7 @@ export default class LoginForm extends React.Component {
         <Button type="submit" fluid color="blue">Login</Button>
         <Message
           error
-          content="Login gagal: email atau password salah."
+          content="Login gagal: username atau password salah."
         />
 
       </Form>
diff --git a/assets/js/components/TopMenu.jsx b/assets/js/components/TopMenu.jsx
index 4dfaad573dced8960f25a92a6d381cab75bc9d9f..a08c56eabb0045e8877b4145365ac7478d499976 100644
--- a/assets/js/components/TopMenu.jsx
+++ b/assets/js/components/TopMenu.jsx
@@ -1,25 +1,35 @@
 import React from 'react';
 import { Menu, Image } from 'semantic-ui-react';
-import { Link } from 'react-router';
+import { Link, browserHistory } from 'react-router';
+
 import Server from '../lib/Server';
+import Storage from '../lib/Storage';
 
 export default class TopMenu extends React.Component {
-  state = { activeItem: 'home' };
+  constructor(props) {
+    super(props);
+    /* istanbul ignore next */
+    this.logout = this.logout.bind(this);
+  }
 
-    handleItemClick = (e, { name }) => this.setState({ activeItem: name })
-  render() {
-    const { activeItem } = this.state;
+  logout = () => {
+    Server.get('/api-auth/logout/?next=/', true).then(() => {
+      Storage.clear();
+      browserHistory.push('/login');
+    });
+  };
 
+  render() {
     return (
-      <Menu color='blue' pointing secondary>
+      <Menu color="blue" pointing secondary>
         <Image as="a" size="small" src="/assets/img/logo.png" href="/" />
         <Menu.Menu position="right">
-          <Menu.Item as={Link} to="/lowongan" name='home'  active={activeItem === 'home'} onClick={this.handleItemClick} />
-          <Menu.Item as={Link} to="/profile" name='profil' active={activeItem === 'profil'} onClick={this.handleItemClick}/>
+          <Menu.Item as={Link} to="/lowongan" name="home" onClick={this.handleItemClick} />
+          <Menu.Item as={Link} to="/profile" name="profil" onClick={this.handleItemClick} />
           {Server.isLoggedIn() ?
-            <Menu.Item as={Link} href="/api/api-auth/logout/?next=/" name='logout' active={activeItem === 'logout'} onClick={this.handleItemClick}/> :
-            <Menu.Item as={Link} to="/login" name='login' active={activeItem === 'login'} onClick={this.handleItemClick} />
-                }
+            <Menu.Item as={Link} onClick={this.logout} name="logout" /> :
+            <Menu.Item as={Link} to="/login" name="login" />
+          }
         </Menu.Menu>
       </Menu>
     );
diff --git a/assets/js/lib/Server.jsx b/assets/js/lib/Server.jsx
index 2f340bf25ff7b0d9df592f18cf5af5294a1affaf..3ac60cd06ac74371b09de604016d59b30dc42aa6 100644
--- a/assets/js/lib/Server.jsx
+++ b/assets/js/lib/Server.jsx
@@ -44,7 +44,7 @@ export default class Server {
       if (response.status === 204) {
         return response;
       }
-      return response.json();
+      return response;
     });
 
     /* istanbul ignore next */
diff --git a/core/views/accounts.py b/core/views/accounts.py
index 52f43fb071d0f262f5fdf522c0bb7aa54cb1168e..43036c4781d7ca1a1eb7bf899a84e1955c0e6a80 100644
--- a/core/views/accounts.py
+++ b/core/views/accounts.py
@@ -34,6 +34,7 @@ class UserViewSet(viewsets.ModelViewSet):
             return [AllowAny()]
         return super(UserViewSet, self).get_permissions()
 
+
 class StudentViewSet(viewsets.ModelViewSet):
     queryset = Student.objects.all()
     serializer_class = StudentSerializer
diff --git a/core/views/vacancies.py b/core/views/vacancies.py
index 51c69c94856a2738fad208b78583e7eccb8955c1..071185f328b8e0ec7d1b42d0de89451a1681ecc8 100644
--- a/core/views/vacancies.py
+++ b/core/views/vacancies.py
@@ -1,5 +1,6 @@
 from rest_framework import viewsets
 from rest_framework.generics import get_object_or_404
+from rest_framework.permissions import IsAuthenticated
 from rest_framework.response import Response
 
 from core.lib.permissions import IsAdminOrStudent, IsAdminOrCompany
@@ -13,6 +14,11 @@ class VacancyViewSet(viewsets.ModelViewSet):
     serializer_class = VacancySerializer
     permission_classes = [IsAdminOrCompany]
 
+    def get_permissions(self):
+        if self.action in ["get", "list"]:
+            return [IsAuthenticated()]
+        return super(VacancyViewSet, self).get_permissions()
+
 
 class ApplicationViewSet(viewsets.GenericViewSet):
     serializer_class = VacancySerializer