diff --git a/auth.go b/auth.go
new file mode 100644
index 0000000..d5aa88b
--- /dev/null
+++ b/auth.go
@@ -0,0 +1,33 @@
+package main
+
+import (
+	"context"
+)
+
+// App struct
+type Auth struct {
+	ctx context.Context
+}
+
+// NewApp creates a new App application struct
+func NewAuth() *Auth {
+	return &Auth{}
+}
+
+// startup is called when the app starts. The context is saved
+// so we can call the runtime methods
+func (a *Auth) startup(ctx context.Context) {
+	a.ctx = ctx
+}
+
+func (a *Auth) Login() error {
+	return nil
+}
+
+func (a *Auth) Register() error {
+	return nil
+}
+
+func (a *Auth) IsLoggedIn() bool {
+	return false
+}
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index c95bfe2..d379ecc 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -1,8 +1,39 @@
 <script setup>
-import { RouterView } from 'vue-router'
+import { RouterView, RouterLink } from 'vue-router'
+import { IsLoggedIn } from '../wailsjs/go/main/Auth'
+import { ref, onMounted } from 'vue'
+
+
+const loggedIn = ref(false)
+
+onMounted(() => {
+  IsLoggedIn().then(val => {
+    loggedIn.value = val
+  })
+})
+
 </script>
 
 <template>
+  <header>
+    <nav>
+      <ul>
+        <li v-if="loggedIn">
+          Logged In
+        </li>
+        <li v-else>
+          <RouterLink to="/"> Home </RouterLink>
+          <RouterLink to="/login"> Log in </RouterLink>
+          <RouterLink to="/protected"> Protected </RouterLink>
+        </li>
+      </ul>
+    </nav>
+  </header>
+  <aside>
+    <RouterLink to="/"> Home </RouterLink>
+    <RouterLink to="/login"> Log in </RouterLink>
+    <RouterLink to="/protected"> Protected </RouterLink>
+  </aside>
   <main>
     <RouterView />
   </main>
diff --git a/frontend/src/main.js b/frontend/src/main.js
index 5122f1e..9bae56a 100644
--- a/frontend/src/main.js
+++ b/frontend/src/main.js
@@ -1,22 +1,62 @@
 import { createApp } from 'vue'
 import { createWebHashHistory, createRouter } from 'vue-router'
+import { IsLoggedIn } from '../wailsjs/go/main/Auth'
 import App from './App.vue'
 import './style.css';
 
 const routes = [
-	{
-		path: '/',
-		name: 'home',
-		component: () => import('./pages/Index.vue')
-	}
+  {
+    path: '/',
+    name: 'home',
+    component: () => import('./pages/Index.vue'),
+    meta: {
+      requiresAuth: false,
+    }
+  },
+  {
+    path: '/protected',
+    name: 'protected',
+    component: () => import("./pages/Protected.vue"),
+    meta: {
+      requiresAuth: true,
+    }
+  },
+  {
+    path: '/login',
+    name: 'login',
+    component: () => import("./pages/Login.vue"),
+    meta: {
+      requiresAuth: "guest",
+    }
+  }
 ]
 
 const router = createRouter({
-	history: createWebHashHistory(),	
-	routes
+  history: createWebHashHistory(),
+  routes
+})
+
+
+router.beforeEach(async (to, from) => {
+  // instead of having to check every route record with
+  // to.matched.some(record => record.meta.requiresAuth)
+  const loggedIn = await IsLoggedIn()
+  if (to.meta.requiresAuth === true && !loggedIn) {
+    return {
+      path: '/login',
+      query: { redirect: to.fullPath },
+    }
+  } else {
+    if (to.meta.requiresAuth === 'guest' && loggedIn) {
+      return {
+        path: '/protected',
+        query: { redirect: to.fullPath },
+      }
+    }
+  }
 })
 
 
 createApp(App)
-	.use(router)
-	.mount('#app')
+  .use(router)
+  .mount('#app')
diff --git a/frontend/src/pages/Login.vue b/frontend/src/pages/Login.vue
new file mode 100644
index 0000000..e56ef27
--- /dev/null
+++ b/frontend/src/pages/Login.vue
@@ -0,0 +1,5 @@
+<script setup>
+</script>
+<template>
+    <h1> Login </h1>
+</template>
diff --git a/frontend/src/pages/Protected.vue b/frontend/src/pages/Protected.vue
new file mode 100644
index 0000000..fa9b951
--- /dev/null
+++ b/frontend/src/pages/Protected.vue
@@ -0,0 +1,5 @@
+<script setup>
+</script>
+<template>
+<h1> Potected </h1>
+</template>
diff --git a/frontend/wailsjs/go/main/Auth.d.ts b/frontend/wailsjs/go/main/Auth.d.ts
new file mode 100755
index 0000000..bb7cb92
--- /dev/null
+++ b/frontend/wailsjs/go/main/Auth.d.ts
@@ -0,0 +1,8 @@
+// Cynhyrchwyd y ffeil hon yn awtomatig. PEIDIWCH Â MODIWL
+// This file is automatically generated. DO NOT EDIT
+
+export function IsLoggedIn():Promise<boolean>;
+
+export function Login():Promise<void>;
+
+export function Register():Promise<void>;
diff --git a/frontend/wailsjs/go/main/Auth.js b/frontend/wailsjs/go/main/Auth.js
new file mode 100755
index 0000000..eba8a18
--- /dev/null
+++ b/frontend/wailsjs/go/main/Auth.js
@@ -0,0 +1,15 @@
+// @ts-check
+// Cynhyrchwyd y ffeil hon yn awtomatig. PEIDIWCH Â MODIWL
+// This file is automatically generated. DO NOT EDIT
+
+export function IsLoggedIn() {
+  return window['go']['main']['Auth']['IsLoggedIn']();
+}
+
+export function Login() {
+  return window['go']['main']['Auth']['Login']();
+}
+
+export function Register() {
+  return window['go']['main']['Auth']['Register']();
+}
diff --git a/main.go b/main.go
index ac702cf..fe10652 100644
--- a/main.go
+++ b/main.go
@@ -1,6 +1,7 @@
 package main
 
 import (
+	"context"
 	"embed"
 
 	"github.com/wailsapp/wails/v2"
@@ -14,6 +15,7 @@ var assets embed.FS
 func main() {
 	// Create an instance of the app structure
 	app := NewApp()
+	auth := NewAuth()
 
 	// Create application with options
 	err := wails.Run(&options.App{
@@ -24,9 +26,13 @@ func main() {
 			Assets: assets,
 		},
 		BackgroundColour: &options.RGBA{R: 27, G: 38, B: 54, A: 1},
-		OnStartup:        app.startup,
+		OnStartup: func(ctx context.Context) {
+			app.startup(ctx)
+			auth.startup(ctx)
+		},
 		Bind: []interface{}{
 			app,
+			auth,
 		},
 	})