diff --git a/.gitignore b/.gitignore
index c223db9..4d29575 100644
--- a/.gitignore
+++ b/.gitignore
@@ -21,6 +21,3 @@
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-
-**/DEBUG
-**/DEBUG*
\ No newline at end of file
diff --git a/src/App.tsx b/src/App.tsx
index d324913..dbcaf2b 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -6,6 +6,7 @@ import Footer from "./components/footer/footer";
 import React from "react";
 import VerifyMail from "./components/verify_email/verify_mail";
 import ThankYou from "./components/verify_email/thank_you";
+import DEBUG from "./components/DEBUG/DEBUG";
 
 function App() {
     return (
@@ -16,6 +17,7 @@ function App() {
                     <Route path="/contact" element={<ContactForm/>}/>
                     <Route path="/verify-email" element={<VerifyMail/>}/>
                     <Route path="/thank-you" element={<ThankYou/>}/>
+                    {process.env.NODE_ENV === 'development' && <Route path="/debug" element={<DEBUG/>}/>}
                 </Routes>
             </BrowserRouter>
             <Footer/>
diff --git a/src/components/DEBUG/DEBUG.css b/src/components/DEBUG/DEBUG.css
new file mode 100644
index 0000000..afbfb83
--- /dev/null
+++ b/src/components/DEBUG/DEBUG.css
@@ -0,0 +1,11 @@
+.container {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 300px;
+}
+
+button {
+    margin: 10px;
+    cursor: pointer;
+}
\ No newline at end of file
diff --git a/src/components/DEBUG/DEBUG.tsx b/src/components/DEBUG/DEBUG.tsx
new file mode 100644
index 0000000..65928af
--- /dev/null
+++ b/src/components/DEBUG/DEBUG.tsx
@@ -0,0 +1,33 @@
+import {FC} from "react";
+import {useNavigate} from 'react-router-dom';
+import {NavigateOptions} from "react-router/dist/lib/context";
+import './DEBUG.css'
+
+const DEBUG: FC = () =>  {
+    const navigate = useNavigate()
+    const handleClick = (link: string, options: NavigateOptions) => {
+        navigate(link, options);
+    }
+
+    return (
+        <div className='container'>
+            <button onClick={() => handleClick('/verify-email', {
+                state: {
+                    email: 'akastijn@alttd.com'
+                }
+            })}>Verify Email Debug</button>
+            <button onClick={() => handleClick('/thank-you', {
+                state: {
+                    formData: {
+                        row1: 'This is some text',
+                        row2: 'This is text as well',
+                        row3: 'And finally, here is even more text!'
+                    }
+                }
+            })}>Thank You Debug</button>
+            {/*<button onClick={() => handleClick('/page3', {})}>Page 3</button>*/}
+        </div>
+    )
+}
+
+export default DEBUG;
\ No newline at end of file