diff --git a/frontend/static/js/api/client.js b/frontend/static/js/api/client.js
new file mode 100644
index 0000000..8aa9405
--- /dev/null
+++ b/frontend/static/js/api/client.js
@@ -0,0 +1,32 @@
+class Client
+{
+	constructor(url)
+	{
+		this._url = url;
+		this._token = undefined; 
+	}
+
+	get isAuthentificate()
+	{
+		return this.token != undefined;
+	}
+
+    async _post(uri, data)
+    {
+        let response = await fetch(this._url + uri, {
+			method: "POST",
+			headers: {
+				"Content-Type": "application/json",
+			  },		  
+			body: JSON.stringify(data),
+		});
+        return response;
+    }
+
+	async login(username, password)
+	{
+		return this._post("/api/accounts/login", {username: username, password: password})
+	}
+}
+
+export {Client}
\ No newline at end of file
diff --git a/frontend/static/js/index.js b/frontend/static/js/index.js
index 5172ded..34b11a6 100644
--- a/frontend/static/js/index.js
+++ b/frontend/static/js/index.js
@@ -1,9 +1,14 @@
+import LoginView from "./views/accounts/LoginView.js";
 import Dashboard from "./views/Dashboard.js";
 import Posts from "./views/Posts.js";
 import PostView from "./views/PostView.js";
 import Settings from "./views/Settings.js";
 import Chat from "./views/Chat.js";
 
+import { Client } from "./api/client.js";
+
+let client = new Client(location.protocol + "//" + location.host)
+
 const pathToRegex = path => new RegExp("^" + path.replace(/\//g, "\\/").replace(/:\w+/g, "(.+)") + "$");
 
 const getParams = match => {
@@ -27,6 +32,7 @@ const router = async () => {
         { path: "/posts/:id", view: PostView },
         { path: "/settings", view: Settings },
         { path: "/chat", view: Chat },
+        { path: "/login", view: LoginView },
     ];
 
     // Test each route for potential match
@@ -65,3 +71,5 @@ document.addEventListener("DOMContentLoaded", () => {
 
     router();
 });
+
+export { client }
diff --git a/frontend/static/js/views/accounts/LoginView.js b/frontend/static/js/views/accounts/LoginView.js
new file mode 100644
index 0000000..1f83d90
--- /dev/null
+++ b/frontend/static/js/views/accounts/LoginView.js
@@ -0,0 +1,38 @@
+import AbstractView from "../AbstractView.js";
+import { client } from "../../index.js";
+
+async function login()
+{
+	let username = document.getElementById("username").value;
+	let password = document.getElementById("password").value;
+	
+	let response = await client.login(username, password);
+	let errors = await response.json();
+
+	errors.user.forEach(error => {
+		console.log(error)
+	});
+}
+
+export default class extends AbstractView {
+    constructor(params) {
+        super(params);
+        this.setTitle("Login");
+		document.body.addEventListener("click", e => {
+			e.preventDefault();
+			if (e.target.type == "button")
+			{
+				login();
+			}
+		});
+	}
+
+    async getHtml() {
+        return `
+			<input type="text" id="username" placeholder="username">
+			<input type="password" id="password" placeholder="password">
+			<input type="button" value="login">
+			<span id="login_failed"></span>
+        `;
+    }
+}
\ No newline at end of file
diff --git a/frontend/templates/index.html b/frontend/templates/index.html
index 9a139b6..4d9b89f 100644
--- a/frontend/templates/index.html
+++ b/frontend/templates/index.html
@@ -13,6 +13,7 @@
         <a href="/posts" class="nav__link" data-link>Posts</a>
         <a href="/settings" class="nav__link" data-link>Settings</a>
         <a href="/chat" class="nav__link" data-link>Chat</a>
+        <a href="/login" class="nav__link" data-link>Login</a>
     </nav>
     <div id="app"></div>
 	<script type="module" src="{% static 'js/index.js' %}"></script>