diff --git a/frontend/.env.environment b/frontend/.env.environment
index 393ac2b8..9734f038 100644
--- a/frontend/.env.environment
+++ b/frontend/.env.environment
@@ -1 +1,2 @@
-NEXT_PUBLIC_STRAPI_URL=http://localhost:1337
\ No newline at end of file
+NEXT_PUBLIC_STRAPI_URL=http://localhost:1337
+
diff --git a/frontend/features/page/sections/ContactsSection/ContactsSection.tsx b/frontend/features/page/sections/ContactsSection/ContactsSection.tsx
index 98a32a62..a6aee223 100644
--- a/frontend/features/page/sections/ContactsSection/ContactsSection.tsx
+++ b/frontend/features/page/sections/ContactsSection/ContactsSection.tsx
@@ -242,7 +242,7 @@ enum FormActionType {
   Success = "success",
   Failed = "failed",
   Submit = "submit",
-  ValidationFailed = "validation - failed",
+  ValidationFailed = "validation-failed",
 }
 
 interface ValidationFailedAction {
@@ -384,6 +384,10 @@ export function ContactsForm() {
         >(InsertFormMessage, { input });
 
         if (response.createFormMessage) {
+          fetch(`api/send`, {
+            method: "POST",
+            body: JSON.stringify({ data: state.values }),
+          });
           dispatch({ type: FormActionType.Success });
         } else {
           dispatch({ type: FormActionType.Failed });
@@ -643,7 +647,7 @@ export function ContactsForm() {
             ></Box>
           </FormControl>
         </Box>
-        <Text color="red">{state.submitError}</Text>
+        <Box color="red">{state.submitError}</Box>
         <Button
           type="submit"
           userSelect="none"
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 956b33a2..690fed20 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -2464,6 +2464,21 @@
       "integrity": "sha512-9NET910DNaIPngYnLLPeg+Ogzqsi9uM4mSboU5y6p8S5DzMTVEsJZrawi+BoDNUVBa2DhJqQYUFvMDfgU062LQ==",
       "dev": true
     },
+    "@slack/types": {
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/@slack/types/-/types-1.10.0.tgz",
+      "integrity": "sha512-tA7GG7Tj479vojfV3AoxbckalA48aK6giGjNtgH6ihpLwTyHE3fIgRrvt8TWfLwW8X8dyu7vgmAsGLRG7hWWOg=="
+    },
+    "@slack/webhook": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/@slack/webhook/-/webhook-6.0.0.tgz",
+      "integrity": "sha512-2fohfhLI9lkAmOSWt1R457JBsB3iFNqahu4GqdFZRtcp/bT+xeG/kPn/hQa78JS74poRjWTt5G/qJjNaWMGOEQ==",
+      "requires": {
+        "@slack/types": "^1.2.1",
+        "@types/node": ">=12.0.0",
+        "axios": "^0.21.1"
+      }
+    },
     "@szmarczak/http-timer": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/@szmarczak/http-timer/-/http-timer-1.1.2.tgz",
@@ -3102,6 +3117,14 @@
       "integrity": "sha512-5LMaDRWm8ZFPAEdzTYmgjjEdj1YnQcpfrVajO/sn/LhbpGp0Y0H64c2hLZI1gRMxfA+w1S71Uc/nHaOXgcCvGg==",
       "dev": true
     },
+    "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",
@@ -5115,6 +5138,11 @@
         }
       }
     },
+    "follow-redirects": {
+      "version": "1.14.2",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.2.tgz",
+      "integrity": "sha512-yLR6WaE2lbF0x4K2qE2p9PEXKLDjUjnR/xmjS3wHAYxtlsI9MLLBJUZirAHKzUZDGLxje7w/cXR49WOUo4rbsA=="
+    },
     "foreach": {
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/foreach/-/foreach-2.0.5.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index b77a076f..ef3fd3ee 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -15,6 +15,7 @@
     "@emotion/react": "11.4.0",
     "@emotion/styled": "11.3.0",
     "@graphql-codegen/typescript-document-nodes": "1.17.13",
+    "@slack/webhook": "6.0.0",
     "framer-motion": "4.1.17",
     "graphql": "15.5.1",
     "graphql-codegen": "0.4.0",
diff --git a/frontend/pages/api/send.ts b/frontend/pages/api/send.ts
new file mode 100644
index 00000000..7037166d
--- /dev/null
+++ b/frontend/pages/api/send.ts
@@ -0,0 +1,37 @@
+import { NextApiRequest } from "next";
+import { IncomingWebhook } from "@slack/webhook";
+
+const url = process.env.SLACK_WEBHOOK_URL!;
+
+const webhook = new IncomingWebhook(url);
+
+export default async function handler(req: NextApiRequest) {
+  const parsedBody = JSON.parse(req.body);
+  await webhook.send({
+    channel: "general",
+    text: "Someone has left a message!",
+    blocks: [
+      {
+        type: "section",
+        text: {
+          type: "mrkdwn",
+          text: parsedBody.data.email,
+        },
+      },
+      {
+        type: "section",
+        text: {
+          type: "mrkdwn",
+          text: `*${parsedBody.data.name}*`,
+        },
+      },
+      {
+        type: "section",
+        text: {
+          type: "mrkdwn",
+          text: parsedBody.data.message,
+        },
+      },
+    ],
+  });
+}