diff --git a/client/.eslintcache b/client/.eslintcache
new file mode 100644
index 0000000..5422669
--- /dev/null
+++ b/client/.eslintcache
@@ -0,0 +1 @@
+[{"C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\index.js":"1","C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\App.js":"2","C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\reportWebVitals.js":"3","C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\components\\Navbar\\Navbar.js":"4","C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\components\\Navbar\\MenuItems.js":"5","C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\components\\Register\\Register.js":"6","C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\components\\Login\\Login.js":"7","C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\components\\Home\\Home.js":"8","C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\components\\Util\\Button.js":"9","C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\components\\Class\\Class.js":"10"},{"size":613,"mtime":1615474800656,"results":"11","hashOfConfig":"12"},{"size":668,"mtime":1615570989606,"results":"13","hashOfConfig":"12"},{"size":375,"mtime":1615396420906,"results":"14","hashOfConfig":"12"},{"size":1110,"mtime":1615570470215,"results":"15","hashOfConfig":"12"},{"size":411,"mtime":1615474800655,"results":"16","hashOfConfig":"12"},{"size":1130,"mtime":1615479044482,"results":"17","hashOfConfig":"12"},{"size":944,"mtime":1615479021222,"results":"18","hashOfConfig":"12"},{"size":1878,"mtime":1615571248882,"results":"19","hashOfConfig":"12"},{"size":614,"mtime":1615478991709,"results":"20","hashOfConfig":"12"},{"size":1511,"mtime":1615572404265,"results":"21","hashOfConfig":"12"},{"filePath":"22","messages":"23","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"24"},"2p51na",{"filePath":"25","messages":"26","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"27","messages":"28","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"24"},{"filePath":"29","messages":"30","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"24"},{"filePath":"31","messages":"32","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"24"},{"filePath":"33","messages":"34","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"35","usedDeprecatedRules":"24"},{"filePath":"36","messages":"37","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"38","usedDeprecatedRules":"24"},{"filePath":"39","messages":"40","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"41","messages":"42","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"24"},{"filePath":"43","messages":"44","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},"C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\index.js",[],["45","46"],"C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\App.js",["47"],"C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\reportWebVitals.js",[],"C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\components\\Navbar\\Navbar.js",[],"C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\components\\Navbar\\MenuItems.js",[],"C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\components\\Register\\Register.js",["48"],"import React, { useState } from 'react'\r\nimport './Register.css'\r\n\r\nconst Register = () => {\r\n    return (\r\n        <div className='register'>\r\n            <div className='register-flex-container'>\r\n                <div className='register-white-box'>\r\n                    <h1 className='register-heading'>Create your account</h1>\r\n                    <form>\r\n                        <input className='register-form-input' type=\"email\" placeholder=\"Email\"></input>\r\n                        <br />\r\n                        <input className='register-form-input' type=\"text\" placeholder=\"Full Name\"></input>\r\n                        <br />\r\n                        <input className='register-form-input' type=\"password\" placeholder=\"Password\"></input>\r\n                        <br />\r\n                        <input className='register-form-submit' type=\"submit\" value=\"Create Account\"></input>\r\n                    </form>\r\n                    <p className=\"register-alt-signin\">Have an account? <b><a href='./#'>Sign in.</a></b></p>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    )\r\n}\r\n\r\nexport default Register;","C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\components\\Login\\Login.js",["49"],"import React, { useState } from 'react'\r\nimport './Login.css'\r\n\r\nconst Login = () => {\r\n    return (\r\n        <div className='login'>\r\n            <div className='login-flex-container'>\r\n                <div className='login-white-box'>\r\n                    <h1 className='login-heading'>Sign in</h1>\r\n                    <form>\r\n                        <input className='login-form-input' type=\"email\" placeholder=\"Email\"></input>\r\n                        <br />\r\n                        <input className='login-form-input' type=\"password\" placeholder=\"Password\"></input>\r\n                        <br />\r\n                        <input className='login-form-submit' type=\"submit\" value=\"Sign in\"></input>\r\n                    </form>\r\n                    <p className=\"login-alt-signin\">Don't have an account? <b><a href='./#'>Register.</a></b></p>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    )\r\n}\r\n\r\nexport default Login;","C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\components\\Home\\Home.js",["50"],"C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\components\\Util\\Button.js",[],"C:\\Users\\Ryanh\\Desktop\\Side_projects\\chausters\\client\\src\\components\\Class\\Class.js",["51","52","53"],{"ruleId":"54","replacedBy":"55"},{"ruleId":"56","replacedBy":"57"},{"ruleId":"58","severity":1,"message":"59","line":7,"column":8,"nodeType":"60","messageId":"61","endLine":7,"endColumn":14},{"ruleId":"58","severity":1,"message":"62","line":1,"column":17,"nodeType":"60","messageId":"61","endLine":1,"endColumn":25},{"ruleId":"58","severity":1,"message":"62","line":1,"column":17,"nodeType":"60","messageId":"61","endLine":1,"endColumn":25},{"ruleId":"58","severity":1,"message":"62","line":1,"column":17,"nodeType":"60","messageId":"61","endLine":1,"endColumn":25},{"ruleId":"58","severity":1,"message":"62","line":1,"column":17,"nodeType":"60","messageId":"61","endLine":1,"endColumn":25},{"ruleId":"58","severity":1,"message":"63","line":5,"column":9,"nodeType":"60","messageId":"61","endLine":5,"endColumn":13},{"ruleId":"58","severity":1,"message":"64","line":5,"column":15,"nodeType":"60","messageId":"61","endLine":5,"endColumn":24},"no-native-reassign",["65"],"no-negated-in-lhs",["66"],"no-unused-vars","'Navbar' is defined but never used.","Identifier","unusedVar","'useState' is defined but never used.","'Link' is defined but never used.","'useParams' is defined but never used.","no-global-assign","no-unsafe-negation"]
\ No newline at end of file
diff --git a/client/package-lock.json b/client/package-lock.json
index 0e815b9..abe57d2 100644
--- a/client/package-lock.json
+++ b/client/package-lock.json
@@ -1659,6 +1659,25 @@
         }
       }
     },
+    "@popperjs/core": {
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.9.1.tgz",
+      "integrity": "sha512-DvJbbn3dUgMxDnJLH+RZQPnXak1h4ZVYQ7CWiFWjQwBFkVajT4rfw2PdpHLTSTwxrYfnoEXkuBiwkDm6tPMQeA=="
+    },
+    "@restart/context": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/@restart/context/-/context-2.1.4.tgz",
+      "integrity": "sha512-INJYZQJP7g+IoDUh/475NlGiTeMfwTXUEr3tmRneckHIxNolGOW9CTq83S8cxq0CgJwwcMzMJFchxvlwe7Rk8Q=="
+    },
+    "@restart/hooks": {
+      "version": "0.3.26",
+      "resolved": "https://registry.npmjs.org/@restart/hooks/-/hooks-0.3.26.tgz",
+      "integrity": "sha512-7Hwk2ZMYm+JLWcb7R9qIXk1OoUg1Z+saKWqZXlrvFwT3w6UArVNWgxYOzf+PJoK9zZejp8okPAKTctthhXLt5g==",
+      "requires": {
+        "lodash": "^4.17.20",
+        "lodash-es": "^4.17.20"
+      }
+    },
     "@rollup/plugin-node-resolve": {
       "version": "7.1.3",
       "resolved": "https://registry.npmjs.org/@rollup/plugin-node-resolve/-/plugin-node-resolve-7.1.3.tgz",
@@ -1936,6 +1955,11 @@
         "@babel/types": "^7.3.0"
       }
     },
+    "@types/classnames": {
+      "version": "2.2.11",
+      "resolved": "https://registry.npmjs.org/@types/classnames/-/classnames-2.2.11.tgz",
+      "integrity": "sha512-2koNhpWm3DgWRp5tpkiJ8JGc1xTn2q0l+jUNUE7oMKXUf5NpI9AIdC4kbjGNFBdHtcxBD18LAksoudAVhFKCjw=="
+    },
     "@types/eslint": {
       "version": "7.2.6",
       "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-7.2.6.tgz",
@@ -1972,6 +1996,11 @@
       "resolved": "https://registry.npmjs.org/@types/html-minifier-terser/-/html-minifier-terser-5.1.1.tgz",
       "integrity": "sha512-giAlZwstKbmvMk1OO7WXSj4OZ0keXAcl2TQq4LWHiiPH2ByaH7WeUzng+Qej8UPxxv+8lRTuouo0iaNDBuzIBA=="
     },
+    "@types/invariant": {
+      "version": "2.2.34",
+      "resolved": "https://registry.npmjs.org/@types/invariant/-/invariant-2.2.34.tgz",
+      "integrity": "sha512-lYUtmJ9BqUN688fGY1U1HZoWT1/Jrmgigx2loq4ZcJpICECm/Om3V314BxdzypO0u5PORKGMM6x0OXaljV1YFg=="
+    },
     "@types/istanbul-lib-coverage": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.3.tgz",
@@ -2037,11 +2066,34 @@
       "resolved": "https://registry.npmjs.org/@types/prettier/-/prettier-2.2.1.tgz",
       "integrity": "sha512-DxZZbyMAM9GWEzXL+BMZROWz9oo6A9EilwwOMET2UVu2uZTqMWS5S69KVtuVKaRjCUpcrOXRalet86/OpG4kqw=="
     },
+    "@types/prop-types": {
+      "version": "15.7.3",
+      "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.3.tgz",
+      "integrity": "sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw=="
+    },
     "@types/q": {
       "version": "1.5.4",
       "resolved": "https://registry.npmjs.org/@types/q/-/q-1.5.4.tgz",
       "integrity": "sha512-1HcDas8SEj4z1Wc696tH56G8OlRaH/sqZOynNNB+HF0WOeXPaxTtbYzJY2oEfiUxjSKjhCKr+MvR7dCHcEelug=="
     },
+    "@types/react": {
+      "version": "17.0.3",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.3.tgz",
+      "integrity": "sha512-wYOUxIgs2HZZ0ACNiIayItyluADNbONl7kt8lkLjVK8IitMH5QMyAh75Fwhmo37r1m7L2JaFj03sIfxBVDvRAg==",
+      "requires": {
+        "@types/prop-types": "*",
+        "@types/scheduler": "*",
+        "csstype": "^3.0.2"
+      }
+    },
+    "@types/react-transition-group": {
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.1.tgz",
+      "integrity": "sha512-vIo69qKKcYoJ8wKCJjwSgCTM+z3chw3g18dkrDfVX665tMH7tmbDxEAnPdey4gTlwZz5QuHGzd+hul0OVZDqqQ==",
+      "requires": {
+        "@types/react": "*"
+      }
+    },
     "@types/resolve": {
       "version": "0.0.8",
       "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.8.tgz",
@@ -2050,6 +2102,11 @@
         "@types/node": "*"
       }
     },
+    "@types/scheduler": {
+      "version": "0.16.1",
+      "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.1.tgz",
+      "integrity": "sha512-EaCxbanVeyxDRTQBkdLb3Bvl/HK7PBK6UJjsSixB0iHKoWxE5uu2Q/DgtpOhPIojN0Zl1whvOd7PoHs2P0s5eA=="
+    },
     "@types/source-list-map": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/@types/source-list-map/-/source-list-map-0.1.2.tgz",
@@ -2081,6 +2138,11 @@
         "source-map": "^0.6.1"
       }
     },
+    "@types/warning": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/@types/warning/-/warning-3.0.0.tgz",
+      "integrity": "sha1-DSUBJorY+ZYrdA04fEZU9fjiPlI="
+    },
     "@types/webpack": {
       "version": "4.41.26",
       "resolved": "https://registry.npmjs.org/@types/webpack/-/webpack-4.41.26.tgz",
@@ -2738,6 +2800,14 @@
       "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.1.2.tgz",
       "integrity": "sha512-V+Nq70NxKhYt89ArVcaNL9FDryB3vQOd+BFXZIfO3RP6rwtj+2yqqqdHEkacutglPaZLkJeuXKCjCJDMGPtPqg=="
     },
+    "axios": {
+      "version": "0.21.1",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz",
+      "integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==",
+      "requires": {
+        "follow-redirects": "^1.10.0"
+      }
+    },
     "axobject-query": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz",
@@ -3296,6 +3366,11 @@
       "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
       "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
     },
+    "bootstrap": {
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.6.0.tgz",
+      "integrity": "sha512-Io55IuQY3kydzHtbGvQya3H+KorS/M9rSNyfCGCg9WZ4pyT/lCxIlpJgG1GXW/PswzC84Tr2fBYi+7+jFVQQBw=="
+    },
     "brace-expansion": {
       "version": "1.1.11",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
@@ -3684,6 +3759,11 @@
         }
       }
     },
+    "classnames": {
+      "version": "2.2.6",
+      "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.6.tgz",
+      "integrity": "sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q=="
+    },
     "clean-css": {
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.2.3.tgz",
@@ -4447,6 +4527,11 @@
         }
       }
     },
+    "csstype": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.7.tgz",
+      "integrity": "sha512-KxnUB0ZMlnUWCsx2Z8MUsr6qV6ja1w9ArPErJaJaF8a5SOWoHLIszeCTKGRGRgtLgYrs1E8CHkNSP1VZTTPc9g=="
+    },
     "cyclist": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-1.0.1.tgz",
@@ -4776,6 +4861,15 @@
         "utila": "~0.4"
       }
     },
+    "dom-helpers": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.0.tgz",
+      "integrity": "sha512-Ru5o9+V8CpunKnz5LGgWXkmrH/20cGKwcHwS4m73zIvs54CN9epEmT/HLqFJW3kXpakAFkEdzgy1hzlJe3E4OQ==",
+      "requires": {
+        "@babel/runtime": "^7.8.7",
+        "csstype": "^3.0.2"
+      }
+    },
     "dom-serializer": {
       "version": "0.2.2",
       "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.2.2.tgz",
@@ -6740,6 +6834,19 @@
       "resolved": "https://registry.npmjs.org/hex-color-regex/-/hex-color-regex-1.1.0.tgz",
       "integrity": "sha512-l9sfDFsuqtOqKDsQdqrMRk0U85RZc0RtOR9yPI7mRVOa4FsR/BVnZ0shmQRM96Ji99kYZP/7hn1cedc1+ApsTQ=="
     },
+    "history": {
+      "version": "4.10.1",
+      "resolved": "https://registry.npmjs.org/history/-/history-4.10.1.tgz",
+      "integrity": "sha512-36nwAD620w12kuzPAsyINPWJqlNbij+hpK1k9XRloDtym8mxzGYl2c17LnV6IAGB2Dmg4tEa7G7DlawS0+qjew==",
+      "requires": {
+        "@babel/runtime": "^7.1.2",
+        "loose-envify": "^1.2.0",
+        "resolve-pathname": "^3.0.0",
+        "tiny-invariant": "^1.0.2",
+        "tiny-warning": "^1.0.0",
+        "value-equal": "^1.0.1"
+      }
+    },
     "hmac-drbg": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/hmac-drbg/-/hmac-drbg-1.0.1.tgz",
@@ -6750,6 +6857,21 @@
         "minimalistic-crypto-utils": "^1.0.1"
       }
     },
+    "hoist-non-react-statics": {
+      "version": "3.3.2",
+      "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
+      "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
+      "requires": {
+        "react-is": "^16.7.0"
+      },
+      "dependencies": {
+        "react-is": {
+          "version": "16.13.1",
+          "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
+          "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
+        }
+      }
+    },
     "hoopy": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/hoopy/-/hoopy-0.1.4.tgz",
@@ -7222,6 +7344,14 @@
         "side-channel": "^1.0.4"
       }
     },
+    "invariant": {
+      "version": "2.2.4",
+      "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
+      "integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==",
+      "requires": {
+        "loose-envify": "^1.0.0"
+      }
+    },
     "ip": {
       "version": "1.1.5",
       "resolved": "https://registry.npmjs.org/ip/-/ip-1.1.5.tgz",
@@ -8747,6 +8877,11 @@
       "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
       "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
     },
+    "lodash-es": {
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
+      "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw=="
+    },
     "lodash._reinterpolate": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
@@ -9001,6 +9136,15 @@
       "resolved": "https://registry.npmjs.org/min-indent/-/min-indent-1.0.1.tgz",
       "integrity": "sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg=="
     },
+    "mini-create-react-context": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/mini-create-react-context/-/mini-create-react-context-0.4.1.tgz",
+      "integrity": "sha512-YWCYEmd5CQeHGSAKrYvXgmzzkrvssZcuuQDDeqkT+PziKGMgE+0MCCtcKbROzocGBG1meBLl2FotlRwf4gAzbQ==",
+      "requires": {
+        "@babel/runtime": "^7.12.1",
+        "tiny-warning": "^1.0.3"
+      }
+    },
     "mini-css-extract-plugin": {
       "version": "0.11.3",
       "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-0.11.3.tgz",
@@ -11147,6 +11291,22 @@
         }
       }
     },
+    "prop-types-extra": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/prop-types-extra/-/prop-types-extra-1.1.1.tgz",
+      "integrity": "sha512-59+AHNnHYCdiC+vMwY52WmvP5dM3QLeoumYuEyceQDi9aEhtwN9zIQ2ZNo25sMyXnbh32h+P1ezDsUpUH3JAew==",
+      "requires": {
+        "react-is": "^16.3.2",
+        "warning": "^4.0.0"
+      },
+      "dependencies": {
+        "react-is": {
+          "version": "16.13.1",
+          "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
+          "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
+        }
+      }
+    },
     "proxy-addr": {
       "version": "2.0.6",
       "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.6.tgz",
@@ -11330,6 +11490,31 @@
         "whatwg-fetch": "^3.4.1"
       }
     },
+    "react-bootstrap": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/react-bootstrap/-/react-bootstrap-1.5.1.tgz",
+      "integrity": "sha512-jbJNGx9n4JvKgxlvT8DLKSeF3VcqnPJXS9LFdzoZusiZCCGoYecZ9qSCBH5n2A+kjmuura9JkvxI9l7HD+bIdQ==",
+      "requires": {
+        "@babel/runtime": "^7.4.2",
+        "@restart/context": "^2.1.4",
+        "@restart/hooks": "^0.3.21",
+        "@types/classnames": "^2.2.10",
+        "@types/invariant": "^2.2.33",
+        "@types/prop-types": "^15.7.3",
+        "@types/react": ">=16.9.35",
+        "@types/react-transition-group": "^4.4.0",
+        "@types/warning": "^3.0.0",
+        "classnames": "^2.2.6",
+        "dom-helpers": "^5.1.2",
+        "invariant": "^2.2.4",
+        "prop-types": "^15.7.2",
+        "prop-types-extra": "^1.1.0",
+        "react-overlays": "^5.0.0",
+        "react-transition-group": "^4.4.1",
+        "uncontrollable": "^7.0.0",
+        "warning": "^4.0.3"
+      }
+    },
     "react-dev-utils": {
       "version": "11.0.2",
       "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-11.0.2.tgz",
@@ -11507,11 +11692,82 @@
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.1.tgz",
       "integrity": "sha512-NAnt2iGDXohE5LI7uBnLnqvLQMtzhkiAOLXTmv+qnF9Ky7xAPcX8Up/xWIhxvLVGJvuLiNc4xQLtuqDRzb4fSA=="
     },
+    "react-lifecycles-compat": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
+      "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
+    },
+    "react-overlays": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/react-overlays/-/react-overlays-5.0.0.tgz",
+      "integrity": "sha512-TKbqfAv23TFtCJ2lzISdx76p97G/DP8Rp4TOFdqM9n8GTruVYgE3jX7Zgb8+w7YJ18slTVcDTQ1/tFzdCqjVhA==",
+      "requires": {
+        "@babel/runtime": "^7.12.1",
+        "@popperjs/core": "^2.5.3",
+        "@restart/hooks": "^0.3.25",
+        "@types/warning": "^3.0.0",
+        "dom-helpers": "^5.2.0",
+        "prop-types": "^15.7.2",
+        "uncontrollable": "^7.0.0",
+        "warning": "^4.0.3"
+      }
+    },
     "react-refresh": {
       "version": "0.8.3",
       "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.8.3.tgz",
       "integrity": "sha512-X8jZHc7nCMjaCqoU+V2I0cOhNW+QMBwSUkeXnTi8IPe6zaRWfn60ZzvFDZqWPfmSJfjub7dDW1SP0jaHWLu/hg=="
     },
+    "react-router": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-5.2.0.tgz",
+      "integrity": "sha512-smz1DUuFHRKdcJC0jobGo8cVbhO3x50tCL4icacOlcwDOEQPq4TMqwx3sY1TP+DvtTgz4nm3thuo7A+BK2U0Dw==",
+      "requires": {
+        "@babel/runtime": "^7.1.2",
+        "history": "^4.9.0",
+        "hoist-non-react-statics": "^3.1.0",
+        "loose-envify": "^1.3.1",
+        "mini-create-react-context": "^0.4.0",
+        "path-to-regexp": "^1.7.0",
+        "prop-types": "^15.6.2",
+        "react-is": "^16.6.0",
+        "tiny-invariant": "^1.0.2",
+        "tiny-warning": "^1.0.0"
+      },
+      "dependencies": {
+        "isarray": {
+          "version": "0.0.1",
+          "resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
+          "integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
+        },
+        "path-to-regexp": {
+          "version": "1.8.0",
+          "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.8.0.tgz",
+          "integrity": "sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA==",
+          "requires": {
+            "isarray": "0.0.1"
+          }
+        },
+        "react-is": {
+          "version": "16.13.1",
+          "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
+          "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
+        }
+      }
+    },
+    "react-router-dom": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.2.0.tgz",
+      "integrity": "sha512-gxAmfylo2QUjcwxI63RhQ5G85Qqt4voZpUXSEqCwykV0baaOTQDR1f0PmY8AELqIyVc0NEZUj0Gov5lNGcXgsA==",
+      "requires": {
+        "@babel/runtime": "^7.1.2",
+        "history": "^4.9.0",
+        "loose-envify": "^1.3.1",
+        "prop-types": "^15.6.2",
+        "react-router": "5.2.0",
+        "tiny-invariant": "^1.0.2",
+        "tiny-warning": "^1.0.0"
+      }
+    },
     "react-scripts": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-4.0.1.tgz",
@@ -11578,6 +11834,17 @@
         "workbox-webpack-plugin": "5.1.4"
       }
     },
+    "react-transition-group": {
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.1.tgz",
+      "integrity": "sha512-Djqr7OQ2aPUiYurhPalTrVy9ddmFCCzwhqQmtN+J3+3DzLO209Fdr70QrN8Z3DsglWql6iY1lDWAfpFiBtuKGw==",
+      "requires": {
+        "@babel/runtime": "^7.5.5",
+        "dom-helpers": "^5.0.1",
+        "loose-envify": "^1.4.0",
+        "prop-types": "^15.6.2"
+      }
+    },
     "read-pkg": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
@@ -11948,6 +12215,11 @@
       "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
       "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g=="
     },
+    "resolve-pathname": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/resolve-pathname/-/resolve-pathname-3.0.0.tgz",
+      "integrity": "sha512-C7rARubxI8bXFNB/hqcp/4iUeIXJhJZvFPFPiSPRnhU5UPxzMFIl+2E6yY6c4k9giDJAhtV+enfA+G89N6Csng=="
+    },
     "resolve-url": {
       "version": "0.2.1",
       "resolved": "https://registry.npmjs.org/resolve-url/-/resolve-url-0.2.1.tgz",
@@ -13699,6 +13971,16 @@
       "resolved": "https://registry.npmjs.org/timsort/-/timsort-0.3.0.tgz",
       "integrity": "sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q="
     },
+    "tiny-invariant": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.1.0.tgz",
+      "integrity": "sha512-ytxQvrb1cPc9WBEI/HSeYYoGD0kWnGEOR8RY6KomWLBVhqz0RgTwVO9dLrGz7dC+nN9llyI7OKAgRq8Vq4ZBSw=="
+    },
+    "tiny-warning": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz",
+      "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA=="
+    },
     "tmpl": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/tmpl/-/tmpl-1.0.4.tgz",
@@ -13881,6 +14163,17 @@
         "is-typedarray": "^1.0.0"
       }
     },
+    "uncontrollable": {
+      "version": "7.2.1",
+      "resolved": "https://registry.npmjs.org/uncontrollable/-/uncontrollable-7.2.1.tgz",
+      "integrity": "sha512-svtcfoTADIB0nT9nltgjujTi7BzVmwjZClOmskKu/E8FW9BXzg9os8OLr4f8Dlnk0rYWJIWr4wv9eKUXiQvQwQ==",
+      "requires": {
+        "@babel/runtime": "^7.6.3",
+        "@types/react": ">=16.9.11",
+        "invariant": "^2.2.4",
+        "react-lifecycles-compat": "^3.0.4"
+      }
+    },
     "unicode-canonical-property-names-ecmascript": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-1.0.4.tgz",
@@ -14174,6 +14467,11 @@
         "spdx-expression-parse": "^3.0.0"
       }
     },
+    "value-equal": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/value-equal/-/value-equal-1.0.1.tgz",
+      "integrity": "sha512-NOJ6JZCAWr0zlxZt+xqCHNTEKOsrks2HQd4MqhP1qy4z1SkbEP467eNx6TgDKXMvUOb+OENfJCZwM+16n7fRfw=="
+    },
     "vary": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
@@ -14223,6 +14521,14 @@
         "makeerror": "1.0.x"
       }
     },
+    "warning": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
+      "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
+      "requires": {
+        "loose-envify": "^1.0.0"
+      }
+    },
     "watchpack": {
       "version": "1.7.5",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.7.5.tgz",
diff --git a/client/package.json b/client/package.json
index bbe7714..5fc3037 100644
--- a/client/package.json
+++ b/client/package.json
@@ -6,7 +6,10 @@
     "@testing-library/jest-dom": "^5.11.4",
     "@testing-library/react": "^11.1.0",
     "@testing-library/user-event": "^12.1.10",
+    "axios": "^0.21.1",
+    "bootstrap": "^4.6.0",
     "react": "^17.0.1",
+    "react-bootstrap": "^1.5.1",
     "react-dom": "^17.0.1",
     "react-router-dom": "^5.2.0",
     "react-scripts": "4.0.1",
diff --git a/client/src/App.js b/client/src/App.js
index ce594ac..a430245 100644
--- a/client/src/App.js
+++ b/client/src/App.js
@@ -1,8 +1,11 @@
 
 import './App.css';
-import Register from './components/Register';
-import Login from './components/Login';
-import Home from './components/Home';
+import Register from './components/Register/Register';
+import Login from './components/Login/Login';
+import Home from './components/Home/Home';
+import Class from './components/Class/Class';
+import Navbar from "./components/Navbar/Navbar";
+
 import {Switch, Route} from 'react-router-dom';
 
 function App() {
@@ -12,17 +15,10 @@ function App() {
         <Route exact path='/' component={Home}/>
         <Route path='/login' component={Login}/>
         <Route path='/register' component={Register}/>
+        <Route path = '/class/:id' component = {Class} />
       </Switch>
-import Navbar from "./components/Navbar/Navbar";
-import Register from "./components/Register";
-
-function App() {
-  return (
-    <div>
-      <Navbar />
-      <Register />
     </div>
-  );
+  )
 }
 
 export default App;
diff --git a/client/src/components/Class/Class.css b/client/src/components/Class/Class.css
new file mode 100644
index 0000000..1653203
--- /dev/null
+++ b/client/src/components/Class/Class.css
@@ -0,0 +1,10 @@
+/* --------------- IMPORTS --------------- */
+@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro&display=swap');
+
+
+/* --------------- GENERAL --------------- */
+.classView {
+  width: 100vw;
+  height: 100vh;
+  font-family: 'Source Sans Pro', sans-serif;
+}
\ No newline at end of file
diff --git a/client/src/components/Class/Class.js b/client/src/components/Class/Class.js
new file mode 100644
index 0000000..e656c52
--- /dev/null
+++ b/client/src/components/Class/Class.js
@@ -0,0 +1,65 @@
+import React, { useState, Component } from 'react';
+import './Class.css';
+import 'bootstrap/dist/css/bootstrap.min.css';
+import axios from 'axios';
+import {Link, useParams} from 'react-router-dom';
+
+class Class extends Component  {
+  //Constructor
+  constructor(props){
+    super(props);
+
+    this.state = {
+      className:"",
+      assignments:[{}], 
+      grades: [{}]
+    };
+  }
+
+  //Component Life Cycle methods
+  componentDidMount() {
+    let id = this.props.match.params.id;
+    let api_key = "";
+    
+    //Getting the specific class based on id
+    axios.get(`http://localhost:5000/getCourse/${api_key}/${id}`)
+    .then((response) => {
+      let course = response.data;
+
+      this.setState({className: course.name});
+    })
+    .catch((err) => {
+      console.log(err);
+    });
+
+    //Getting the class assignments
+
+  }
+
+  //Event Listeners
+
+  //Render 
+  render() {
+
+    return (
+      <div className = "classView">
+        <div class = "container">
+         <div className = "row pt-4">
+              <div className = "col-md-10 offset-1 mt-4 pt-5">
+
+                {/* HEADING SECTION */}
+                <div className = "headingWrapper p-2 pt-3 mb-5">
+                  <h4 className = "text-center">{this.state.className}</h4>
+                </div>
+              </div>
+
+              {/* CLASS SECTION */}
+
+          </div>  
+        </div>  
+      </div>
+    )
+  }
+}
+
+export default Class;
\ No newline at end of file
diff --git a/client/src/components/Home.js b/client/src/components/Home.js
deleted file mode 100644
index 7fd9861..0000000
--- a/client/src/components/Home.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import React, { useState } from 'react'
-
-const Home = () => {
-    return (
-        <div className='home'>
-            
-        </div>
-    )
-}
-
-export default Home;
\ No newline at end of file
diff --git a/client/src/components/Home/Home.js b/client/src/components/Home/Home.js
new file mode 100644
index 0000000..ee905c1
--- /dev/null
+++ b/client/src/components/Home/Home.js
@@ -0,0 +1,71 @@
+import React, { useState, Component } from 'react';
+import './home.css';
+import 'bootstrap/dist/css/bootstrap.min.css';
+import axios from 'axios';
+import {Link} from 'react-router-dom';
+
+class Home extends Component  {
+  //Constructor
+  constructor(props){
+    super(props);
+
+    this.state = {
+      courses: [{}]
+    };
+  }
+
+  //Component Life Cycle methods
+  componentDidMount() {
+    let api_key = "";
+
+    axios.get(`http://localhost:5000/getCourses/${api_key}`)
+    .then((response) => {
+      let courses = response.data;
+
+      this.setState({courses: courses});
+    })
+    .catch((err) => {
+      console.log(err);
+    });
+  }
+
+  //Event Listeners
+
+  //Render 
+  render() {
+
+    return (
+      <div className='home'>
+        <div className = "container">
+            <div className = "row pt-4">
+              <div className = "col-md-10 offset-1 mt-4 pt-5">
+
+                {/* HEADING SECTION */}
+                <div className = "headingWrapper p-2 pt-3 mb-5">
+                  <h4 className = "text-center">Classes</h4>
+                </div>
+                
+                {/* COURSES */}
+                <div className = "row text-center mt-4 pt-5">
+                  {
+                    this.state.courses.map((course) => {
+                      return (
+                        <div className = "col-md-4">
+                          <div className = "classItem mx-auto p-5">
+                            <Link to = {`class/${course.id}`}><h5 className = "className">{course.name}</h5></Link>
+                          </div>
+                        </div>
+                      );
+                    })
+                  }
+                </div>
+
+              </div>
+            </div>
+        </div>  
+      </div>
+    )
+  }
+}
+
+export default Home;
\ No newline at end of file
diff --git a/client/src/components/Home/home.css b/client/src/components/Home/home.css
new file mode 100644
index 0000000..6aa3c92
--- /dev/null
+++ b/client/src/components/Home/home.css
@@ -0,0 +1,42 @@
+/* --------------- IMPORTS --------------- */
+@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro&display=swap');
+
+
+/* --------------- GENERAL --------------- */
+.home{
+  width: 100vw;
+  height: 100vh;
+  font-family: 'Source Sans Pro', sans-serif;
+}
+
+/* HEADER */
+.headingWrapper {
+  border-radius: 50px;
+  background: radial-gradient(76.75% 76.75% at 50% 46.9%, rgba(255, 255, 255, 0.72) 0%, rgba(236, 236, 236, 0.684625) 58.96%, rgba(223, 223, 223, 0.66) 100%);
+}
+
+/* CLASSES */
+.classItem {
+  height:250px;
+  width:250px;
+  border-radius:50%;
+  background: radial-gradient(76.75% 76.75% at 50% 46.9%, rgba(255, 255, 255, 0.72) 0%, rgba(236, 236, 236, 0.684625) 58.96%, rgba(223, 223, 223, 0.66) 100%);
+}
+
+.classItem:hover {
+  background-color:#ffffff;
+  cursor:pointer;
+  color:black;
+}
+
+.className {
+  position:absolute;
+  top:50%;
+  left:50%;
+  transform:translate(-50%, -50%);
+}
+
+
+
+
+
diff --git a/client/src/components/Login.css b/client/src/components/Login/Login.css
similarity index 99%
rename from client/src/components/Login.css
rename to client/src/components/Login/Login.css
index 0661ea6..6f22747 100644
--- a/client/src/components/Login.css
+++ b/client/src/components/Login/Login.css
@@ -21,7 +21,6 @@
     padding: 20px 80px 20px 80px;
     border-radius: 50px;
     background: radial-gradient(76.75% 76.75% at 50% 46.9%, rgba(255, 255, 255, 0.72) 0%, rgba(236, 236, 236, 0.684625) 58.96%, rgba(223, 223, 223, 0.66) 100%);
-
 }
 .login-form-input{
     margin: 15px;
diff --git a/client/src/components/Login.js b/client/src/components/Login/Login.js
similarity index 100%
rename from client/src/components/Login.js
rename to client/src/components/Login/Login.js
diff --git a/client/src/components/Navbar/Navbar.js b/client/src/components/Navbar/Navbar.js
index 26ae117..937f780 100644
--- a/client/src/components/Navbar/Navbar.js
+++ b/client/src/components/Navbar/Navbar.js
@@ -1,6 +1,6 @@
 import React, { Component } from "react";
 import { MenuItems } from "./MenuItems";
-import { Button } from "../Button";
+import { Button } from "../Util/Button";
 import "./Navbar.css";
 
 class Navbar extends Component {
diff --git a/client/src/components/Register.css b/client/src/components/Register/Register.css
similarity index 100%
rename from client/src/components/Register.css
rename to client/src/components/Register/Register.css
diff --git a/client/src/components/Register.js b/client/src/components/Register/Register.js
similarity index 100%
rename from client/src/components/Register.js
rename to client/src/components/Register/Register.js
diff --git a/client/src/components/Button.css b/client/src/components/Util/Button.css
similarity index 100%
rename from client/src/components/Button.css
rename to client/src/components/Util/Button.css
diff --git a/client/src/components/Button.js b/client/src/components/Util/Button.js
similarity index 100%
rename from client/src/components/Button.js
rename to client/src/components/Util/Button.js
diff --git a/client/src/hoc/Auxiliary.js b/client/src/hoc/Auxiliary.js
new file mode 100644
index 0000000..384fec4
--- /dev/null
+++ b/client/src/hoc/Auxiliary.js
@@ -0,0 +1,5 @@
+const Aux = (props) => {
+  return props.chilren;
+}
+
+export default Aux;
\ No newline at end of file
diff --git a/server/index.js b/server/index.js
index 18d5fc0..78dd7dd 100644
--- a/server/index.js
+++ b/server/index.js
@@ -1,26 +1,46 @@
-require("dotenv").config();
-
+//IMPORTS
 const express = require("express");
 const axios = require("axios");
+const cors = require("cors");
 require("dotenv").config();
 
+//APP Configuration
 const app = express();
+app.use(cors());
 
 
 const TOKEN = process.env.CANVAS_API;
 
-app.get("/getCourses", async (req, res) => {
-    axios
-        .get(
-            `https://canvas.ucsd.edu/api/v1/courses?access_token=${TOKEN}&enrollment_state=active`
-        )
-        .then((response) => {
-            res.send(response.data);
-        })
-        .catch((err) => console.log(err));
+app.get("/getCourses/:token", async (req, res) => {
+
+  let token = req.params.token;
+
+  axios
+      .get(
+          `https://canvas.ucsd.edu/api/v1/courses?access_token=${token}&enrollment_state=active`
+      )
+      .then((response) => {
+          res.send(response.data);
+      })
+      .catch((err) => console.log(err));
+});
+
+app.get("/getCourse/:token/:id", async(req, res) => {
+  let token = req.params.token;
+  let courseId = req.params.id; 
+
+  axios
+      .get(
+          `https://canvas.ucsd.edu/api/v1/courses/${courseId}?access_token=${token}&enrollment_state=active`
+      )
+      .then((response) => {
+          res.send(response.data);
+      })
+      .catch((err) => console.log(err));
+
 });
 
-app.get("/:courseId/getAssignments", async (req, res) => {
+app.get("/:token/:courseId/getAssignments", async (req, res) => {
     const courseId = req.params.courseId;
 
     axios
@@ -33,7 +53,7 @@ app.get("/:courseId/getAssignments", async (req, res) => {
         .catch((err) => console.log(err));
 });
 
-app.get("/:userId/getGrades/:courseId", async (req, res) => {
+app.get("/:token/:userId/getGrades/:courseId", async (req, res) => {
     const userId = req.params.userId;
     const courseId = parseInt(req.params.courseId);
 
@@ -54,8 +74,6 @@ app.get("/:userId/getGrades/:courseId", async (req, res) => {
 });
 
 const PORT = process.env.PORT || 5000;
-
-app.listen(PORT, () => console.log(`Server started on port ${PORT}`));
 const dbUrl = process.env.DB_URL;
 
 const mongoose = require("mongoose");
@@ -70,6 +88,4 @@ connection.once("open", () => {
     console.log("Database connected");
 });
 
-app.listen(3000, () => {
-    console.log("APP IS LISTENING ON PORT 3000!");
-});
+app.listen(PORT, () => console.log(`Server started on port ${PORT}`));
diff --git a/server/package-lock.json b/server/package-lock.json
index 3c3f3c7..6399867 100644
--- a/server/package-lock.json
+++ b/server/package-lock.json
@@ -117,6 +117,15 @@
       "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
       "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
     },
+    "cors": {
+      "version": "2.8.5",
+      "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz",
+      "integrity": "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g==",
+      "requires": {
+        "object-assign": "^4",
+        "vary": "^1"
+      }
+    },
     "debug": {
       "version": "2.6.9",
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
@@ -396,6 +405,11 @@
       "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.2.tgz",
       "integrity": "sha512-hZXc7K2e+PgeI1eDBe/10Ard4ekbfrrqG8Ep+8Jmf4JID2bNg7NvCPOZN+kfF574pFQI7mum2AUqDidoKqcTOw=="
     },
+    "object-assign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
+    },
     "on-finished": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",
diff --git a/server/package.json b/server/package.json
index 8488729..165e939 100644
--- a/server/package.json
+++ b/server/package.json
@@ -11,8 +11,7 @@
   "license": "ISC",
   "dependencies": {
     "axios": "^0.21.1",
-    "dotenv": "^8.2.0",
-    "express": "^4.17.1"
+    "cors": "^2.8.5",
     "dotenv": "^8.2.0",
     "express": "^4.17.1",
     "mongoose": "^5.11.15"