diff --git a/src/frontend/src/contexts/authContext.tsx b/src/frontend/src/contexts/authContext.tsx
new file mode 100644
index 000000000..dc4ca52c9
--- /dev/null
+++ b/src/frontend/src/contexts/authContext.tsx
@@ -0,0 +1,77 @@
+import { createContext, useEffect, useState } from "react";
+import { AuthContextType, userData } from "../types/contexts/auth";
+
+const initialValue: AuthContextType = {
+  isAuthenticated: false,
+  accessToken: null,
+  login: () => {},
+  logout: () => {},
+  refreshAccessToken: () => Promise.resolve(),
+  userData: null,
+  setUserData: () => {},
+};
+
+const AuthContext = createContext<AuthContextType>(initialValue);
+
+export function AuthProvider({ children }): React.ReactElement {
+  const [accessToken, setAccessToken] = useState<string | null>(null);
+  const [userData, setUserData] = useState<userData>(null);
+
+  useEffect(() => {
+    const storedAccessToken = localStorage.getItem("access_token");
+    if (storedAccessToken) {
+      setAccessToken(storedAccessToken);
+    }
+  }, []);
+
+  function login(newAccessToken: string, refreshToken: string) {
+    localStorage.setItem("access_token", newAccessToken);
+    setAccessToken(newAccessToken);
+    // Store refreshToken if needed
+  }
+
+  function logout() {
+    localStorage.removeItem("access_token");
+    // Clear refreshToken if used
+    setAccessToken(null);
+  }
+
+  async function refreshAccessToken(refreshToken: string) {
+    try {
+      // Call your API to refresh the access token using the refresh token
+      const response = await fetch("/api/refresh-token", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+        },
+        body: JSON.stringify({ refreshToken }),
+      });
+
+      if (response.ok) {
+        const data = await response.json();
+        login(data.accessToken, refreshToken);
+      } else {
+        logout();
+      }
+    } catch (error) {
+      logout();
+    }
+  }
+
+  return (
+    // !! to convert string to boolean
+    <AuthContext.Provider
+      value={{
+        isAuthenticated: !!accessToken,
+        accessToken,
+        login,
+        logout,
+        refreshAccessToken,
+        setUserData,
+        userData,
+      }}
+    >
+      {children}
+    </AuthContext.Provider>
+  );
+}
diff --git a/src/frontend/src/types/contexts/auth.ts b/src/frontend/src/types/contexts/auth.ts
new file mode 100644
index 000000000..af037ecae
--- /dev/null
+++ b/src/frontend/src/types/contexts/auth.ts
@@ -0,0 +1,16 @@
+export type AuthContextType = {
+  isAuthenticated: boolean;
+  accessToken: string | null;
+  login: (accessToken: string, refreshToken: string) => void;
+  logout: () => void;
+  refreshAccessToken: (refreshToken: string) => Promise<void>;
+  userData: userData | null;
+  setUserData: (userData: userData | null) => void;
+};
+
+export type userData = {
+  id: string;
+  name: string;
+  email: string;
+  role: string;
+};