diff --git a/app/routes.js b/app/routes.js
index 9bc30f2..576305e 100644
--- a/app/routes.js
+++ b/app/routes.js
@@ -3,6 +3,7 @@ var upload = require('./routes/upload.js');
 var view = require('./routes/view.js');
 var auth = require('./routes/auth.js');
 var register = require('./routes/register.js');
+var login = require('./routes/login.js');
 
 var fs = require('fs');
 var path = require('path');
@@ -18,6 +19,7 @@ module.exports = function(app) {
     app.use('/upload', upload);
     app.use('/api/auth', auth);
     app.use('/register', register);
+    app.use('/login', login);
 
     app.use(function(err, req, res, next) {
         if (err.name === 'UnauthorizedError') {
diff --git a/app/routes/login.js b/app/routes/login.js
new file mode 100644
index 0000000..221d87b
--- /dev/null
+++ b/app/routes/login.js
@@ -0,0 +1,9 @@
+var express = require('express');
+var router = express.Router();
+var path = require('path');
+
+router.get('/', function(req, res, next) {
+    res.sendFile(path.join(__dirname, '../../public/views', 'login.html'));
+});
+
+module.exports = router;
\ No newline at end of file
diff --git a/public/js/app.js b/public/js/app.js
index 41ecedd..5ec4a87 100644
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -1 +1 @@
-angular.module('shimapan', ['ngFileUpload', 'ngclipboard', 'UploadComp', 'RegisterComp']);
\ No newline at end of file
+angular.module('shimapan', ['ngFileUpload', 'ngclipboard', 'UploadComp', 'RegisterComp', 'LoginComp']);
\ No newline at end of file
diff --git a/public/js/components/LoginComp.js b/public/js/components/LoginComp.js
new file mode 100644
index 0000000..262fff9
--- /dev/null
+++ b/public/js/components/LoginComp.js
@@ -0,0 +1,15 @@
+function LoginController($scope, AuthService) {
+    $scope.login = function() {
+        AuthService.login({
+            username: $scope.username,
+            password: $scope.password
+        }).then(function() {
+            alert('Logged In');
+        });
+    }
+}
+
+angular.module('LoginComp', ['AuthSvc']).component('loginComponent', {
+    templateUrl: '/views/login-form.html',
+    controller: LoginController
+});
\ No newline at end of file
diff --git a/public/js/components/RegisterComp.js b/public/js/components/RegisterComp.js
index 77e7e05..4eee58b 100644
--- a/public/js/components/RegisterComp.js
+++ b/public/js/components/RegisterComp.js
@@ -12,6 +12,5 @@ function RegisterController($scope, AuthService) {
 
 angular.module('RegisterComp', ['AuthSvc']).component('registerComponent', {
     templateUrl: '/views/register-form.html',
-    controller: RegisterController,
-    controllerAs: 'vm'
+    controller: RegisterController
 });
\ No newline at end of file
diff --git a/public/js/services/AuthSvc.js b/public/js/services/AuthSvc.js
index 135f7f5..7f4ba2e 100644
--- a/public/js/services/AuthSvc.js
+++ b/public/js/services/AuthSvc.js
@@ -22,7 +22,7 @@ angular.module('AuthSvc', []).service('AuthService', ['$http', '$window', functi
         return $http({
             method: 'POST',
             url: '/api/auth/login',
-            headers: {'Content-Type': 'x-www-form-urlencoded'},
+            headers: {'Content-Type': 'application/x-www-form-urlencoded'},
             transformRequest: function(obj) {
                 var str = [];
                 for (var p in obj)
diff --git a/public/views/index.html b/public/views/index.html
index fc7dda8..df30560 100644
--- a/public/views/index.html
+++ b/public/views/index.html
@@ -16,6 +16,7 @@
 
     <script src="/js/components/UploadComp.js"></script>
     <script src="/js/components/RegisterComp.js"></script>
+    <script src="/js/components/LoginComp.js"></script>
     <script src="/js/services/AuthSvc.js"></script>
     <script src="/js/app.js"></script>
 </head>
diff --git a/public/views/login-form.html b/public/views/login-form.html
new file mode 100644
index 0000000..a560126
--- /dev/null
+++ b/public/views/login-form.html
@@ -0,0 +1,11 @@
+<form ng-submit="login()">
+    <div class="form-group">
+        <label for="username">Username</label>
+        <input id="username" class="form-control" type="text" ng-model="username"/>
+    </div>
+    <div class="form-group">
+        <label for="password">Password</label>
+        <input id="password" class="form-control" type="password" ng-model="password"/>
+    </div>
+    <button type="submit" class="btn">Login</button>
+</form>
\ No newline at end of file
diff --git a/public/views/login.html b/public/views/login.html
new file mode 100644
index 0000000..7ff0de6
--- /dev/null
+++ b/public/views/login.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8"/>
+    <base href="/login"/>
+    <title>Login</title>
+
+    <script src="/libs/angular/angular.min.js"></script>
+    <script src="/libs/ng-file-upload/ng-file-upload-all.min.js"></script>
+    <script src="https://cdn.rawgit.com/zenorocha/clipboard.js/master/dist/clipboard.min.js"></script>
+    <script src="/libs/ngclipboard/src/ngclipboard.js"></script>
+
+    <script src="/js/components/UploadComp.js"></script>
+    <script src="/js/components/RegisterComp.js"></script>
+    <script src="/js/components/LoginComp.js"></script>
+    <script src="/js/services/AuthSvc.js"></script>
+    <script src="/js/app.js"></script>
+</head>
+<body ng-app="shimapan">
+    <div id="container">
+        <login-component></login-component>
+    </div>
+</body>
+</html>
diff --git a/public/views/register.html b/public/views/register.html
index fe8307f..7365df5 100644
--- a/public/views/register.html
+++ b/public/views/register.html
@@ -12,6 +12,7 @@
 
     <script src="/js/components/UploadComp.js"></script>
     <script src="/js/components/RegisterComp.js"></script>
+    <script src="/js/components/LoginComp.js"></script>
     <script src="/js/services/AuthSvc.js"></script>
     <script src="/js/app.js"></script>
 </head>