diff --git a/trivia-forge/frontend/package-lock.json b/trivia-forge/frontend/package-lock.json
index 0b28825e..6d389c95 100644
--- a/trivia-forge/frontend/package-lock.json
+++ b/trivia-forge/frontend/package-lock.json
@@ -10,6 +10,7 @@
       "dependencies": {
         "axios": "^1.6.8",
         "bootstrap": "^5.3.3",
+        "node-datetime": "^2.1.2",
         "openai": "^4.38.3",
         "react": "^18.2.0",
         "react-bootstrap": "^2.10.2",
@@ -3513,6 +3514,11 @@
       "integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==",
       "dev": true
     },
+    "node_modules/node-datetime": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/node-datetime/-/node-datetime-2.1.2.tgz",
+      "integrity": "sha512-eev1F0IPKSu3zvASMtH8ic4znGpfXdq9yc8yc/EVx6bk57u7bS2iZKVZ8ll1ZeH/IEQ3qFb04FB70PCNXSIp4w=="
+    },
     "node_modules/node-domexception": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/node-domexception/-/node-domexception-1.0.0.tgz",
@@ -7217,6 +7223,11 @@
       "integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==",
       "dev": true
     },
+    "node-datetime": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/node-datetime/-/node-datetime-2.1.2.tgz",
+      "integrity": "sha512-eev1F0IPKSu3zvASMtH8ic4znGpfXdq9yc8yc/EVx6bk57u7bS2iZKVZ8ll1ZeH/IEQ3qFb04FB70PCNXSIp4w=="
+    },
     "node-domexception": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/node-domexception/-/node-domexception-1.0.0.tgz",
diff --git a/trivia-forge/frontend/package.json b/trivia-forge/frontend/package.json
index e3c539bd..6ea5e672 100644
--- a/trivia-forge/frontend/package.json
+++ b/trivia-forge/frontend/package.json
@@ -12,6 +12,7 @@
   "dependencies": {
     "axios": "^1.6.8",
     "bootstrap": "^5.3.3",
+    "node-datetime": "^2.1.2",
     "openai": "^4.38.3",
     "react": "^18.2.0",
     "react-bootstrap": "^2.10.2",
diff --git a/trivia-forge/frontend/src/Pages/SignUpPage.jsx b/trivia-forge/frontend/src/Pages/SignUpPage.jsx
index d6225d32..29ff7bba 100644
--- a/trivia-forge/frontend/src/Pages/SignUpPage.jsx
+++ b/trivia-forge/frontend/src/Pages/SignUpPage.jsx
@@ -1,15 +1,40 @@
+import React, { useState } from 'react';
 import { useNavigate } from "react-router-dom";
 import { Form, Button, Card } from "react-bootstrap";
+import { addUser } from '../Services/TF-db_services';
 
 function SignUpPage() {
+    const [email, setEmail] = useState('');
+    const [password, setPassword] = useState('');
+    const [confirmPassword, setConfirmPassword] = useState('');
+    const navigate = useNavigate();
+
+    const handleSubmit = async (event) => {
+        event.preventDefault();
+        if (password !== confirmPassword) {
+            alert('Passwords do not match');
+            return;
+        }
+        const user = {
+            email: email,
+            password: password
+        };
+        const addedUser = await addUser(user);
+        if (addedUser) {
+            alert('User added:', addedUser);
+            navigate('/');
+        } else {
+            console.error('Error adding user');
+        }
+    }
 
     return (
         <>
             <Card style={{ width: '35rem', margin: '0 auto', float: 'none' }}>
-                <Form className="form-group">
+                <Form onSubmit={handleSubmit} className="form-group">
                     <Form.Group className="mb-3" controlId="formBasicEmail">
                         <Form.Label>Email address</Form.Label>
-                        <Form.Control className="Form-Control" type="email" placeholder="Enter email" />
+                        <Form.Control type="email" placeholder="Enter email" value={email} onChange={(e) => setEmail(e.target.value)} />
                         <Form.Text className="text-muted">
                             We'll never share your email with anyone else.
                         </Form.Text>
@@ -17,20 +42,20 @@ function SignUpPage() {
 
                     <Form.Group className="mb-3" controlId="formBasicPassword">
                         <Form.Label>Password</Form.Label>
-                        <Form.Control type="password" placeholder="Password" />
+                        <Form.Control type="password" placeholder="Password" value={password} onChange={(e) => setPassword(e.target.value)} />
                     </Form.Group>
-                    <Form.Group className="mb-3" controlId="formBasicPassword">
+
+                    <Form.Group className="mb-3" controlId="formBasicConfirmPassword">
                         <Form.Label>Confirm Password</Form.Label>
-                        <Form.Control type="password" placeholder="Confirm Password" />
+                        <Form.Control type="password" placeholder="Confirm Password" value={confirmPassword} onChange={(e) => setConfirmPassword(e.target.value)} />
                     </Form.Group>
+
                     <Button variant="primary" type="submit">
                         Create Account
                     </Button>
                 </Form>
             </Card>
         </>
-
     );
-
 }
 export default SignUpPage;
\ No newline at end of file
diff --git a/trivia-forge/frontend/src/Pages/TriviaGenPage.jsx b/trivia-forge/frontend/src/Pages/TriviaGenPage.jsx
index ebae2e83..a68db140 100644
--- a/trivia-forge/frontend/src/Pages/TriviaGenPage.jsx
+++ b/trivia-forge/frontend/src/Pages/TriviaGenPage.jsx
@@ -76,12 +76,12 @@ function TriviaGenPage() {
         }
         //create a new game and category object and add category to game
         let game = new Game(Title, Theme);
-
+        
         for (let i = 0; i < categories.length; i++) {
             let newCategory = new Category(categories[i].name);
             console.log(newCategory.name);
             game.addCategory(newCategory);
-
+              
             //parse response from API
             let sections = responses[i]; // store trivia questions
             for (let i = 0; i < sections.length; i++) {
diff --git a/trivia-forge/frontend/src/Services/TF-db_services.jsx b/trivia-forge/frontend/src/Services/TF-db_services.jsx
index eb51b203..c33dbb9e 100644
--- a/trivia-forge/frontend/src/Services/TF-db_services.jsx
+++ b/trivia-forge/frontend/src/Services/TF-db_services.jsx
@@ -1,7 +1,7 @@
 import axios from 'axios';
-import User from '../Models/User';
-import Game from '../Models/Game';
-import Question from '../Models/Question';
+import User from '../Model/User';
+import Game from '../Model/Game';
+import Question from '../Model/Question';
 
 const API_URL = 'http://localhost:5000/api';