Merge pull request #768 from javaistic/feat/enhance-seo

arghyaxcodes · web-flow · commit 56c2e2f9eb04 · 2025-10-26T11:47:41.000+05:30
Enhance SEO with structured data and improved metadata
diff --git a/bun.lock b/bun.lock
diff --git a/package.json b/package.json
@@ -6,6 +6,7 @@
     "build": "next build",
     "dev": "next dev --turbo",
     "start": "next start",
+    "lint": "eslint .",
     "format": "prettier \"src/**/*.{ts,tsx,js,jsx,json,css}\" \"content/**/*.{md,mdx}\" --write",
     "format:check": "prettier \"src/**/*.{ts,tsx,js,jsx,json,css}\" \"content/**/*.{md,mdx}\" --check",
     "postinstall": "fumadocs-mdx"
@@ -31,6 +32,7 @@
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
     "react-simple-code-editor": "^0.14.1",
+    "schema-dts": "^1.1.5",
     "sharp": "^0.34.3",
     "tailwind-merge": "^3.3.1",
     "use-debounce": "^10.0.5"
diff --git a/src/app/docs/[[...slug]]/page.tsx b/src/app/docs/[[...slug]]/page.tsx
@@ -7,17 +7,41 @@ import {
   DocsPage,
   DocsTitle,
 } from "fumadocs-ui/page";
+import type { Metadata, ResolvingMetadata } from "next";
 import { notFound } from "next/navigation";
+import { Article, WithContext } from "schema-dts";
 
 export default async function Page(props: {
   params: Promise<{ slug?: string[] }>;
 }) {
   const params = await props.params;
   const page = source.getPage(params.slug);
+  const owner = "javaistic";
+  const repo = "javaistic";
+
   if (!page) notFound();
 
   const MDXContent = page.data.body;
 
+  const jsonLd: WithContext<Article> = {
+    "@context": "https://schema.org",
+    "@type": "Article",
+    headline: page.data.title,
+    description: page.data.description,
+    author: {
+      "@type": "Organization",
+      name: "Javaistic",
+    },
+    publisher: {
+      "@type": "Organization",
+      name: "Javaistic",
+    },
+    mainEntityOfPage: {
+      "@type": "WebPage",
+      "@id": `https://javaistic.vercel.app${page.url}`,
+    },
+  };
+
   return (
     <DocsPage
       toc={page.data.toc}
@@ -31,6 +55,7 @@ export default async function Page(props: {
       <DocsDescription className="mb-3">
         {page.data.description}
       </DocsDescription>
+
       <DocsBody>
         <MDXContent
           components={getMDXComponents({
@@ -39,6 +64,12 @@ export default async function Page(props: {
           })}
         />
       </DocsBody>
+      <script
+        type="application/ld+json"
+        dangerouslySetInnerHTML={{
+          __html: JSON.stringify(jsonLd).replace(/</g, "\\u003c"),
+        }}
+      />
     </DocsPage>
   );
 }
@@ -47,11 +78,19 @@ export async function generateStaticParams() {
   return source.generateParams();
 }
 
-export async function generateMetadata(props: {
+type Props = {
   params: Promise<{ slug?: string[] }>;
-}) {
-  const params = await props.params;
-  const page = source.getPage(params.slug);
+  searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
+};
+
+export async function generateMetadata(
+  { params, searchParams }: Props,
+  parent: ResolvingMetadata,
+): Promise<Metadata> {
+  const { slug } = await params;
+
+  const page = source.getPage(slug);
+
   if (!page) notFound();
 
   return {
@@ -60,7 +99,8 @@ export async function generateMetadata(props: {
     openGraph: {
       title: `${page.data.title} - Javaistic`,
       description: page.data.description,
-      sitename: "Javaistic",
+      siteName: "Javaistic",
+      url: `https://javaistic.vercel.app${page.url}`,
       images: `https://og-javaistic.vercel.app/og?title=${page.data.title}`,
     },
     twitter: {
diff --git a/src/app/programs/[[...slug]]/page.tsx b/src/app/programs/[[...slug]]/page.tsx
@@ -1,13 +1,15 @@
 import { programsSource } from "@/lib/source";
+import { getMDXComponents } from "@/mdx-components";
+import { createRelativeLink } from "fumadocs-ui/mdx";
 import {
-  DocsPage,
   DocsBody,
   DocsDescription,
+  DocsPage,
   DocsTitle,
 } from "fumadocs-ui/page";
+import type { Metadata, ResolvingMetadata } from "next";
 import { notFound } from "next/navigation";
-import { createRelativeLink } from "fumadocs-ui/mdx";
-import { getMDXComponents } from "@/mdx-components";
+import { HowTo, WithContext } from "schema-dts";
 
 export default async function Page(props: {
   params: Promise<{ slug?: string[] }>;
@@ -18,6 +20,21 @@ export default async function Page(props: {
 
   const MDXContent = page.data.body;
 
+  const jsonLd: WithContext<HowTo> = {
+    "@context": "https://schema.org",
+    "@type": "HowTo",
+    name: page.data.title,
+    description: page.data.description,
+    provider: {
+      "@type": "Organization",
+      name: "Javaistic",
+    },
+    mainEntityOfPage: {
+      "@type": "WebPage",
+      "@id": `https://javaistic.vercel.app${page.url}`,
+    },
+  };
+
   return (
     <DocsPage
       toc={page.data.toc}
@@ -36,6 +53,12 @@ export default async function Page(props: {
           })}
         />
       </DocsBody>
+      <script
+        type="application/ld+json"
+        dangerouslySetInnerHTML={{
+          __html: JSON.stringify(jsonLd).replace(/</g, "\\u003c"),
+        }}
+      />
     </DocsPage>
   );
 }
@@ -44,11 +67,17 @@ export async function generateStaticParams() {
   return programsSource.generateParams();
 }
 
-export async function generateMetadata(props: {
+type Props = {
   params: Promise<{ slug?: string[] }>;
-}) {
-  const params = await props.params;
-  const page = programsSource.getPage(params.slug);
+  searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
+};
+
+export async function generateMetadata(
+  { params, searchParams }: Props,
+  parent: ResolvingMetadata,
+): Promise<Metadata> {
+  const { slug } = await params;
+  const page = programsSource.getPage(slug);
   if (!page) notFound();
 
   return {
@@ -57,7 +86,8 @@ export async function generateMetadata(props: {
     openGraph: {
       title: `${page.data.title} - Javaistic`,
       description: page.data.description,
-      sitename: "Javaistic",
+      siteName: "Javaistic",
+      url: `https://javaistic.vercel.app${page.url}`,
       images: `https://og-javaistic.vercel.app/og?title=${page.data.title}`,
     },
     twitter: {
