Merge to prod for first deployment

CODE_OF_CONDUCT.md

@@ -60,7 +60,7 @@ representative at an online or offline event.
 
 Instances of abusive, harassing, or otherwise unacceptable behavior may be
 reported to the community leaders responsible for enforcement at
-**conduct@opendsa.dev**.
+**solomoneshun373@gmai.com**.
 
 All complaints will be reviewed and investigated promptly and fairly.
 

CONTRIBUTING.md

@@ -999,7 +999,7 @@ Join our Discord server for:
 - Showing off your contributions
 - Connecting with other contributors
 
-[Join Discord⛓️‍💥❌](https://discord.gg/opendsa)
+[Join Discord](https://discord.gg/mfQvUa2y4r)
 
 ### Getting Help
 

README.md

@@ -1,5 +1,5 @@
 <p align="center">
-  <img src="https://placehold.co/120x60?text=oDSA" alt="OpenDSA Logo" width="90" height="60">
+  <img src="opendsa_logo.png" alt="OpenDSA Logo" width="90" height="60">
 </p>
 
 <h1 align="center">OpenDSA</h1>
@@ -15,13 +15,13 @@
 </p>
 
 <p align="center">
-  <a href="https://opendsa.dev.vercel.app">Website⛓️‍💥❌</a>
+  <a href="https://opendsa.vercel.app">Website</a>
   ·
-  <a href="https://app.opendsa.dev.vercel.app">Launch App⛓️‍💥❌</a>
+  <a href="https://app.opendsa.vercel.app">Launch App</a>
   ·
-  <a href="https://docs.opendsa.dev.vercel.app">Documentation⛓️‍💥❌</a>
+  <a href="https://docs.opendsa.vercel.app">Documentation</a>
   ·
-  <a href="https://discord.gg/opendsa">Discord⛓️‍💥❌</a>
+  <a href="https://discord.gg/mfQvUa2y4r">Discord</a>
 </p>
 
 <p align="center">
@@ -31,7 +31,7 @@
   <a href="https://github.com/soloshun/opendsa/blob/main/LICENSE">
     <img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="License">
   </a>
-  <a href="https://discord.gg/opendsa">
+  <a href="https://discord.gg/mfQvUa2y4r">
     <img src="https://img.shields.io/discord/000000000000000000?color=7289da&label=discord" alt="Discord">
   </a>
 </p>
@@ -83,7 +83,7 @@ OpenDSA makes complex algorithms visual and intuitive.
 
 ### Try Online
 
-Visit [app.opendsa.dev](https://app.opendsa.dev.vercel.app) to start visualizing algorithms immediately - no installation required.
+Visit [app.opendsa.dev](https://app.opendsa.vercel.app) to start visualizing algorithms immediately - no installation required.
 
 ### Run Locally
 
@@ -205,7 +205,7 @@ See our [Roadmap](https://github.com/soloshun/opendsa/blob/main/ROADMAP.md) for
 
 ## Community
 
-- **Discord**: [Join our community ⛓️‍💥❌](https://discord.gg/opendsa)
+- **Discord**: [Join our community](https://discord.gg/mfQvUa2y4r)
 - **Twitter**: [@self.solo_shun⛓️‍💥❌](https://twitter.com/opendsa)
 - **GitHub Discussions**: [Ask questions](https://github.com/soloshun/opendsa/discussions)
 

apps/app/src/app/layout.tsx

@@ -15,23 +15,82 @@ const jetbrainsMono = JetBrains_Mono({
   display: "swap",
 });
 
+const siteUrl = "https://app.opendsa.vercel.app"; // TODO: Change to https://app.opendsa.dev after domain purchase
+
 export const metadata: Metadata = {
-  title: "OpenDSA App - Coming Soon",
-  description: "The open-source algorithm visualization platform. Interactive visualizations for sorting, searching, graphs, trees, and more.",
-  keywords: ["algorithms", "data structures", "visualization", "learning", "education", "open source"],
-  authors: [{ name: "Solomon Eshun", url: "https://github.com/soloshun" }],
+  metadataBase: new URL(siteUrl),
+  title: {
+    default: "OpenDSA App - Coming Soon | Algorithm Visualization Platform",
+    template: "%s | OpenDSA App",
+  },
+  description:
+    "The OpenDSA algorithm visualization app is under active development. Visualize sorting, searching, graphs, trees, and 70+ algorithms with beautiful interactive animations. Star us on GitHub to follow our progress!",
+  keywords: [
+    "algorithm visualization app",
+    "data structures app",
+    "interactive algorithms",
+    "sorting visualization",
+    "graph algorithms",
+    "tree visualization",
+    "learn algorithms",
+    "computer science",
+    "coding practice",
+    "DSA tool",
+    "open source",
+    "coming soon",
+  ],
+  authors: [
+    { name: "Solomon Eshun", url: "https://github.com/soloshun" },
+  ],
+  creator: "Solomon Eshun",
+  publisher: "OpenDSA",
+  icons: {
+    icon: "/opendsa.ico",
+    shortcut: "/opendsa.ico",
+    apple: "/opendsa.ico",
+  },
   openGraph: {
-    title: "OpenDSA - Coming Soon",
-    description: "The open-source algorithm visualization platform is under development.",
-    url: "https://app.opendsa.dev",
-    siteName: "OpenDSA",
     type: "website",
+    locale: "en_US",
+    url: siteUrl,
+    siteName: "OpenDSA App",
+    title: "OpenDSA App - Coming Soon",
+    description:
+      "The open-source algorithm visualization platform is under development. Star us on GitHub!",
+    images: [
+      {
+        url: "/og-coming-soon.png", // TODO: Add screenshot
+        width: 1200,
+        height: 630,
+        alt: "OpenDSA App - Coming Soon",
+        type: "image/png",
+      },
+    ],
   },
   twitter: {
     card: "summary_large_image",
-    title: "OpenDSA - Coming Soon",
-    description: "The open-source algorithm visualization platform is under development.",
+    site: "@opendsa",
+    creator: "@soloshun",
+    title: "OpenDSA App - Coming Soon",
+    description:
+      "The open-source algorithm visualization platform is under development. Star us on GitHub!",
+    images: ["/og-coming-soon.png"], // TODO: Add screenshot
+  },
+  robots: {
+    index: true,
+    follow: true,
+    googleBot: {
+      index: true,
+      follow: true,
+      "max-video-preview": -1,
+      "max-image-preview": "large",
+      "max-snippet": -1,
+    },
+  },
+  alternates: {
+    canonical: siteUrl,
   },
+  category: "Education",
 };
 
 export default function RootLayout({
@@ -41,6 +100,12 @@ export default function RootLayout({
 }>) {
   return (
     <html lang="en" className={`dark ${syne.variable} ${jetbrainsMono.variable}`}>
+      <head>
+        <link rel="canonical" href={siteUrl} />
+        <meta name="theme-color" content="#22c55e" />
+        <meta name="apple-mobile-web-app-capable" content="yes" />
+        <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
+      </head>
       <body className="antialiased font-sans">
         {children}
       </body>

apps/app/src/app/not-found.tsx

@@ -71,6 +71,8 @@ export default function NotFound() {
     // eslint-disable-next-line react-hooks/set-state-in-effect
     setMounted(true);
     setCurrentPath(window.location.pathname);
+    // Update document title for SEO
+    document.title = "404 - Page Not Found | OpenDSA";
   }, []);
 
   if (!mounted) {
@@ -198,7 +200,8 @@ export default function NotFound() {
             maxWidth: "400px",
             margin: "0 auto"
           }}>
-            Looks like you've ventured into uncharted territory. The page you're looking for doesn't exist or has been moved.
+           The algorithm or page you're searching for doesn't exist in our registry.
+           Perhaps it's still being visualized somewhere in the void.
           </p>
         </div>
 
@@ -269,10 +272,10 @@ export default function NotFound() {
           fontFamily: "var(--font-jetbrains), monospace",
           color: "hsl(0 0% 60%)"
         }}>
-          <Link href="https://opendsa.dev" style={{ color: "inherit", textDecoration: "none" }}>
+          <Link href="https://opendsa.vercel.app" style={{ color: "inherit", textDecoration: "none" }}>
             → website
           </Link>
-          <Link href="https://docs.opendsa.dev" style={{ color: "inherit", textDecoration: "none" }}>
+          <Link href="https://docs.opendsa.vercel.app" style={{ color: "inherit", textDecoration: "none" }}>
             → docs
           </Link>
           <Link href="https://github.com/soloshun/opendsa" style={{ color: "inherit", textDecoration: "none" }}>

apps/app/src/app/page.tsx

@@ -455,7 +455,7 @@ export default function ComingSoon() {
               </Link>
 
               <Link
-                href="https://opendsa.dev"
+                href="https://opendsa.vercel.app"
                 target="_blank"
                 rel="noopener noreferrer"
                 style={{
@@ -479,7 +479,7 @@ export default function ComingSoon() {
               </Link>
 
               <Link
-                href="https://docs.opendsa.dev"
+                href="https://docs.opendsa.vercel.app"
                 target="_blank"
                 rel="noopener noreferrer"
                 style={{

apps/docs/app/code_of_conduct/page.mdx

@@ -65,7 +65,7 @@ representative at an online or offline event.
 
 Instances of abusive, harassing, or otherwise unacceptable behavior may be
 reported to the community leaders responsible for enforcement at
-**conduct@opendsa.dev**.
+**solomoneshun373@gmail.com**.
 
 All complaints will be reviewed and investigated promptly and fairly.
 

apps/docs/app/contributing/page.mdx

@@ -993,7 +993,7 @@ Join our Discord server for:
 - Showing off your contributions
 - Connecting with other contributors
 
-[Join Discord⛓️‍💥❌](https://discord.gg/opendsa)
+[Join Discord](https://discord.gg/mfQvUa2y4r)
 
 ### Getting Help
 

apps/docs/app/layout.jsx

@@ -5,7 +5,7 @@ import 'nextra-theme-docs/style.css'
 import './globals.css'
 import 'katex/dist/katex.min.css'
 import { JetBrains_Mono, Inter } from "next/font/google";
-// import Image from 'next/image'
+import { GitHubStarButton } from '../components/github-star-button'
 
 const jetbrainsMono = JetBrains_Mono({
   variable: "--font-jetbrains-mono",
@@ -21,40 +21,119 @@ const inter = Inter({
   weight: ["100", "200", "300", "400", "500", "600", "700"],
 });
 
+const siteUrl = "https://docs.opendsa.vercel.app"; // TODO: Change to https://docs.opendsa.dev after domain purchase
+
 export const metadata = {
+  metadataBase: new URL(siteUrl),
   title: {
-    default: 'OpenDSA Docs',
+    default: 'OpenDSA Documentation - Learn Algorithms & Data Structures',
     template: '%s | OpenDSA Docs'
   },
-  description: 'OpenDSA documentation',
-  authors: [{ name: "Solomon Eshun" }],
+  description: 'Comprehensive documentation for OpenDSA - the open-source algorithm visualization platform. Learn about architecture, contributing, roadmap, and how to build your own visualizers.',
+  keywords: [
+    'OpenDSA documentation',
+    'algorithm visualization docs',
+    'data structures guide',
+    'contributing guide',
+    'open source project',
+    'Next.js documentation',
+    'algorithm implementation',
+    'visualization tutorial',
+  ],
+  authors: [{ name: "Solomon Eshun", url: "https://github.com/soloshun" }],
+  creator: "Solomon Eshun",
+  publisher: "OpenDSA",
+  icons: {
+    icon: "/opendsa.ico",
+    shortcut: "/opendsa.ico",
+    apple: "/opendsa.ico",
+  },
+  openGraph: {
+    type: "website",
+    locale: "en_US",
+    url: siteUrl,
+    siteName: "OpenDSA Docs",
+    title: "OpenDSA Documentation",
+    description: "Learn how to use and contribute to OpenDSA - the open-source algorithm visualization platform.",
+    images: [
+      {
+        url: "/og-docs.png", // TODO: Add screenshot
+        width: 1200,
+        height: 630,
+        alt: "OpenDSA Documentation",
+      },
+    ],
+  },
+  twitter: {
+    card: "summary_large_image",
+    site: "@opendsa",
+    creator: "@soloshun",
+    title: "OpenDSA Documentation",
+    description: "Learn how to use and contribute to OpenDSA - the open-source algorithm visualization platform.",
+    images: ["/og-docs.png"],
+  },
+  robots: {
+    index: true,
+    follow: true,
+  },
+  alternates: {
+    canonical: siteUrl,
+  },
 }
 
 const navbar = (
   <Navbar
-    logo={<b>OpenDSA</b>}
-  />
+    logo={
+      // <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
+      //   <div style={{
+      //     display: 'flex',
+      //     height: '28px',
+      //     width: '28px',
+      //     alignItems: 'center',
+      //     justifyContent: 'center',
+      //     borderRadius: '6px',
+      //     backgroundColor: '#22c55e',
+      //     fontSize: '12px',
+      //     fontWeight: 'bold',
+      //     color: '#000',
+      //     fontFamily: 'monospace'
+      //   }}>
+      //     {'<>'}
+      //   </div>
+      //   <span style={{ fontWeight: 'bold' }}>OpenDSA</span>
+      // </div>
+        <span style={{ fontWeight: 'bold' }}>OpenDSA</span>
+    }
+    projectLink="https://github.com/soloshun/opendsa"
+  >
+    <GitHubStarButton />
+  </Navbar>
 )
 
-const footer = <Footer >
-  <span>{new Date().getFullYear()} © OpenDSA by {" "} <a href="https://github.com/soloshun">Solo Shun</a></span>.
+const footer = <Footer>
+  <span>{new Date().getFullYear()} © OpenDSA by {" "} <a href="https://github.com/soloshun" target="_blank" rel="noopener noreferrer">Solo Shun</a>. MIT License.</span>
 </Footer>
 
 export default async function RootLayout({ children }) {
   return (
     <html lang="en" dir="ltr" suppressHydrationWarning>
-      <Head />
+      <Head>
+        <link rel="canonical" href={siteUrl} />
+        <meta name="theme-color" content="#22c55e" />
+      </Head>
       <body className={`${jetbrainsMono.variable} ${inter.variable} antialiased`}>
         <Layout
           navbar={navbar}
           footer={footer}
           pageMap={await getPageMap()}
           docsRepositoryBase="https://github.com/soloshun/opendsa/tree/dev/apps/docs"
+          editLink="Edit this page on GitHub"
+          feedback={{ content: "Question? Give us feedback →" }}
+          sidebar={{ defaultMenuCollapseLevel: 1 }}
         >
           {children}
         </Layout>
       </body>
     </html>
   )
 }
-