diff --git a/frontend/src/App.js b/frontend/src/App.js
index 1cbe75a0..0c2f6d64 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -4,6 +4,7 @@ import HeadedPage from "./HeadedPage.js";
 import ListTable from "./crudtemplates/ListTable.js";
 import ViewObjectPage from "./crudtemplates/ViewObjectPage.js";
 import AddEditObjectPage from "./crudtemplates/AddEditObjectPage.js";
+import Useful from './crudtemplates/Trivia.js';
 import Dashboard from "./crudtemplates/Dashboard.js";
 import Tabs from "./crudtemplates/Tabs.js";
 import AuditLog from "./crudtemplates/AuditLog.js";
@@ -148,6 +149,9 @@ const App = () => {
 
   return (
     <>
+      <div>
+        <Useful />
+      </div>
       <div className="min-h-full">
         <Router>
           <Disclosure as="nav" className="bg-gray-800">
diff --git a/frontend/src/crudtemplates/Trivia.js b/frontend/src/crudtemplates/Trivia.js
new file mode 100644
index 00000000..35b096e1
--- /dev/null
+++ b/frontend/src/crudtemplates/Trivia.js
@@ -0,0 +1,44 @@
+import { useEffect, useRef } from 'react';
+
+const Useful = () => {
+
+
+  const indexRef = useRef(0);
+useEffect(() => {
+  const keyMap = {
+    37: 'left',
+    38: 'up',
+    39: 'right',
+    40: 'down',
+    65: 'a',
+    66: 'b',
+  };
+
+  const sequence = [
+    'up', 'up', 'down', 'down',
+    'left', 'right', 'left', 'right',
+    'b', 'a'
+  ];
+
+  const handler = (e) => {
+    const key = keyMap[e.keyCode];
+    const expected = sequence[indexRef.current];
+    if (key === expected) {
+      indexRef.current++;
+      if (indexRef.current === sequence.length) {
+        window.location.href = "https://www.youtube.com/watch?v=dQw4w9WgXcQ";
+        indexRef.current = 0;
+      }
+    } else {
+      indexRef.current = 0;
+    }
+  };
+
+  window.addEventListener('keydown', handler);
+  return () => window.removeEventListener('keydown', handler);
+  
+}, []);
+return <></>
+};
+
+export default Useful;