not found page

src/app/not-found.tsx

@@ -0,0 +1,15 @@
+import Link from "next/link";
+
+export default function NotFound() {
+  return (
+    <div className="w-full h-full flex flex-col items-center justify-center">
+      <h2 className="text-4xl font-semibold mb-8">Oops, page not Found</h2>
+      <Link
+        href="/"
+        className="py-2 px-4 bg-indigo-600 text-white text-center text-base shadow-md rounded-lg transition ease-in duration-200 hover:bg-indigo-700"
+      >
+        Home
+      </Link>
+    </div>
+  );
+}

src/app/page.tsx

@@ -1,4 +1,5 @@
 import Image from "next/image";
+import Link from "next/link";
 
 export default function Home() {
   return (
@@ -8,11 +9,14 @@ export default function Home() {
       <p className="text-lg font-light text-gray-400 text-center px-4 sm:px-0 mb-8">
         Do you dare to come with us on this journey to meet countries never explored?
       </p>
-      <button className="inline-flex items-center justify-center p-0.5 mb-2 me-2 text-sm font-medium text-gray-900 rounded-lg group bg-gradient-to-br from-green-400 to-blue-600 group-hover:from-green-400 group-hover:to-blue-600 hover:text-white focus:ring-4 focus:outline-none focus:ring-green-200">
+      <Link
+        href="/map"
+        className="inline-flex items-center justify-center p-0.5 mb-2 me-2 text-sm font-medium text-gray-900 rounded-lg group bg-gradient-to-br from-green-400 to-blue-600 group-hover:from-green-400 group-hover:to-blue-600 hover:text-white focus:ring-4 focus:outline-none focus:ring-green-200"
+      >
         <span className="px-5 py-2.5 transition-all ease-in duration-75 bg-white rounded-md group-hover:bg-opacity-0">
           Get started 🚀
         </span>
-      </button>
+      </Link>
     </div>
   );
 }