diff --git a/FlashCardApp b/FlashCardApp
new file mode 160000
index 0000000..8c66c25
--- /dev/null
+++ b/FlashCardApp
@@ -0,0 +1 @@
+Subproject commit 8c66c254cc0e715a4ac19748c5d3c45f9ac86e7a
diff --git a/package-lock.json b/package-lock.json
deleted file mode 100644
index 982fdaa..0000000
--- a/package-lock.json
+++ /dev/null
@@ -1,147 +0,0 @@
-{
-  "name": "FlashCardApp",
-  "lockfileVersion": 3,
-  "requires": true,
-  "packages": {
-    "": {
-      "dependencies": {
-        "mongodb": "^6.13.0"
-      }
-    },
-    "node_modules/@mongodb-js/saslprep": {
-      "version": "1.1.9",
-      "resolved": "https://registry.npmjs.org/@mongodb-js/saslprep/-/saslprep-1.1.9.tgz",
-      "integrity": "sha512-tVkljjeEaAhCqTzajSdgbQ6gE6f3oneVwa3iXR6csiEwXXOFsiC6Uh9iAjAhXPtqa/XMDHWjjeNH/77m/Yq2dw==",
-      "dependencies": {
-        "sparse-bitfield": "^3.0.3"
-      }
-    },
-    "node_modules/@types/webidl-conversions": {
-      "version": "7.0.3",
-      "resolved": "https://registry.npmjs.org/@types/webidl-conversions/-/webidl-conversions-7.0.3.tgz",
-      "integrity": "sha512-CiJJvcRtIgzadHCYXw7dqEnMNRjhGZlYK05Mj9OyktqV8uVT8fD2BFOB7S1uwBE3Kj2Z+4UyPmFw/Ixgw/LAlA=="
-    },
-    "node_modules/@types/whatwg-url": {
-      "version": "11.0.5",
-      "resolved": "https://registry.npmjs.org/@types/whatwg-url/-/whatwg-url-11.0.5.tgz",
-      "integrity": "sha512-coYR071JRaHa+xoEvvYqvnIHaVqaYrLPbsufM9BF63HkwI5Lgmy2QR8Q5K/lYDYo5AK82wOvSOS0UsLTpTG7uQ==",
-      "dependencies": {
-        "@types/webidl-conversions": "*"
-      }
-    },
-    "node_modules/bson": {
-      "version": "6.10.2",
-      "resolved": "https://registry.npmjs.org/bson/-/bson-6.10.2.tgz",
-      "integrity": "sha512-5afhLTjqDSA3akH56E+/2J6kTDuSIlBxyXPdQslj9hcIgOUE378xdOfZvC/9q3LifJNI6KR/juZ+d0NRNYBwXg==",
-      "engines": {
-        "node": ">=16.20.1"
-      }
-    },
-    "node_modules/memory-pager": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/memory-pager/-/memory-pager-1.5.0.tgz",
-      "integrity": "sha512-ZS4Bp4r/Zoeq6+NLJpP+0Zzm0pR8whtGPf1XExKLJBAczGMnSi3It14OiNCStjQjM6NU1okjQGSxgEZN8eBYKg=="
-    },
-    "node_modules/mongodb": {
-      "version": "6.13.0",
-      "resolved": "https://registry.npmjs.org/mongodb/-/mongodb-6.13.0.tgz",
-      "integrity": "sha512-KeESYR5TEaFxOuwRqkOm3XOsMqCSkdeDMjaW5u2nuKfX7rqaofp7JQGoi7sVqQcNJTKuveNbzZtWMstb8ABP6Q==",
-      "dependencies": {
-        "@mongodb-js/saslprep": "^1.1.9",
-        "bson": "^6.10.1",
-        "mongodb-connection-string-url": "^3.0.0"
-      },
-      "engines": {
-        "node": ">=16.20.1"
-      },
-      "peerDependencies": {
-        "@aws-sdk/credential-providers": "^3.188.0",
-        "@mongodb-js/zstd": "^1.1.0 || ^2.0.0",
-        "gcp-metadata": "^5.2.0",
-        "kerberos": "^2.0.1",
-        "mongodb-client-encryption": ">=6.0.0 <7",
-        "snappy": "^7.2.2",
-        "socks": "^2.7.1"
-      },
-      "peerDependenciesMeta": {
-        "@aws-sdk/credential-providers": {
-          "optional": true
-        },
-        "@mongodb-js/zstd": {
-          "optional": true
-        },
-        "gcp-metadata": {
-          "optional": true
-        },
-        "kerberos": {
-          "optional": true
-        },
-        "mongodb-client-encryption": {
-          "optional": true
-        },
-        "snappy": {
-          "optional": true
-        },
-        "socks": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/mongodb-connection-string-url": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/mongodb-connection-string-url/-/mongodb-connection-string-url-3.0.2.tgz",
-      "integrity": "sha512-rMO7CGo/9BFwyZABcKAWL8UJwH/Kc2x0g72uhDWzG48URRax5TCIcJ7Rc3RZqffZzO/Gwff/jyKwCU9TN8gehA==",
-      "dependencies": {
-        "@types/whatwg-url": "^11.0.2",
-        "whatwg-url": "^14.1.0 || ^13.0.0"
-      }
-    },
-    "node_modules/punycode": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
-      "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/sparse-bitfield": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/sparse-bitfield/-/sparse-bitfield-3.0.3.tgz",
-      "integrity": "sha512-kvzhi7vqKTfkh0PZU+2D2PIllw2ymqJKujUcyPMd9Y75Nv4nPbGJZXNhxsgdQab2BmlDct1YnfQCguEvHr7VsQ==",
-      "dependencies": {
-        "memory-pager": "^1.0.2"
-      }
-    },
-    "node_modules/tr46": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/tr46/-/tr46-5.0.0.tgz",
-      "integrity": "sha512-tk2G5R2KRwBd+ZN0zaEXpmzdKyOYksXwywulIX95MBODjSzMIuQnQ3m8JxgbhnL1LeVo7lqQKsYa1O3Htl7K5g==",
-      "dependencies": {
-        "punycode": "^2.3.1"
-      },
-      "engines": {
-        "node": ">=18"
-      }
-    },
-    "node_modules/webidl-conversions": {
-      "version": "7.0.0",
-      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz",
-      "integrity": "sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==",
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/whatwg-url": {
-      "version": "14.1.0",
-      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-14.1.0.tgz",
-      "integrity": "sha512-jlf/foYIKywAt3x/XWKZ/3rz8OSJPiWktjmk891alJUEjiVxKX9LEO92qH3hv4aJ0mN3MWPvGMCy8jQi95xK4w==",
-      "dependencies": {
-        "tr46": "^5.0.0",
-        "webidl-conversions": "^7.0.0"
-      },
-      "engines": {
-        "node": ">=18"
-      }
-    }
-  }
-}
diff --git a/package.json b/package.json
deleted file mode 100644
index cd2c096..0000000
--- a/package.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
-  "dependencies": {
-    "mongodb": "^6.13.0"
-  }
-}
diff --git a/src/flashcardapp/src/App.css b/src/flashcardapp/src/App.css
index 22462da..9dfef3d 100644
--- a/src/flashcardapp/src/App.css
+++ b/src/flashcardapp/src/App.css
@@ -54,26 +54,4 @@
   gap: 20px;
   justify-content: flex-start; /* Align flashcards to the left */
   padding: 10px; /* Optional padding inside the container */
-}
-
-/* So back and front of the card don't offset each other*/
-.card .front,
-.card .back {
-  position: absolute; /* Stack .front and .back on top of each other */
-  width: 100%;
-  height: 100%;
-  top: 0; /* Align to the top of the card */
-  left: 0; /* Align to the left of the card */
-  backface-visibility: hidden; /* Hide the back when the front is visible */
-  display: flex; /* Align text and options */
-  justify-content: center; /* Center content horizontally */
-  align-items: center; /* Center content vertically */
-  text-align: center;
-  font-size: 18px;
-  padding: 10px;
-  box-sizing: border-box; /* Include padding in width/height */
-}
-
-.card .back {
-  transform: rotateY(180deg);
-}
+}
\ No newline at end of file
diff --git a/src/flashcardapp/src/Components/flashcard/Flashcard.module.css b/src/flashcardapp/src/Components/flashcard/Flashcard.module.css
index 398f695..52e3ed0 100644
--- a/src/flashcardapp/src/Components/flashcard/Flashcard.module.css
+++ b/src/flashcardapp/src/Components/flashcard/Flashcard.module.css
@@ -98,4 +98,4 @@
   .card .back {
     transform: rotateY(180deg);
   }
-  
\ No newline at end of file
+  
diff --git a/src/flashcardapp/src/Views/accounts/Account.js b/src/flashcardapp/src/Views/accounts/Account.js
index 4077aba..c0711b2 100644
--- a/src/flashcardapp/src/Views/accounts/Account.js
+++ b/src/flashcardapp/src/Views/accounts/Account.js
@@ -33,6 +33,11 @@ const BADGES = [
 ];
 
 export default function ProfilePage() {
+    const [setName, setSetName] = useState('');
+    const [setDescription, setSetDescription] = useState('');
+    const [selectedCourse, setSelectedCourse] = useState('');
+    const [flashcards, setFlashcards] = useState([{ question: '', answer: '' }]);
+    const [showCreateSetModal, setShowCreateSetModal] = useState(false);
     const [activeSection, setActiveSection] = useState("profile");
     const [showModal, setShowModal] = useState(false);
     const [username, setUsername] = useState(""); // State for username input
@@ -58,6 +63,16 @@ export default function ProfilePage() {
         }
     };
 
+    const handleAddFlashcard = () => {
+        setFlashcards([...flashcards, { question: '', answer: '' }]);
+    };
+    
+    const handleFlashcardChange = (index, field, value) => {
+        const updatedFlashcards = [...flashcards];
+        updatedFlashcards[index][field] = value;
+        setFlashcards(updatedFlashcards);
+    };
+
     return (
         <Container fluid>
             {/* Profile Header */}
@@ -133,6 +148,106 @@ export default function ProfilePage() {
                 </Modal.Footer>
             </Modal>
 
+            {/* Create Set Modal */}
+            <Modal show={showCreateSetModal} onHide={() => setShowCreateSetModal(false)} centered size="lg">
+                <Modal.Header closeButton>
+                    <Modal.Title>Create New Flashcard Set</Modal.Title>
+                    </Modal.Header>
+                    <Modal.Body>
+                        <Form>
+                            {/* Set Name */}
+                            <Form.Group className="mb-3">
+                                <Form.Label>Set Name</Form.Label>
+                                <Form.Control
+                                    type="text"
+                                    placeholder="Enter set name"
+                                    value={setName}
+                                    onChange={(e) => setSetName(e.target.value)}
+                                />
+                            </Form.Group>
+                        {/* Description */}
+                        <Form.Group className="mb-3">
+                            <Form.Label>Description</Form.Label>
+                            <Form.Control 
+                                as="textarea" 
+                                rows={2} 
+                                placeholder="Enter set description"
+                                value={setDescription}
+                                onChange={(e) => setSetDescription(e.target.value)} 
+                            />
+                        </Form.Group>
+
+                        {/* Course Selection */}
+                        <Form.Group className="mb-4">
+                            <Form.Label>Course</Form.Label>
+                            <Form.Select 
+                                value={selectedCourse} 
+                                onChange={(e) => setSelectedCourse(e.target.value)}
+                            >
+                                <option value="">Select a course</option>
+                                {SAMPLE_COURSES.map((course) => (
+                                    <option key={course.id} value={course.course}>
+                                        {course.course}
+                                    </option>
+                                ))}
+                            </Form.Select>
+                        </Form.Group>
+
+                        {/* Flashcards Entry */}
+                        <div className="mb-3">
+                            <h6>Flashcards</h6>
+                            {flashcards.map((card, index) => (
+                                <Row key={index} className="mb-2">
+                                    <Col md={6}>
+                                        <Form.Control
+                                            placeholder={`Question #${index + 1}`}
+                                            value={card.question}
+                                            onChange={(e) => 
+                                                handleFlashcardChange(index, 'question', e.target.value)
+                                            }
+                                        />
+                                    </Col>
+                                    <Col md={6}>
+                                        <Form.Control
+                                            placeholder={`Answer #${index + 1}`}
+                                            value={card.answer}
+                                            onChange={(e) => 
+                                                handleFlashcardChange(index, 'answer', e.target.value)
+                                            }
+                                        />
+                                    </Col>
+                                </Row>
+                            ))}
+                            <Button 
+                                variant="outline-primary" 
+                                size="sm" 
+                                onClick={handleAddFlashcard}
+                                className="mt-2"
+                            >
+                                + Add Flashcard
+                            </Button>
+                        </div>
+                    </Form>
+                </Modal.Body>
+                <Modal.Footer>
+                    <Button variant="secondary" onClick={() => setShowCreateSetModal(false)}>
+                        Cancel
+                    </Button>
+                    <Button variant="primary" onClick={() => {
+                        // Handle submission here
+                        console.log({
+                            setName,
+                            setDescription,
+                            selectedCourse,
+                            flashcards
+                        });
+                        setShowCreateSetModal(false);
+                    }}>
+                        Create Set
+                    </Button>
+                </Modal.Footer>
+            </Modal>
+
             <Row>
                 {/* Sidebar Column */}
                 {/* Sidebar */}
@@ -200,7 +315,9 @@ export default function ProfilePage() {
                                             <a href="#">View all</a>
                                             <p className="mt-2">You don't have any projects yet.</p>
                                             <div className="mt-4"> {/* Pushes this to the bottom */}
-                                                <Button variant="primary">Create a Set</Button>
+                                            <Button variant="primary" onClick={() => setShowCreateSetModal(true)}>
+                                                Create a Set
+                                            </Button>
                                             </div>
                                         </Card>
                                     </Col>