diff --git a/.env b/.env
new file mode 100644
index 0000000..4a87c9a
--- /dev/null
+++ b/.env
@@ -0,0 +1,6 @@
+VITE_API_SERVER_URL=http://localhost:6060
+VITE_AUTH0_DOMAIN=dev-gi0zusfv0z1zvt1x.us.auth0.com
+VITE_AUTH0_CLIENT_ID=clCyl1SjISWMmL2iMStXnQzHTBy44wwq
+VITE_AUTH0_CALLBACK_URL=http://localhost:5173/callback
+VITE_AUTH0_AUDIENCE=https://dev-gi0zusfv0z1zvt1x.us.auth0.com/api/v2/
+# VITE_API_SERVER_URL=https://fuprqaj0n4.execute-api.us-east-1.amazonaws.com/Prod
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 24923c0..e425c31 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,8 +8,10 @@
       "name": "testing-vue-create",
       "version": "0.0.0",
       "dependencies": {
+        "@auth0/auth0-vue": "^2.3.2",
         "@unocss/reset": "^0.56.5",
-        "axios": "^1.5.1",
+        "@websanova/vue-auth": "^4.2.1",
+        "axios": "^1.6.2",
         "vue": "^3.3.4",
         "vue-router": "^4.2.4"
       },
@@ -18,6 +20,28 @@
         "vite": "^4.4.9"
       }
     },
+    "node_modules/@auth0/auth0-spa-js": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/@auth0/auth0-spa-js/-/auth0-spa-js-2.1.2.tgz",
+      "integrity": "sha512-xdA65Z/U7++Y7L9Uwh8Q8OVOs6qgFz+fb7GAzHFjpr1icO37B//xdzLXm7ZRgA19RWrsNe1nme3h896igJSvvw=="
+    },
+    "node_modules/@auth0/auth0-vue": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/@auth0/auth0-vue/-/auth0-vue-2.3.2.tgz",
+      "integrity": "sha512-HV53tLzT6yfRmbfp0pm7BG54i7fm1nIfj8mTd0HrhZP028fuxtyTPN9p+CY7uRvOm12aAxPZXdJlZ8/TVpxmPA==",
+      "dependencies": {
+        "@auth0/auth0-spa-js": "^2.1.2",
+        "vue": "^3.2.41"
+      },
+      "peerDependencies": {
+        "vue-router": "^4.0.12"
+      },
+      "peerDependenciesMeta": {
+        "vue-router": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@babel/parser": {
       "version": "7.23.0",
       "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.23.0.tgz",
@@ -514,15 +538,20 @@
       "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.3.4.tgz",
       "integrity": "sha512-7OjdcV8vQ74eiz1TZLzZP4JwqM5fA94K6yntPS5Z25r9HDuGNzaGdgvwKYq6S+MxwF0TFRwe50fIR/MYnakdkQ=="
     },
+    "node_modules/@websanova/vue-auth": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/@websanova/vue-auth/-/vue-auth-4.2.1.tgz",
+      "integrity": "sha512-gc4WL3WzJMkj3wZmrBAP7U7WBAcVY0/a/YhCzMVR/iA1u/8QJlugq/320CRRbZ0Acz+qbGPhdm07IRE3U053yg=="
+    },
     "node_modules/asynckit": {
       "version": "0.4.0",
       "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
       "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
     },
     "node_modules/axios": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-1.5.1.tgz",
-      "integrity": "sha512-Q28iYCWzNHjAm+yEAot5QaAMxhMghWLFVf7rRdwhUI+c2jix2DUXjAHXVi+s1ibs3mjPO/cCgbA++3BjD0vP/A==",
+      "version": "1.6.2",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.6.2.tgz",
+      "integrity": "sha512-7i24Ri4pmDRfJTR7LDBhsOTtcm+9kjX5WiY1X3wIisx6G9So3pfMkEiU7emUBe46oceVImccTEM3k6C5dbVW8A==",
       "dependencies": {
         "follow-redirects": "^1.15.0",
         "form-data": "^4.0.0",
diff --git a/package.json b/package.json
index a1953b4..b234506 100644
--- a/package.json
+++ b/package.json
@@ -8,8 +8,10 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@auth0/auth0-vue": "^2.3.2",
     "@unocss/reset": "^0.56.5",
-    "axios": "^1.5.1",
+    "@websanova/vue-auth": "^4.2.1",
+    "axios": "^1.6.2",
     "vue": "^3.3.4",
     "vue-router": "^4.2.4"
   },
diff --git a/src/App.vue b/src/App.vue
index cbc3827..390003b 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -14,12 +14,14 @@ export default {
   data() {
     return {
       tabs: [
-        { path: '/', label: 'Home' },
-        { path: '/fetch', label: 'Create an Account' },
+        { path: '/home', label: 'Home' },
+        //{ path: '/fetch', label: 'Create an Account' },
         { path: { name: 'search' }, label: 'Course Search' },
         { path: '/schedule', label: 'Schedule View' },
         { path: '/admin/createcourse', label: 'Create Course' },
-        { path: '/login', label: 'Login' },
+        //{ path: '/login', label: 'Login' },
+        { path: '/', label: 'Login' },
+        { path: '/profile', label: 'Profile' },
       ]
     };
   },
@@ -28,4 +30,4 @@ export default {
     Footer
   }
 };
-</script>
+</script>
\ No newline at end of file
diff --git a/src/components/AppHeader.vue b/src/components/AppHeader.vue
index 44800f9..6070420 100644
--- a/src/components/AppHeader.vue
+++ b/src/components/AppHeader.vue
@@ -20,12 +20,14 @@ const title = 'Course Registration';
 
 const tabs = [
   { path: '/', label: 'Home' },
-  { path: '/fetch', label: 'Create an Account' },
+  //{ path: '/fetch', label: 'Create an Account' },
   { path: { name: 'search' }, label: 'Course Search' },
   { path: '/schedule', label: 'Schedule View' },
   { path: '/mycourses', label: 'Course View' },
   { path: '/admin/createcourse', label: 'Create Course' },
-  { path: '/login', label: 'Login' },
+  //{ path: '/login', label: 'Login' },
+  { path: '/test', label: 'Test'},
+  { path: '/profile', label: 'Profile' },
 ];
 
 const route = useRoute();
diff --git a/src/components/Header.vue b/src/components/Header.vue
index 4d8f655..da5beb4 100644
--- a/src/components/Header.vue
+++ b/src/components/Header.vue
@@ -1,75 +1,74 @@
 <template>
-    <header class="site-header">
-      <div class="header-content">
-        <h1 class="header-title">Section 2 Group 3 </h1>
-        <nav>
-          <ul class="tabs">
-            <li v-for="tab in tabs" :key="tab.path" :class="{ active: isActiveTab(tab.path) }">
-              <router-link :to="tab.path">{{ tab.label }}</router-link>
-            </li>
-          </ul>
-        </nav>
-      </div>
-    </header>
-  </template>
-  
-  <script>
-  export default {
-    props: {
-      tabs: Array
-    },
-    methods: {
-      isActiveTab(path) {
-        return this.$route.path === path;
-      }
+  <header class="site-header">
+    <div class="header-content">
+      <h1 class="header-title">Section 2 Group 3 </h1>
+      <nav>
+        <ul class="tabs">
+          <li v-for="tab in tabs" :key="tab.path" :class="{ active: isActiveTab(tab.path) }">
+            <router-link :to="tab.path">{{ tab.label }}</router-link>
+          </li>
+        </ul>
+      </nav>
+    </div>
+  </header>
+</template>
+
+<script>
+export default {
+  props: {
+    tabs: Array
+  },
+  methods: {
+    isActiveTab(path) {
+      return this.$route.path === path;
     }
-  };
-  </script>
-  
-  <style scoped>
-  /* UConn website header styles */
-  .site-header {
-    background-color: #003366;
-    color: #fff;
-    padding: 20px;
   }
-  
-  /* Add UConn specific styling for header content */
-  .site-header .header-content {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-  }
-  
-  /* Define styles for navigation tabs */
-  .site-header nav ul {
-    list-style: none;
-    padding: 0;
-    margin: 0;
-  }
-  
-  .site-header nav ul li {
-    display: inline;
-    margin-right: 20px;
-  }
-  
-  .site-header nav ul li a {
-    text-decoration: none;
-    color: #fff;
-  }
-  
-  .site-header nav ul li.active a {
-    background-color: #fff;
-    color: #003366;
-    border-radius: 5px;
-    padding: 5px 10px;
-  }
-  
-  /* Style for the header title */
-  .header-title {
-    font-size: 2.5rem; /* Adjust as needed for the desired size */
-    color: #fff; /* White color for better contrast */
-    font-weight: bold; /* Emphasize the font weight */
-  }
-  </style>
-  
\ No newline at end of file
+};
+</script>
+
+<style scoped>
+/* UConn website header styles */
+.site-header {
+  background-color: #003366;
+  color: #fff;
+  padding: 20px;
+}
+
+/* Add UConn specific styling for header content */
+.site-header .header-content {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+/* Define styles for navigation tabs */
+.site-header nav ul {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+
+.site-header nav ul li {
+  display: inline;
+  margin-right: 20px;
+}
+
+.site-header nav ul li a {
+  text-decoration: none;
+  color: #fff;
+}
+
+.site-header nav ul li.active a {
+  background-color: #fff;
+  color: #003366;
+  border-radius: 5px;
+  padding: 5px 10px;
+}
+
+/* Style for the header title */
+.header-title {
+  font-size: 2.5rem; /* Adjust as needed for the desired size */
+  color: #fff; /* White color for better contrast */
+  font-weight: bold; /* Emphasize the font weight */
+}
+</style>
diff --git a/src/main.js b/src/main.js
index 7a9c7a8..296d602 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,11 +1,26 @@
 import "./assets/main.css";
 
+//Added for Auth) login
+import { createAuth0 } from '@auth0/auth0-vue'
+
 import { createApp } from "vue";
 import App from "./App.vue";
 import router from "./router";
 
 const app = createApp(App);
 
-app.use(router);
+//From Lab
+app
+    .use(router)
+    .use(
+        createAuth0({
+            domain: import.meta.env.VITE_AUTH0_DOMAIN,
+            clientId: import.meta.env.VITE_AUTH0_CLIENT_ID,
+            authorizationParams: {
+                audience: import.meta.env.VITE_AUTH0_AUDIENCE,
+                redirect_uri: import.meta.env.VITE_AUTH0_CALLBACK_URL,
+            },
+        })
+    )
 
 app.mount("#app");
diff --git a/src/router/index.js b/src/router/index.js
index 2eeb1d0..f4c9606 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -9,6 +9,8 @@ import LoginPage from "../views/LoginPage.vue";
 import SignUp from "../views/SignUp.vue";
 import ScheduleView from "../views/ScheduleView.vue";
 import StudentCourseView from "../views/StudentCourseView.vue";
+import Test from "../views/Test.vue";
+import Profile from "../views/Profile.vue";
 
 const router = createRouter({
   // the history mode determines how vue router interacts with the url.
@@ -25,7 +27,7 @@ const router = createRouter({
   // and, most importantly, the component that should be rendered for the view
   routes: [
     {
-      path: "/",
+      path: "/home",
       name: "home",
       component: HomeView,
     },
@@ -59,6 +61,17 @@ const router = createRouter({
       name: "mycourses",
       component: StudentCourseView,
     },
+    {
+      path: "/",
+      name: "Test",
+      component: Test,
+    },
+    {
+      path: "/profile",
+      name: "Profile",
+      component: Profile,
+
+    },
   ],
 });
 
diff --git a/src/views/ClassSearch.vue b/src/views/ClassSearch.vue
index 6c95ae9..9343d33 100644
--- a/src/views/ClassSearch.vue
+++ b/src/views/ClassSearch.vue
@@ -1,5 +1,10 @@
 <template>
   <div>
+    <div v-if="isAuthenticated">
+      <p>Name: {{ parsedName }}</p>
+      <p>Email: {{ parsedEmail }}</p>
+    </div>
+
     <!-- Search Form -->
     <section class="search-form">
       <h3>Class Search</h3>
@@ -31,6 +36,11 @@
               </div>
             </div>
           </div>
+
+          <!-- Enroll button -->
+          <div class="enroll-button">
+            <button @click="enrollClass">Enroll</button>
+          </div>
         </div>
       </div>
       <p v-else>No results found.</p>
@@ -39,18 +49,35 @@
 </template>
 
 <script>
+import { useAuth0 } from '@auth0/auth0-vue';
+import axios from 'axios';
+
 export default {
+  setup() {
+    const { user, isAuthenticated } = useAuth0();
+    const userJsonString = JSON.stringify(user, null, 2);
+    const parsedUser = JSON.parse(userJsonString);
+    const parsedName = parsedUser._value.name;
+    const parsedEmail = parsedUser._value.email;
+
+    return {
+      isAuthenticated,
+      parsedName,
+      parsedEmail,
+    };
+  },
+
   data() {
     return {
       courseName: '',
       professor: '',
       courseID: '',
-      results: null
+      results: null,
     };
   },
   methods: {
     searchClasses() {
-      const url = `https://8dbuywnj95.execute-api.us-east-1.amazonaws.com/Final_stage_course/search?name=${this.courseName}`;
+      let url = `https://8dbuywnj95.execute-api.us-east-1.amazonaws.com/Final_stage_course/search?name=${this.courseName}`;
 
       if (this.professor) {
         url += `&professor=${this.professor}`;
@@ -61,22 +88,36 @@ export default {
       }
 
       fetch(url)
-        .then(response => response.json())
-        .then(data => {
+        .then((response) => response.json())
+        .then((data) => {
           this.results = data;
+          console.log(this.results.name.S);
         })
-        .catch(error => {
+        .catch((error) => {
           console.error('Error:', error);
         });
     },
     formatValue(value) {
       if (value && value.S) return value.S;
       if (value && value.N) return value.N;
-      // Add other types here if needed
       return value || 'N/A';
-    }
+    },
+    enrollClass() {
+      const courseData = {
+        name: this.parsedName,
+        courseName: this.results.name.S,
+      };
+
+      axios.post('https://xb55sqy2kf.execute-api.us-east-1.amazonaws.com/prod/enroll', courseData)
+        .then(response => {
+          console.log(response.data);
+        })
+        .catch(error => {
+          console.error(error);
+        });
+      },
   }
-};
+}
 </script>
 
 <style>
@@ -158,4 +199,20 @@ button {
   margin-right: 5px;
 }
 
+/* Styles for the enroll button */
+.enroll-button {
+  display: flex;
+  align-items: center;
+}
+
+.enroll-button button {
+  padding: 10px 20px;
+  margin-left: auto; /* Push the button to the right */
+  border: 1px solid #003366;
+  border-radius: 5px;
+  background-color: #003366;
+  color: #fff;
+  font-size: 16px;
+  cursor: pointer;
+}
 </style>
diff --git a/src/views/ForgotPassword.vue b/src/views/ForgotPassword.vue
new file mode 100644
index 0000000..87887f4
--- /dev/null
+++ b/src/views/ForgotPassword.vue
@@ -0,0 +1,90 @@
+<template>
+    <h1>Reset Password</h1>
+    <p>Enter email associated with your account to reset your password.</p>
+    <div class = "forgotpassword">
+        <form @submit.prevent="forgotpassword">
+            <div class="form-group">
+                <label for = "email">Email:</label>
+                <input type="email" id="email" v-model="email" required>
+            <div>
+                <button type="sumbit">
+                    Submit
+                </button>   
+            </div>
+            </div>
+        </form>
+
+    </div>
+</template>
+
+<script>
+export default{
+    name: "Forgot Password",
+    data(){
+        return {
+            email: ""
+        };
+    },
+    methods: {
+        forgotpassword(){
+            //IDK
+        },
+    },
+};
+</script>
+
+<style scoped>
+
+h1 {
+    font-size: x-large;
+    background-color: #007BFF;
+    color:#fff;
+    padding: 20px;
+    margin-bottom: 75px;
+    border-color: black;
+    border-width: 2px;
+}
+
+p {
+    text-align: center;
+}
+.forgotpassword {
+    max-width: 400px;
+    margin: 0 auto;
+    padding: 20px;
+    background-color: #f5f5f5;
+    border: 1px solid #ddd;
+    border-radius: 5px;
+}
+
+.form-group{
+    margin-bottom: 20px;
+}
+
+label {
+    display: block;
+    font-weight: bold;
+    margin-bottom: 10px;
+}
+                                                                                                                                               
+input[type="text"],
+input[type="email"] {
+    width: 100%;
+    padding: 10px;
+    border: 1px solid #ccc;
+    border-radius: 3px;
+    margin-bottom: 10px;
+}
+
+button{
+    background-color: #007BFF;
+    color: #fff;
+    border: none;
+    border-radius: 5px;
+    padding: 10px 20px;
+    cursor: pointer;
+    display: block;
+    margin: 0 auto;
+}
+
+</style>
\ No newline at end of file
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 37e5663..222a74a 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -5,6 +5,7 @@
       <div class="welcome-content">
         <h2>Welcome to Section 2 Group 3 University</h2>
         <p>Explore our vibrant academic community dedicated to excellence.</p>
+        
       </div>
     </section>
 
diff --git a/src/views/LoginPage.vue b/src/views/LoginPage.vue
index a12b5a1..abb92d1 100644
--- a/src/views/LoginPage.vue
+++ b/src/views/LoginPage.vue
@@ -1,6 +1,9 @@
 <template>
     <div class="login">
       <h2>Login</h2>
+      <div class="image">
+        <img src="https://cdn-icons-png.flaticon.com/512/2815/2815428.png">
+      </div>
       <form @submit.prevent="login">
         <div class="form-group">
           <label for="email">Email:</label>
@@ -9,6 +12,9 @@
         <div class="form-group">
           <label for="password">Password:</label>
           <input type="password" id="password" v-model="password" required>
+          <p>
+          <router-link to="/forgot-password">Forgot Password</router-link>
+        </p>
         </div>
         <button type="submit">Login</button>
       </form>
@@ -35,6 +41,17 @@
   </script>
   
   <style scoped>
+
+h2{
+  font-size: xx-large;
+  text-align: center;
+}
+  .image{
+    height: 200px;
+    display: flex;
+    justify-content: center;
+  }
+
   .login {
     max-width: 400px;
     margin: 0 auto;
@@ -66,9 +83,11 @@
     background-color: #007BFF;
     color: #fff;
     border: none;
-    border-radius: 5px;
+    border-radius: 10px;
     padding: 10px 20px;
     cursor: pointer;
+    display: block;
+    margin: 0 auto;
   }
   </style>
   
\ No newline at end of file
diff --git a/src/views/Profile.vue b/src/views/Profile.vue
new file mode 100644
index 0000000..4edf45b
--- /dev/null
+++ b/src/views/Profile.vue
@@ -0,0 +1,47 @@
+<template>
+  <div>
+    <h2>User Profile</h2>
+    <div v-if="isAuthenticated">
+      <p>Name: {{ parsedName }}</p>
+      <p>Email: {{ parsedEmail }}</p>
+      <button @click="sendUserData">Send User Data</button>
+    </div>
+  </div>
+</template>
+
+<script>
+import { useAuth0 } from '@auth0/auth0-vue';
+import axios from 'axios';
+
+export default {
+  setup() {
+    const { user, isAuthenticated } = useAuth0();
+    console.log(user);
+    const userJsonString = JSON.stringify(user, null, 2);
+    console.log(userJsonString);
+    const parsedUser = JSON.parse(userJsonString);
+    const parsedName = parsedUser._value.name;
+    const parsedEmail = parsedUser._value.email;
+
+    const sendUserData = async () => {
+      try {
+        const response = await axios.post('https://5ctsolryl1.execute-api.us-east-1.amazonaws.com/prod/create', {
+          name: parsedName,
+          email: parsedEmail
+        });
+
+        console.log('POST Request Response:', response.data);
+      } catch (error) {
+        console.error('Error sending POST request:', error);
+      }
+    };
+
+    return {
+      isAuthenticated,
+      parsedName,
+      parsedEmail,
+      sendUserData
+    };
+  }
+};
+</script>
diff --git a/src/views/ScheduleView.vue b/src/views/ScheduleView.vue
index f290450..1a199ab 100644
--- a/src/views/ScheduleView.vue
+++ b/src/views/ScheduleView.vue
@@ -21,6 +21,8 @@
   </template>
   
   <script>
+  import { useAuth0 } from '@auth0/auth0-vue';
+  
   export default {
     data() {
       return {
diff --git a/src/views/Test.vue b/src/views/Test.vue
new file mode 100644
index 0000000..959195c
--- /dev/null
+++ b/src/views/Test.vue
@@ -0,0 +1,29 @@
+<template>
+  <div>
+    <header>Login Page</header>
+    <div>
+      <button v-if="!isAuthenticated" @click="handleLogin">Log in</button>
+      <button v-if="isAuthenticated" @click="handleLogout">Log out</button>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { useAuth0 } from "@auth0/auth0-vue";
+
+const { isAuthenticated, loginWithRedirect, logout } = useAuth0();
+
+const handleLogin = () => {
+  loginWithRedirect({
+    appState: {
+      target: "/profile",
+    },
+  });
+};
+
+const handleLogout = () => {
+  logout({
+    returnTo: window.location.origin,
+  });
+};
+</script>