diff --git a/Backend/routes/eventRoutes.js b/Backend/routes/eventRoutes.js
index 4aa6f7554ac9af98b276876b6a6df5ec6c516dd7..6a97a26d50344f26e21dd99c723c2838df8b85a0 100644
--- a/Backend/routes/eventRoutes.js
+++ b/Backend/routes/eventRoutes.js
@@ -3,9 +3,7 @@ import {addNewEvent, getEvents} from "../controllers/eventControllers";
 
 const eventRoutes = (app) => {
     app.route('/events')
-        // GET endpoint
         .get(getEvents)
-        // POST endpoint (method)
         .post(addNewEvent);
     
 };
diff --git a/frontend/src/Components/App.js b/frontend/src/Components/App.js
index acb6788cc227ee36bd903170fa6b17517e00c2ae..16e9fd71c3f5e0a1df5fc9d4b7d13f64ccb64a16 100644
--- a/frontend/src/Components/App.js
+++ b/frontend/src/Components/App.js
@@ -6,7 +6,7 @@ import MyTickets from '../Pages/MyTickets';
 import Marketplace from '../Pages/Marketplace';
 import NavBar from './NavBar';
 import NotFound from '../Pages/NotFound'
-import { BrowserRouter, Switch, Routes , Route} from 'react-router-dom'
+import { BrowserRouter, Switch, Route} from 'react-router-dom'
 import SignUp from '../Pages/SignUp';
 import ForgotPassword from '../Pages/ForgotPassword';
 
diff --git a/frontend/src/Components/SignUpForm.js b/frontend/src/Components/SignUpForm.js
index 44d918d5fe11a53d137cc5e8a3d93270587e51de..752f2188cf219b3c6b3861e853b36957575b4040 100644
--- a/frontend/src/Components/SignUpForm.js
+++ b/frontend/src/Components/SignUpForm.js
@@ -3,15 +3,16 @@ import { Link } from 'react-router-dom';
 import isEmail from 'validator/lib/isEmail';
 import isEmpty from 'validator/lib/isEmpty';
 import equals from 'validator/lib/equals';
-
+import errorAlert from '../Helpers/errorAlert';
+import signUp from '../api/auth';
 
 const SignUpForm = () => {
     const[formData, setFormData] = useState({
-        firstName: '',
-        lastName: '', 
-        email: '', 
-        password: '',
-        confirmPassword: '',
+        firstName: 'Fin',
+        lastName: 'Wallis', 
+        email: 'user@gmail.com', 
+        password: 'password123',
+        confirmPassword: 'password123',
         successMsg: false,
         errorMsg: false
     })
@@ -20,6 +21,7 @@ const SignUpForm = () => {
         setFormData({
             ...formData,
             [event.target.name]: event.target.value,
+            errorMsg: ''
         })
         console.log(formData)
 
@@ -30,8 +32,38 @@ const SignUpForm = () => {
         console.log(formData)
 
         // Form validation
-        if (isEmpty(username) || isEmpty(lastName) || isEmpty(email) || isEmpty(confirmPassword)) {
+        if (isEmpty(formData.firstName) || isEmpty(formData.lastName) || isEmpty(formData.email) || isEmpty(formData.password) || isEmpty(formData.confirmPassword)) {
+            setFormData({
+                ...formData, errorMsg: 'All fields are required',
+            }) 
+        } else if (!isEmail(formData.email)) {
+            setFormData({
+                ...formData, errorMsg: 'Invalid email',
+            })
+        } else if (!equals(formData.password, formData.confirmPassword)) {
+            setFormData({
+                ...formData, errorMsg: 'Passwords do not match',
+            })
+        } else {
+            const {firstName, lastName, email, password} = formData
+            const data = {firstName, lastName, email, password}
+
+            signUp(data)
+                .then((response) => {
+                    console.log('axios success', response)
+                    setFormData({
+                        firstName: '',
+                        lastName: '', 
+                        email: '', 
+                        password: '', 
+                        confirmPassword: '',
+                        successMsg: response.data.successMessage,
 
+                    })
+                })
+                .catch((err) => {
+                    console.log(err)
+                })
         }
     }
 
@@ -40,6 +72,7 @@ const SignUpForm = () => {
             <div className='bg-white p-12 rounded-md w-1/3 shadow-lg'>
                 <h1 className='text-black font-montserrat font-extrabold text-3xl mb-12 ml-3'>Tickcrypt</h1>
                 <form className='signup-form space-y-5 px-100' onSubmit={handleSubmit}>
+                    {formData.errorMsg && errorAlert(formData.errorMsg)}
                     <input className='font-montserrat font-medium rounded-full w-full py-4 px-7 shadow-lg' name='firstName' value={formData.firstName} type='text' placeholder='First Name' onChange={handleChange}></input>
                     <input className='font-montserrat font-medium rounded-full w-full py-4 px-7 shadow-lg' name='lastName' value={formData.lastName} type='text' placeholder='Last Name' onChange={handleChange}></input>
                     <input className='font-montserrat font-medium rounded-full w-full py-4 px-7 shadow-lg' name='email' value={formData.email} type='email' placeholder='Email Address' onChange={handleChange}></input>
diff --git a/frontend/src/Helpers/errorAlert.js b/frontend/src/Helpers/errorAlert.js
new file mode 100644
index 0000000000000000000000000000000000000000..affc18101e17752c8fd236ac06a7655e51b8e3d9
--- /dev/null
+++ b/frontend/src/Helpers/errorAlert.js
@@ -0,0 +1,14 @@
+import React from "react";
+
+const errorAlert = (msg) => {
+  return (
+    <div className="text-white px-6 py-4 border-0 rounded relative mb-4 bg-purple-500">
+      <span className="text-xl inline-block mr-5 align-middle">
+        <i className="fas fa-bell" />
+      </span>
+      <span className="inline-block align-middle float-left">{msg}</span>
+    </div>
+  );
+};
+
+export default errorAlert;
diff --git a/frontend/src/api/auth.js b/frontend/src/api/auth.js
new file mode 100644
index 0000000000000000000000000000000000000000..980989289f0461a087f4c3f28f840f5e9cd16b4d
--- /dev/null
+++ b/frontend/src/api/auth.js
@@ -0,0 +1,17 @@
+import axios from 'axios'
+
+const signUp = async (data) => {
+    
+    const config = {
+        headers: {
+            'Content-Type': 'application/json'
+        }
+    }
+
+    const response = await axios.post('/api/auth/signUp', data, config)
+
+    return response
+    
+};
+
+export default signUp;
\ No newline at end of file