diff --git a/.gitignore b/.gitignore
index f626852..8955a6b 100644
--- a/.gitignore
+++ b/.gitignore
@@ -63,3 +63,6 @@ node_modules/
 
 # dotenv environment variables file
 .env
+
+# The keyfile for google services authentication
+twistter-e4649-firebase-adminsdk-pgjve-1e57494429.json
\ No newline at end of file
diff --git a/functions/index.js b/functions/index.js
index 9e93d49..7d0498a 100644
--- a/functions/index.js
+++ b/functions/index.js
@@ -24,4 +24,5 @@ app.post('/putPost', FBauth, putPost);
 // users routes
 app.get('/getUser/:handle', getUserDetails);
 
+
 exports.api = functions.https.onRequest(app);
\ No newline at end of file
diff --git a/functions/package-lock.json b/functions/package-lock.json
index 5fd98f7..fa0054c 100644
--- a/functions/package-lock.json
+++ b/functions/package-lock.json
@@ -331,8 +331,7 @@
     "@google-cloud/promisify": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/@google-cloud/promisify/-/promisify-1.0.2.tgz",
-      "integrity": "sha512-7WfV4R/3YV5T30WRZW0lqmvZy9hE2/p9MvpI34WuKa2Wz62mLu5XplGTFEMK6uTbJCLWUxTcZ4J4IyClKucE5g==",
-      "optional": true
+      "integrity": "sha512-7WfV4R/3YV5T30WRZW0lqmvZy9hE2/p9MvpI34WuKa2Wz62mLu5XplGTFEMK6uTbJCLWUxTcZ4J4IyClKucE5g=="
     },
     "@google-cloud/storage": {
       "version": "3.2.1",
@@ -519,7 +518,6 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/abort-controller/-/abort-controller-3.0.0.tgz",
       "integrity": "sha512-h8lQ8tacZYnR3vNQTgibj+tODHI5/+l06Au2Pcriv/Gmet0eaj4TwWH41sO9wnHDiQsEj19q0drzdWdeAHtweg==",
-      "optional": true,
       "requires": {
         "event-target-shim": "^5.0.0"
       }
@@ -549,7 +547,6 @@
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-4.3.0.tgz",
       "integrity": "sha512-salcGninV0nPrwpGNn4VTXBb1SOuXQBiqbrNXoeizJsHrsL6ERFM2Ne3JUSBWRE6aeNJI2ROP/WEEIDUiDe3cg==",
-      "optional": true,
       "requires": {
         "es6-promisify": "^5.0.0"
       }
@@ -604,8 +601,7 @@
     "arrify": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/arrify/-/arrify-2.0.1.tgz",
-      "integrity": "sha512-3duEwti880xqi4eAMN8AyR4a0ByT90zoYdLlevfrvU43vb0YZwZVfxOgxWrLXXXpyugL0hNZc9G6BiB5B3nUug==",
-      "optional": true
+      "integrity": "sha512-3duEwti880xqi4eAMN8AyR4a0ByT90zoYdLlevfrvU43vb0YZwZVfxOgxWrLXXXpyugL0hNZc9G6BiB5B3nUug=="
     },
     "ascli": {
       "version": "1.0.1",
@@ -631,14 +627,12 @@
     "base64-js": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.3.1.tgz",
-      "integrity": "sha512-mLQ4i2QO1ytvGWFWmcngKO//JXAQueZvwEKtjgQFM4jIK0kU+ytMfplL8j+n5mspOfjHwoAg+9yhb7BwAHm36g==",
-      "optional": true
+      "integrity": "sha512-mLQ4i2QO1ytvGWFWmcngKO//JXAQueZvwEKtjgQFM4jIK0kU+ytMfplL8j+n5mspOfjHwoAg+9yhb7BwAHm36g=="
     },
     "bignumber.js": {
       "version": "7.2.1",
       "resolved": "https://registry.npmjs.org/bignumber.js/-/bignumber.js-7.2.1.tgz",
-      "integrity": "sha512-S4XzBk5sMB+Rcb/LNcpzXr57VRTxgAvaAEDAl1AwRx27j00hT84O6OkteE7u8UB3NuaaygCRrEpqox4uDOrbdQ==",
-      "optional": true
+      "integrity": "sha512-S4XzBk5sMB+Rcb/LNcpzXr57VRTxgAvaAEDAl1AwRx27j00hT84O6OkteE7u8UB3NuaaygCRrEpqox4uDOrbdQ=="
     },
     "body-parser": {
       "version": "1.19.0",
@@ -934,8 +928,7 @@
     "core-util-is": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
-      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
-      "optional": true
+      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
     },
     "cors": {
       "version": "2.8.5",
@@ -983,7 +976,6 @@
       "version": "3.2.6",
       "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
       "integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
-      "optional": true,
       "requires": {
         "ms": "^2.1.1"
       }
@@ -1067,7 +1059,6 @@
       "version": "3.7.1",
       "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.7.1.tgz",
       "integrity": "sha512-07z8uv2wMyS51kKhD1KsdXJg5WQ6t93RneqRxUHnskXVtlYYkLqM0gqStQZ3pj073g687jPCHrqNfCzawLYh5g==",
-      "optional": true,
       "requires": {
         "end-of-stream": "^1.0.0",
         "inherits": "^2.0.1",
@@ -1078,14 +1069,12 @@
         "isarray": {
           "version": "1.0.0",
           "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
-          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
-          "optional": true
+          "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
         },
         "readable-stream": {
           "version": "2.3.6",
           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
           "integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==",
-          "optional": true,
           "requires": {
             "core-util-is": "~1.0.0",
             "inherits": "~2.0.3",
@@ -1099,14 +1088,12 @@
         "safe-buffer": {
           "version": "5.1.2",
           "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-          "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
-          "optional": true
+          "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="
         },
         "string_decoder": {
           "version": "1.1.1",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
           "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
-          "optional": true,
           "requires": {
             "safe-buffer": "~5.1.0"
           }
@@ -1149,7 +1136,6 @@
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.1.tgz",
       "integrity": "sha512-1MkrZNvWTKCaigbn+W15elq2BB/L22nqrSY5DKlo3X6+vclJm8Bb5djXJBmEX6fS3+zCh/F4VBK5Z2KxJt4s2Q==",
-      "optional": true,
       "requires": {
         "once": "^1.4.0"
       }
@@ -1163,14 +1149,12 @@
     "es6-promise": {
       "version": "4.2.8",
       "resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.2.8.tgz",
-      "integrity": "sha512-HJDGx5daxeIvxdBxvG2cb9g4tEvwIk3i8+nhX0yGrYmZUzbkdg8QbDevheDB8gd0//uPj4c1EQua8Q+MViT0/w==",
-      "optional": true
+      "integrity": "sha512-HJDGx5daxeIvxdBxvG2cb9g4tEvwIk3i8+nhX0yGrYmZUzbkdg8QbDevheDB8gd0//uPj4c1EQua8Q+MViT0/w=="
     },
     "es6-promisify": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/es6-promisify/-/es6-promisify-5.0.0.tgz",
       "integrity": "sha1-UQnWLz5W6pZ8S2NQWu8IKRyKUgM=",
-      "optional": true,
       "requires": {
         "es6-promise": "^4.0.3"
       }
@@ -1333,8 +1317,7 @@
     "event-target-shim": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/event-target-shim/-/event-target-shim-5.0.1.tgz",
-      "integrity": "sha512-i/2XbnSz/uxRCU6+NdVJgKWDTM427+MqYbkQzD321DuCQJUqOuJKIA0IM2+W2xtYHdKOmZ4dR6fExsd4SXL+WQ==",
-      "optional": true
+      "integrity": "sha512-i/2XbnSz/uxRCU6+NdVJgKWDTM427+MqYbkQzD321DuCQJUqOuJKIA0IM2+W2xtYHdKOmZ4dR6fExsd4SXL+WQ=="
     },
     "express": {
       "version": "4.17.1",
@@ -1396,8 +1379,7 @@
     "extend": {
       "version": "3.0.2",
       "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
-      "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==",
-      "optional": true
+      "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g=="
     },
     "external-editor": {
       "version": "3.1.0",
@@ -1431,8 +1413,7 @@
     "fast-text-encoding": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/fast-text-encoding/-/fast-text-encoding-1.0.0.tgz",
-      "integrity": "sha512-R9bHCvweUxxwkDwhjav5vxpFvdPGlVngtqmx4pIZfSUhM/Q4NiIUHB456BAf+Q1Nwu3HEZYONtu+Rya+af4jiQ==",
-      "optional": true
+      "integrity": "sha512-R9bHCvweUxxwkDwhjav5vxpFvdPGlVngtqmx4pIZfSUhM/Q4NiIUHB456BAf+Q1Nwu3HEZYONtu+Rya+af4jiQ=="
     },
     "faye-websocket": {
       "version": "0.11.3",
@@ -1643,7 +1624,6 @@
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/gaxios/-/gaxios-2.0.1.tgz",
       "integrity": "sha512-c1NXovTxkgRJTIgB2FrFmOFg4YIV6N/bAa4f/FZ4jIw13Ql9ya/82x69CswvotJhbV3DiGnlTZwoq2NVXk2Irg==",
-      "optional": true,
       "requires": {
         "abort-controller": "^3.0.0",
         "extend": "^3.0.2",
@@ -1655,7 +1635,6 @@
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/gcp-metadata/-/gcp-metadata-2.0.2.tgz",
       "integrity": "sha512-dxPXBvjyfz5qFEBXzEwNmuZXwsGYfuASGYeg3CKZDaQRXdiWti9J3/Ezmtyon1OrCNpDO2YekyoSjEqMtsrcXw==",
-      "optional": true,
       "requires": {
         "gaxios": "^2.0.1",
         "json-bigint": "^0.3.0"
@@ -1699,7 +1678,6 @@
       "version": "5.2.1",
       "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-5.2.1.tgz",
       "integrity": "sha512-p9vO6UcRIK/zD3PxoMijaUfFYu6tvzaQwvag1K/82O42NBeAnmllyQUgqaBhcAh9FzFAVlN4bQIaO8+prpE7Vg==",
-      "optional": true,
       "requires": {
         "arrify": "^2.0.0",
         "base64-js": "^1.3.0",
@@ -1736,7 +1714,6 @@
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/google-p12-pem/-/google-p12-pem-2.0.2.tgz",
       "integrity": "sha512-UfnEARfJKI6pbmC1hfFFm+UAcZxeIwTiEcHfqKe/drMsXD/ilnVjF7zgOGpHXyhuvX6jNJK3S8A0hOQjwtFxEw==",
-      "optional": true,
       "requires": {
         "node-forge": "^0.9.0"
       },
@@ -1744,8 +1721,7 @@
         "node-forge": {
           "version": "0.9.0",
           "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.9.0.tgz",
-          "integrity": "sha512-7ASaDa3pD+lJ3WvXFsxekJQelBKRpne+GOVbLbtHYdd7pFspyeuJHnWfLplGf3SwKGbfs/aYl5V/JCIaHVUKKQ==",
-          "optional": true
+          "integrity": "sha512-7ASaDa3pD+lJ3WvXFsxekJQelBKRpne+GOVbLbtHYdd7pFspyeuJHnWfLplGf3SwKGbfs/aYl5V/JCIaHVUKKQ=="
         }
       }
     },
@@ -2188,7 +2164,6 @@
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/gtoken/-/gtoken-4.0.0.tgz",
       "integrity": "sha512-XaRCfHJxhj06LmnWNBzVTAr85NfAErq0W1oabkdqwbq3uL/QTB1kyvGog361Uu2FMG/8e3115sIy/97Rnd4GjQ==",
-      "optional": true,
       "requires": {
         "gaxios": "^2.0.0",
         "google-p12-pem": "^2.0.0",
@@ -2244,8 +2219,7 @@
         "safe-buffer": {
           "version": "5.1.2",
           "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
-          "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==",
-          "optional": true
+          "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="
         },
         "string_decoder": {
           "version": "1.1.1",
@@ -2323,7 +2297,6 @@
       "version": "2.2.2",
       "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-2.2.2.tgz",
       "integrity": "sha512-c8Ndjc9Bkpfx/vCJueCPy0jlP4ccCCSNDp8xwCZzPjKJUm+B+u9WX2x98Qx4n1PiMNTWo3D7KK5ifNV/yJyRzg==",
-      "optional": true,
       "requires": {
         "agent-base": "^4.3.0",
         "debug": "^3.1.0"
@@ -2479,8 +2452,7 @@
     "is-typedarray": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
-      "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo=",
-      "optional": true
+      "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo="
     },
     "isarray": {
       "version": "0.0.1",
@@ -2534,7 +2506,6 @@
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/json-bigint/-/json-bigint-0.3.0.tgz",
       "integrity": "sha1-DM2RLEuCcNBfBW+9E4FLU9OCWx4=",
-      "optional": true,
       "requires": {
         "bignumber.js": "^7.0.0"
       }
@@ -2676,7 +2647,6 @@
       "version": "5.1.1",
       "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
       "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
-      "optional": true,
       "requires": {
         "yallist": "^3.0.2"
       }
@@ -2708,8 +2678,7 @@
     "mime": {
       "version": "2.4.4",
       "resolved": "https://registry.npmjs.org/mime/-/mime-2.4.4.tgz",
-      "integrity": "sha512-LRxmNwziLPT828z+4YkNzloCFC2YM4wrB99k+AV5ZbEyfGNWfG8SO1FUXLmLDBSo89NrJZ4DIWeLjy1CHGhMGA==",
-      "optional": true
+      "integrity": "sha512-LRxmNwziLPT828z+4YkNzloCFC2YM4wrB99k+AV5ZbEyfGNWfG8SO1FUXLmLDBSo89NrJZ4DIWeLjy1CHGhMGA=="
     },
     "mime-db": {
       "version": "1.41.0",
@@ -2798,8 +2767,7 @@
     "node-fetch": {
       "version": "2.6.0",
       "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.6.0.tgz",
-      "integrity": "sha512-8dG4H5ujfvFiqDmVu9fQ5bOHUC15JMjMY/Zumv26oOvvVJjM67KF8koCWIabKQ1GJIa9r2mMZscBq/TbdOcmNA==",
-      "optional": true
+      "integrity": "sha512-8dG4H5ujfvFiqDmVu9fQ5bOHUC15JMjMY/Zumv26oOvvVJjM67KF8koCWIabKQ1GJIa9r2mMZscBq/TbdOcmNA=="
     },
     "node-forge": {
       "version": "0.7.4",
@@ -2825,8 +2793,7 @@
     "object-keys": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz",
-      "integrity": "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==",
-      "optional": true
+      "integrity": "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA=="
     },
     "on-finished": {
       "version": "2.3.0",
@@ -2947,8 +2914,7 @@
     "process-nextick-args": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
-      "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag==",
-      "optional": true
+      "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag=="
     },
     "progress": {
       "version": "2.0.3",
@@ -3001,7 +2967,6 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.0.tgz",
       "integrity": "sha512-LwZy+p3SFs1Pytd/jYct4wpv49HiYCqd9Rlc5ZVdk0V+8Yzv6jR5Blk3TRmPL1ft69TxP0IMZGJ+WPFU2BFhww==",
-      "optional": true,
       "requires": {
         "end-of-stream": "^1.1.0",
         "once": "^1.3.1"
@@ -3011,7 +2976,6 @@
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/pumpify/-/pumpify-2.0.0.tgz",
       "integrity": "sha512-ieN9HmpFPt4J4U4qnjN4BxrnqpPPXJyp3qFErxfwBtFOec6ewpIHdS2eu3TkmGW6S+RzFGEOGpm5ih/X/onRPQ==",
-      "optional": true,
       "requires": {
         "duplexify": "^4.1.1",
         "inherits": "^2.0.3",
@@ -3022,7 +2986,6 @@
           "version": "4.1.1",
           "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-4.1.1.tgz",
           "integrity": "sha512-DY3xVEmVHTv1wSzKNbwoU6nVjzI369Y6sPoqfYr0/xlx3IdX2n94xIszTcjPO8W8ZIv0Wb0PXNcjuZyT4wiICA==",
-          "optional": true,
           "requires": {
             "end-of-stream": "^1.4.1",
             "inherits": "^2.0.3",
@@ -3034,7 +2997,6 @@
           "version": "3.4.0",
           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.4.0.tgz",
           "integrity": "sha512-jItXPLmrSR8jmTRmRWJXCnGJsfy85mB3Wd/uINMXA65yrnFo0cPClFIUWzo2najVNSl+mx7/4W8ttlLWJe99pQ==",
-          "optional": true,
           "requires": {
             "inherits": "^2.0.3",
             "string_decoder": "^1.1.1",
@@ -3045,7 +3007,6 @@
           "version": "1.3.0",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
           "integrity": "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==",
-          "optional": true,
           "requires": {
             "safe-buffer": "~5.2.0"
           }
@@ -3200,8 +3161,7 @@
     "semver": {
       "version": "6.3.0",
       "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
-      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
-      "optional": true
+      "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw=="
     },
     "send": {
       "version": "0.17.1",
@@ -3318,7 +3278,6 @@
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/stream-events/-/stream-events-1.0.5.tgz",
       "integrity": "sha512-E1GUzBSgvct8Jsb3v2X15pjzN1tYebtbLaMg+eBOUOAxgbLoSbT2NS91ckc5lJD1KfLjId+jXJRgo0qnV5Nerg==",
-      "optional": true,
       "requires": {
         "stubs": "^3.0.0"
       }
@@ -3326,8 +3285,7 @@
     "stream-shift": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/stream-shift/-/stream-shift-1.0.0.tgz",
-      "integrity": "sha1-1cdSgl5TZ+eG944Y5EXqIjoVWVI=",
-      "optional": true
+      "integrity": "sha1-1cdSgl5TZ+eG944Y5EXqIjoVWVI="
     },
     "streamsearch": {
       "version": "0.1.2",
@@ -3368,8 +3326,7 @@
     "stubs": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/stubs/-/stubs-3.0.0.tgz",
-      "integrity": "sha1-6NK6H6nJBXAwPAMLaQD31fiavls=",
-      "optional": true
+      "integrity": "sha1-6NK6H6nJBXAwPAMLaQD31fiavls="
     },
     "supports-color": {
       "version": "5.5.0",
@@ -3449,7 +3406,6 @@
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/through2/-/through2-3.0.1.tgz",
       "integrity": "sha512-M96dvTalPT3YbYLaKaCuwu+j06D/8Jfib0o/PxbVt6Amhv3dUAtW6rTV1jPgJSBG83I/e04Y6xkVdVhSRhi0ww==",
-      "optional": true,
       "requires": {
         "readable-stream": "2 || 3"
       },
@@ -3458,7 +3414,6 @@
           "version": "3.4.0",
           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.4.0.tgz",
           "integrity": "sha512-jItXPLmrSR8jmTRmRWJXCnGJsfy85mB3Wd/uINMXA65yrnFo0cPClFIUWzo2najVNSl+mx7/4W8ttlLWJe99pQ==",
-          "optional": true,
           "requires": {
             "inherits": "^2.0.3",
             "string_decoder": "^1.1.1",
@@ -3469,7 +3424,6 @@
           "version": "1.3.0",
           "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.3.0.tgz",
           "integrity": "sha512-hkRX8U1WjJFd8LsDJ2yQ/wWWxaopEsABU1XfkM8A+j0+85JAGppt16cr1Whg6KIbb4okU6Mql6BOj+uup/wKeA==",
-          "optional": true,
           "requires": {
             "safe-buffer": "~5.2.0"
           }
@@ -3554,8 +3508,7 @@
     "util-deprecate": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
-      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
-      "optional": true
+      "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
     },
     "utils-merge": {
       "version": "1.0.1",
@@ -3690,8 +3643,7 @@
     "xdg-basedir": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-4.0.0.tgz",
-      "integrity": "sha512-PSNhEJDejZYV7h50BohL09Er9VaIefr2LMAf3OEmpCkjOi34eYyQYAXUTjEQtZJTKcF0E2UKTh+osDLsgNim9Q==",
-      "optional": true
+      "integrity": "sha512-PSNhEJDejZYV7h50BohL09Er9VaIefr2LMAf3OEmpCkjOi34eYyQYAXUTjEQtZJTKcF0E2UKTh+osDLsgNim9Q=="
     },
     "xmlhttprequest": {
       "version": "1.8.0",
@@ -3711,8 +3663,7 @@
     "yallist": {
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.0.3.tgz",
-      "integrity": "sha512-S+Zk8DEWE6oKpV+vI3qWkaK+jSbIK86pCwe2IF/xwIpQ8jEuxpw9NyaGjmp9+BoJv5FV2piqCDcoCtStppiq2A==",
-      "optional": true
+      "integrity": "sha512-S+Zk8DEWE6oKpV+vI3qWkaK+jSbIK86pCwe2IF/xwIpQ8jEuxpw9NyaGjmp9+BoJv5FV2piqCDcoCtStppiq2A=="
     },
     "yargs": {
       "version": "3.32.0",
diff --git a/twistter-frontend/public/index.html b/twistter-frontend/public/index.html
index 6ecde9e..fd60d3a 100644
--- a/twistter-frontend/public/index.html
+++ b/twistter-frontend/public/index.html
@@ -5,6 +5,13 @@
   <head>
     <meta charset="utf-8">
     <title>Twistter</title>
+    <style>
+      body {
+        margin: 0;
+        padding: 0;
+        font-family: sans-serif;
+      }
+    </style>
   </head>
   
   <body>
diff --git a/twistter-frontend/src/App.js b/twistter-frontend/src/App.js
index c518ebb..378bf7f 100644
--- a/twistter-frontend/src/App.js
+++ b/twistter-frontend/src/App.js
@@ -1,181 +1,29 @@
 /* eslint-disable */
 import React, { Component } from 'react';
-import logo from './images/twistter-logo.png';
-import { BrowserRouter as Router, Route, Switch} from 'react-router-dom';
+
 import './App.css';
 
-//TODO: reorganize imports
+import { BrowserRouter as Router } from 'react-router-dom';
+import Route from 'react-router-dom/Route';
 
-//components
-import Navbar from './components/layout/NavBar';
 
-// pages
-import user from './pages/user';
-
-var validEmail = true;
-var validUsername = false;
-var validPassword = false;
-var passwordsMatch = false;
-
-const emailBlur = () => {
-  //var email = document.getElementById("email");
-
-  /*if() {
-    validEmail = true;
-  }
-  else {
-    validEmail = false;
-    alert("Email is invalid.");
-  }*/
-
-  if(validEmail && validUsername && validPassword && passwordsMatch) {
-    document.getElementById("submit").disabled = false;
-  }
-  else {
-    document.getElementById("submit").disabled = true;
-  }
-}
-
-const usernameBlur = () => {
-  var username = document.getElementById("username");
-
-  if(username.value.length >= 3 && username.value.length <= 50) {
-    validUsername = true;
-  }
-  else {
-    validUsername = false;
-    alert("Username must be between 3 and 50 characters long.");
-  }
-
-  if(validEmail && validUsername && validPassword && passwordsMatch) {
-    document.getElementById("submit").disabled = false;
-  }
-  else {
-    document.getElementById("submit").disabled = true;
-  }
-}
-
-const passwordBlur = () => {
-  var password = document.getElementById("password");
-
-  if(password.value.length >= 8 && password.value.length <= 20) {
-    validPassword = true;
-  }
-  else {
-    validPassword = false;
-    alert("Password must be between 8 and 20 characters long.");
-  }
-
-  if(validEmail && validUsername && validPassword && passwordsMatch) {
-    document.getElementById("submit").disabled = false;
-  }
-  else {
-    document.getElementById("submit").disabled = true;
-  }
-}
-
-const confirmPasswordBlur = () => {
-  var password = document.getElementById("password");
-  var confirmPassword = document.getElementById("confirmPassword");
-
-  if(password.value === confirmPassword.value) {
-    passwordsMatch = true;
-  }
-  else {
-    passwordsMatch = false;
-    alert("Passwords must match.");
-  }
-
-  if(validEmail && validUsername && validPassword && passwordsMatch) {
-    document.getElementById("submit").disabled = false;
-  }
-  else {
-    document.getElementById("submit").disabled = true;
-  }
-}
+import home from './Home.js';
+import register from './Register.js';
+import login from './Login.js';
 
 class App extends Component {
   render() {
     return (
       <Router>
-        <Navbar />
-        <div className='container'>
-          <Switch>
-          
-          
-          <Route path="/" exact render={
-            () => {
-              return (
-                <div>
-                  <div>
-                    <img src={logo} className="app-logo" alt="logo" />
-                    <br/><br/>
-                    <b>Welcome to Twistter!</b> 
-                    <br/><br/>
-                    <b>See the most interesting topics people are following right now.</b> 
-                  </div>
 
-                  <br/><br/><br/><br/>
 
-                  <div>                    
-                    <b>Join today or sign in if you already have an account.</b> 
-                    <br/><br/>
-                    <button class="authButtons register"><a href="/register">Sign up</a></button> 
-                    <br/><br/>
-                    <button class="authButtons login"><a href="/login">Sign in</a></button>
-                  </div>
-                </div>
-              )
-            }
-          }/>
+        <div className="app">
+          <Route exact path="/" component={home}/>
+          <Route exact path="/register" component={register}/>
+          <Route exact path="/login" component={login}/>
+          <Route exact path="/user" component={user}/>
+        </div>
 
-          <Route path="/register" exact render={
-            () => {
-              return (
-                <div>
-                  <img src={logo} className="app-logo" alt="logo" />
-                  <br/><br/>
-                  <b>Create your account</b>
-                  <br/><br/>
-                  <input class="authInput" id="email" placeholder="Email" onBlur={() => emailBlur()}></input>
-                  <br/><br/>
-                  <input class="authInput" id="username" placeholder="Username" onBlur={() => usernameBlur()}></input>
-                  <br/><br/>
-                  <input class="authInput" id="password" placeholder="Password" onBlur={() => passwordBlur()}></input>
-                  <br/><br/>
-                  <input class="authInput" id="confirmPassword" placeholder="Confirm Password" onBlur={() => confirmPasswordBlur()}></input>
-                  <br/><br/>
-                  <button class="authButtons register" id="submit" onclick="" disabled>Sign up</button>
-                </div>
-              )
-            }
-          }/>
-
-          <Route path="/login" exact render={
-            () => {
-              return (
-                <div>
-                  <img src={logo} className="app-logo" alt="logo" />
-                  <br/><br/>
-                  <b>Log in to Twistter</b>
-                  <br/><br/>
-                  <input class="authInput" placeholder="Username or email"></input>
-                  <br/><br/>
-                  <input class="authInput" placeholder="Password"></input>
-                  <br/><br/>
-                  <button class="authButtons register" onclick="">Sign in</button>
-                </div>
-              )
-            }
-          }/>
-
-            <Route path="/user" exact component={user} />
-          </Switch>
-
-        
-        
-        
-          </div>
       </Router>
     );
   }
diff --git a/twistter-frontend/src/Home.js b/twistter-frontend/src/Home.js
new file mode 100644
index 0000000..7371429
--- /dev/null
+++ b/twistter-frontend/src/Home.js
@@ -0,0 +1,37 @@
+import React, { Component } from 'react';
+import './App.css';
+
+import logo from './twistter-logo.png';
+
+
+class Home extends Component {
+  render() {
+    return (
+      <div>
+        <div>
+          <img src={logo} className="app-logo" alt="logo" />
+          <br/><br/>
+          <b>Welcome to Twistter!</b> 
+          <br/><br/>
+          <b>See the most interesting topics people are following right now.</b> 
+        </div>
+
+        <br/><br/><br/><br/>
+
+        <div>                    
+          <b>Join today or sign in if you already have an account.</b> 
+          <br/><br/>
+          <form action="./register">
+            <button className="authButtons register">Sign up</button> 
+          </form>
+          <br/>
+          <form action="./login">
+            <button className="authButtons login">Sign in</button>
+          </form>
+        </div>
+      </div>
+    );
+    }
+  }
+
+export default Home;
\ No newline at end of file
diff --git a/twistter-frontend/src/Login.js b/twistter-frontend/src/Login.js
new file mode 100644
index 0000000..86c8d98
--- /dev/null
+++ b/twistter-frontend/src/Login.js
@@ -0,0 +1,27 @@
+import React, { Component } from 'react';
+import './App.css';
+
+import logo from './twistter-logo.png';
+import TextField from '@material-ui/core/TextField';
+
+import axios from 'axios';
+
+class Login extends Component {
+  render() {
+    return (
+      <div>
+        <img src={logo} className="app-logo" alt="logo" />
+        <br/><br/>
+        <b>Log in to Twistter</b>
+        <br/><br/>
+        <TextField className="authInput" id="email" name="email" label="Email" />
+        <br/><br/>
+        <TextField className="authInput" id="password" name="password" label="Password" />
+        <br/><br/>
+        <button className="authButtons register" type="submit">Sign in</button>
+      </div>
+    );
+  };
+}
+
+export default Login;
\ No newline at end of file
diff --git a/twistter-frontend/src/Register.js b/twistter-frontend/src/Register.js
new file mode 100644
index 0000000..a04dde4
--- /dev/null
+++ b/twistter-frontend/src/Register.js
@@ -0,0 +1,31 @@
+import React, { Component } from 'react';
+import './App.css';
+
+import logo from './twistter-logo.png';
+import TextField from '@material-ui/core/TextField';
+
+//import axios from 'axios';
+
+class Register extends Component {
+  render() {
+    return (
+      <div>
+        <img src={logo} className="app-logo" alt="logo" />
+        <br/><br/>
+        <b>Create your account</b>
+        <br/><br/>
+        <TextField className="authInput" id="email" name="email" label="Email" />
+        <br/><br/>
+        <TextField className="authInput" id="username" name="username" label="Username" />
+        <br/><br/>
+        <TextField className="authInput" id="password" name="password" label="Password" />
+        <br/><br/>
+        <TextField className="authInput" id="confirmPassword" name="confirmPassword" label="Confirm Password" />
+        <br/><br/>
+        <button class="authButtons register" id="submit">Sign up</button>
+      </div>
+    );
+  }
+}
+
+export default Register;
\ No newline at end of file
diff --git a/twistter-frontend/src/Writing_Microblogs.js b/twistter-frontend/src/Writing_Microblogs.js
new file mode 100644
index 0000000..ed90ab6
--- /dev/null
+++ b/twistter-frontend/src/Writing_Microblogs.js
@@ -0,0 +1,72 @@
+import React, { Component } from "react";
+import { BrowserRouter as Router } from 'react-router-dom';
+import Route from 'react-router-dom/Route';
+
+
+class Writing_Microblogs extends Component {
+    
+    constructor(props) {
+        super(props);
+        this.state = {
+            value: '',
+            title: '',
+            characterCount: 10
+            
+        };
+        
+
+        this.handleChange = this.handleChange.bind(this);
+        this.handleSubmit = this.handleSubmit.bind(this);
+        this.handleChangeforPost = this.handleChangeforPost.bind(this);
+    }
+
+    handleChange(event) {
+        this.setState( {title: event.target.value });
+    }
+
+    handleSubmit(event) {
+        alert('A title for the microblog was inputted: ' + this.state.title + '\nA microblog was posted: ' + this.state.value);
+        event.preventDefault();
+    }
+
+    handleChangeforPost(event) {
+        this.setState({value: event.target.value })
+    }
+
+    handleChangeforCharacterCount(event) {
+        const charCount = event.target.value.length
+        const charRemaining = 10 - charCount
+        this.setState({characterCount: charRemaining })
+    }
+
+
+    render() {
+        return (
+            <div>
+            <div style={{ width: "200px", height: "50px", marginTop: "180px", marginLeft: "30px" }}>         
+             <form>
+                    <input type="text" placeholder="Enter Microblog Title" value={this.state.title} onChange={this.handleChange} />
+            </form>
+             </div>
+             
+             <div style={{ width: "200px", marginLeft: "50px"}}>        
+                <form onSubmit={this.handleSubmit}>
+                    <textarea value={this.state.value} maxLength="10" placeholder= "Write Microblog here..." 
+                        onChange = { (e) => { this.handleChangeforPost(e); this.handleChangeforCharacterCount(e) } } cols={40} rows={20} />      
+                 <div style={{ fontSize: "14px", marginRight: "-100px"}} >
+                    <p2>Characters Left: {this.state.characterCount}</p2>
+                 </div>
+                 <div style={{ marginRight: "-100px"  }}>        
+                    <button onClick>Share Post</button> 
+                 </div>
+                </form>
+             </div>
+             </div>
+            
+        );
+    }
+
+
+}
+
+export default Writing_Microblogs;
\ No newline at end of file
diff --git a/twistter-frontend/src/index.css b/twistter-frontend/src/index.css
deleted file mode 100644
index b4cc725..0000000
--- a/twistter-frontend/src/index.css
+++ /dev/null
@@ -1,5 +0,0 @@
-body {
-  margin: 0;
-  padding: 0;
-  font-family: sans-serif;
-}
diff --git a/twistter-frontend/src/index.js b/twistter-frontend/src/index.js
index b79978e..5b9a1ed 100644
--- a/twistter-frontend/src/index.js
+++ b/twistter-frontend/src/index.js
@@ -1,7 +1,6 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import App from './App';
-import './index.css';
 
 ReactDOM.render(
   <App />,