diff --git a/frontend/src/contexts/AuthContext.tsx b/frontend/src/contexts/AuthContext.tsx
index 78b6d25..4b34852 100644
--- a/frontend/src/contexts/AuthContext.tsx
+++ b/frontend/src/contexts/AuthContext.tsx
@@ -8,12 +8,12 @@ import {
 
 export type User = {
     name: string;
-    email: string;
+    pass: string;
 };
 
 export type AuthContextProps = {
     getUser: () => User | null;
-    login: () => void;
+    login: (arg0: string, arg1: string) => void;
     logout: () => void;
     isLoggedIn: () => boolean;
 };
@@ -30,14 +30,14 @@ export function useAuth() {
 }
 
 export function AuthProvider({ children }: { children: ReactElement }) {
-    const [user, setUser] = useState<User | null>(null);
+    const [user, setUser] = useState<User | null>(null);    
 
-    const login = useCallback(() => {
+    const login = useCallback((name: string, pass: string) => {
         setUser({
-            name: 'John Doe',
-            email: '',
+            name: name,
+            pass: pass,
         });
-    }, []);
+    }, [setUser]);
 
     const logout = useCallback(() => {
         setUser(null);
diff --git a/frontend/src/pages/Home.tsx b/frontend/src/pages/Home.tsx
index 237e8c7..93e42d3 100644
--- a/frontend/src/pages/Home.tsx
+++ b/frontend/src/pages/Home.tsx
@@ -20,7 +20,7 @@ const Home: React.FC = () => {
     const auth = useAuth();
 
     const handleLogin = () => {
-        auth.login();
+        navigate('/login');
     };
 
     const handleLogout = () => {
diff --git a/frontend/src/pages/Login.tsx b/frontend/src/pages/Login.tsx
index bf760ac..72a45d2 100644
--- a/frontend/src/pages/Login.tsx
+++ b/frontend/src/pages/Login.tsx
@@ -1,15 +1,17 @@
-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
 import Button from '../library/button';
 import Input from '../library/input';
 import Navbar from '../Navbar';
 import { Link } from 'react-router-dom';
+import { useAuth } from '../contexts/AuthContext';
 import '../index.css';
 
 const Login: React.FC = () => {
-    const [email, setEmail] = useState('');
+    const [name, setName] = useState('');
     const [password, setPassword] = useState('');
     const [isLoggedIn, setIsLoggedIn] = useState(false);
     const [username, setUsername] = useState('');
+    const auth = useAuth();
     
     const handleLogin = () => {
         setUsername('Username_7');
@@ -21,89 +23,99 @@ const Login: React.FC = () => {
         setIsLoggedIn(false);
     };
 
-    const handleEmailChange = (event: React.ChangeEvent<HTMLInputElement>) => {
-        setEmail(event.target.value);
+    const handleNameChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+        setName(event.target.value);
     };
 
     const handlePasswordChange = (event: React.ChangeEvent<HTMLInputElement>) => {
         setPassword(event.target.value);
     };
 
+
     const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
         event.preventDefault();
         console.log('Form submitted');
-        // Handle form submission logic here
+        auth.login(name, password)
     };
 
+    useEffect(() => {
+        const user = auth.getUser();
+        console.log(user);
+        setIsLoggedIn(auth.isLoggedIn());
+        console.log(isLoggedIn);
+    }, [auth, auth.getUser()]);
+
     return (
-        <div className='min-h-screen bg-uno-bg bg-cover bg-center flex flex-col relative'>
-            <Navbar
-                isLoggedIn={true}                   //true here so that navbar does not render signin/login button
-                username={username}
-                onLogin={handleLogin}
-                onLogout={handleLogout}
-            />
-            <div className=' w-full flex justify-center items-center grow'>
-                <div className='flex flex-col justify-center items-center'>
-                <div className='flex justify-center'>
-                    <Button
-                        buttonSize="w-96 h-12"
-                        py="py-0"
-                        textColor="text-white"
-                        text="Login using Google"
-                        backgroundColor="bg-gray-300"
-                        hoverColor="hover:bg-gray-500"
-                        className='border-4 m-2 rounded-full'
-                        fontSize=' text-2xl'
-                    />
-                </div>
-                <div className='w-96 h-1 bg-neutral-300 my-3'></div>
-                <div>
-                    <form onSubmit={handleSubmit} className=''>
-                        <div className=''>
-                            <div className=' my-3'>
-                                <Input
-                                    id="email"
-                                    type="text"
-                                    onChange={handleEmailChange}
-                                    placeholder="Email Address"
-                                    width = "96"
-                                    height= "12"
-                                />
-                            </div>
-                            <div className='my-3'>
-                                <Input
-                                    id="pass"
-                                    type="password"
-                                    onChange={handlePasswordChange}
-                                    placeholder="Password"
-                                    width = "96"
-                                    height= "12"
-                                />
+        <>
+            <div className='min-h-screen bg-uno-bg bg-cover bg-center flex flex-col relative'>
+                <Navbar
+                    isLoggedIn={true}                   //true here so that navbar does not render signin/login button
+                    username={username}
+                    onLogin={handleLogin}
+                    onLogout={handleLogout}
+                />
+                <div className=' w-full flex justify-center items-center grow'>
+                    <div className='flex flex-col justify-center items-center'>
+                    <div className='flex justify-center'>
+                        <Button
+                            buttonSize="w-96 h-12"
+                            py="py-0"
+                            textColor="text-white"
+                            text="Login using Google"
+                            backgroundColor="bg-gray-300"
+                            hoverColor="hover:bg-gray-500"
+                            className='border-4 m-2 rounded-full'
+                            fontSize=' text-2xl'
+                        />
+                    </div>
+                    <div className='w-96 h-1 bg-neutral-300 my-3'></div>
+                    <div>
+                        <form onSubmit={handleSubmit} className=''>
+                            <div className=''>
+                                <div className=' my-3'>
+                                    <Input
+                                        id="email"
+                                        type="text"
+                                        onChange={handleNameChange}
+                                        placeholder="Enter Username"
+                                        width = "96"
+                                        height= "12"
+                                    />
+                                </div>
+                                <div className='my-3'>
+                                    <Input
+                                        id="pass"
+                                        type="password"
+                                        onChange={handlePasswordChange}
+                                        placeholder="Password"
+                                        width = "96"
+                                        height= "12"
+                                    />
+                                </div>
+                                <div className='flex justify-center'>
+                                    <Button
+                                        text="Login"
+                                        textColor="text-white"
+                                        py='0'
+                                        buttonSize="w-32 h-10"
+                                        className='border-4 rounded-full'
+                                        fontSize='text-2xl'
+                                        type='submit'
+                                    />
+                                </div>
                             </div>
-                            <div className='flex justify-center'>
-                                <Button
-                                    text="Login"
-                                    textColor="text-white"
-                                    py='0'
-                                    buttonSize="w-32 h-10"
-                                    className='border-4 rounded-full'
-                                    fontSize='text-2xl'
-                                    type='submit'
-                                />
+                        </form>
+                        <div>
+                            <div className='font-kavoon flex justify-center items-center my-3'>
+                                Don't have an account? <Link to="/signin" className=' text-blue-700 '> Sign in</Link>
                             </div>
                         </div>
-                    </form>
-                    <div>
-                        <div className='font-kavoon flex justify-center items-center my-3'>
-                            Don't have an account? <Link to="/signin" className=' text-blue-700 '> Sign in</Link>
-                        </div>
                     </div>
-                </div>
+                    </div>
                 </div>
             </div>
-            
-        </div>
+        </>
+        
     );
 };