diff --git a/app/firebase/components/GithubSignInButton.tsx b/app/firebase/components/GithubSignInButton.tsx
new file mode 100644
index 0000000..326d49c
--- /dev/null
+++ b/app/firebase/components/GithubSignInButton.tsx
@@ -0,0 +1,34 @@
+// components/SignInWithGithub.js
+import React from 'react';
+import { auth } from '@/app/firebase/config';
+import { getAuth, GithubAuthProvider,signInWithPopup } from 'firebase/auth';
+interface GoogleSignInButtonProps {
+    onLoginSuccess?: (user: any) => void; // Callback function when login succeeds
+  }
+const SignInWithGithub : React.FC<GoogleSignInButtonProps> = ({ onLoginSuccess }) => {
+  const provider = new GithubAuthProvider();
+
+  const handleGithubSignIn = async () => {
+    try {
+      // Sign in with GitHub using Firebase Auth
+      const result = await signInWithPopup(auth, provider);
+
+      // Get the signed-in user info
+      const user = result.user;
+      console.log('GitHub User:', user);
+    } catch (error) {
+      console.error("Error during GitHub sign-in:", error);
+    }
+  };
+
+  return (
+    <button
+      onClick={handleGithubSignIn}
+      className="w-full py-3 bg-gray-800 text-white rounded-md hover:bg-gray-700 transition duration-300"
+    >
+      Sign in with GitHub
+    </button>
+  );
+};
+
+export default SignInWithGithub;
\ No newline at end of file
diff --git a/app/firebase/components/GoogleSignInButton.tsx b/app/firebase/components/GoogleSignInButton.tsx
index 316c2c8..f55d258 100644
--- a/app/firebase/components/GoogleSignInButton.tsx
+++ b/app/firebase/components/GoogleSignInButton.tsx
@@ -3,8 +3,8 @@ import React from 'react';
 import { getAuth, GoogleAuthProvider, signInWithPopup } from 'firebase/auth';
 import { auth } from '@/app/firebase/config';
 interface GoogleSignInButtonProps {
-    onLoginSuccess?: (user: any) => void; // Callback function when login succeeds
-  }
+  onLoginSuccess?: (user: any) => void; // Callback function when login succeeds
+}
   
 const GoogleSignInButton: React.FC<GoogleSignInButtonProps> = ({ onLoginSuccess }) => {
   const provider = new GoogleAuthProvider();
diff --git a/app/login/page.tsx b/app/login/page.tsx
index 7271a1f..704ba3f 100644
--- a/app/login/page.tsx
+++ b/app/login/page.tsx
@@ -5,6 +5,7 @@ import { signInWithEmailAndPassword, createUserWithEmailAndPassword } from 'fire
 import GoogleSignInButton from '../firebase/components/GoogleSignInButton';
 import { useRouter } from 'next/navigation';
 import { LoginSologin, RegisterSologin } from '../sologin';
+import SignInWithGithub from '../firebase/components/GithubSignInButton';
 
 const AuthTabs = () => {
   const [activeTab, setActiveTab] = useState<'signin' | 'signup'>('signin');
@@ -115,6 +116,7 @@ const AuthTabs = () => {
         <div className='h-10'></div>
 
         <GoogleSignInButton onLoginSuccess={onAuthSuccess}></GoogleSignInButton>
+        <SignInWithGithub onLoginSuccess={onAuthSuccess}></SignInWithGithub>
       </div>
 
       {/* Error Dialog */}
diff --git a/package.json b/package.json
index 587c856..c2c44be 100644
--- a/package.json
+++ b/package.json
@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "dev": "next dev",
+    "dev": "next dev -p 3977",
     "build": "next build",
     "start": "next start",
     "lint": "next lint"