seo errors are fixed using layout.js

SH20RAJ · Mar 23, 2024 · ff9164c · ff9164c
1 parent ceb2b62
commit ff9164c
Show file tree

Hide file tree

Showing 2 changed files with 52 additions and 94 deletions.
diff --git a/src/app/[...slug]/layout.js b/src/app/[...slug]/layout.js
@@ -0,0 +1,49 @@
+
+export const metadata = {
+  title: "op - Programming Related Articles",
+  description: "Get Programming Related Articles on Daily Basis on DevArt a better place to spend time....",
+};
+
+export default async function RootLayout(pr) {
+  let { children, params } = pr;
+  const api = `https://dev.to/api/articles/${params.slug[0]}/${params.slug[1]}`;
+  const res = await fetch(api);
+  const data = await res.json();
+  return (
+    <html lang="en">
+      <head>
+        <meta
+          name="google-site-verification"
+          content="exvbD16MWo-o_oksJDrekaQ_zwY62YGWEA_XdlE5_XM"
+        />
+<link rel="icon" href="https://github.com/fornfun.png" type="image/gif" />
+        <script
+          async
+          src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1828915420581549"
+          crossorigin="anonymous"
+        ></script>
+        <script
+          async
+          src="https://www.googletagmanager.com/gtag/js?id=G-CWL59Y4TR7"
+        ></script>
+        <title>{data.title}</title>
+        <meta name="description" content={data.description}/>
+        <meta name="keywords" content={data.tag_list}/>
+        <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+        {/* <link rel="canonical" href={"https://dev.sh20raj.com/"+data.path}/> */}
+        <meta property="og:title" content={data.title}/>
+        <meta property="og:description" content={data.description}/>
+        <meta property="og:image" content={data.social_image}/>
+        {/* <meta property="og:url" content={"https://dev.sh20raj.com/"+data.path}/> */}
+        <meta property="og:type" content="website"/>
+        <meta name="twitter:card" content="summary_large_image"/>
+        <meta name="twitter:site" content="@sh20raj"/>
+        <meta name="twitter:title" content={data.title}/>
+        <meta name="twitter:description" content={data.description}/>
+        <meta name="twitter:image" content={data.social_image}/>
+        <meta name="robots" content="index, follow"/> 
+      </head>
+      <body>{children}</body>
+    </html>
+  );
+}
diff --git a/src/app/[...slug]/page.js b/src/app/[...slug]/page.js
@@ -3,69 +3,7 @@ import Nav from "../components/Nav";
 import Link from "next/link";
 // import { metadata } from "../layout";
 
-let metadata2 = {
-  title: "Article",
-  description: "Article Description",
-  robots: {
-    index: true,
-    follow: true,
-  },
-  openGraph: {
-    title: "Article Title",
-    description: "Article Description",
-    images: [
-      {
-        url: "https://example.com/cover-image.jpg",
-        width: 800,
-        height: 600,
-        alt: "Article Cover Image",
-      },
-    ],
-    type: "article",
-    article: {
-      publishedTime: "2023-04-01T00:00:00Z",
-      modifiedTime: "2023-04-02T00:00:00Z",
-      authors: ["https://example.com/authors/john-doe"],
-      tags: ["tag1", "tag2", "tag3"],
-    },
-  },
-  twitter: {
-    card: "summary_large_image",
-    title: "Article Title",
-    description: "Article Description",
-    images: ["https://example.com/cover-image.jpg"],
-  },
-  jsonLd: [
-    {
-      type: "Article",
-      headline: "Article Title",
-      description: "Article Description",
-      datePublished: "2023-04-01T00:00:00Z",
-      dateModified: "2023-04-02T00:00:00Z",
-      author: {
-        type: "Person",
-        name: "John Doe",
-        url: "https://example.com/authors/john-doe",
-      },
-      publisher: {
-        type: "Organization",
-        name: "Acme",
-        url: "https://example.com",
-        logo: {
-          url: "https://example.com/logo.jpg",
-          width: 60,
-          height: 60,
-        },
-      },
-      image: {
-        url: "https://example.com/cover-image.jpg",
-        width: 800,
-        height: 600,
-      },
-      keywords: ["tag1", "tag2", "tag3"],
-    },
-  ],
-};
+
 
 export function generateRandomNumber(min, max) {
   // Math.random() generates a random number between 0 and 1
@@ -78,36 +16,9 @@ export default async ({ params }) => {
   const api = `https://dev.to/api/articles/${params.slug[0]}/${params.slug[1]}`;
   const res = await fetch(api);
   const data = await res.json();
-  const {
-    title,
-    description,
-    cover_image,
-    social_image,
-    user,
-    tag_list,
-    reading_time_minutes,
-    readable_publish_date,
-    public_reactions_count,
-  } = data;
-  metadata2.title = title;
-  metadata2.description = description;
-  metadata2.openGraph.title = title;
-  metadata2.openGraph.description = description;
-  metadata2.openGraph.images[0].url = cover_image || social_image;
-  // metadata2.article.publishedTime = description;
-  // metadata2.article.modifiedTime = description;
-  metadata2.description = description;
-  metadata2.twitter.title = title;
-  metadata2.twitter.description = description;
-  metadata2.twitter.images[0] = cover_image || social_image;
-  metadata2.description = description;
-  metadata2.description = description;
 
   const response = await fetch(
-    `https://dev.to/api/articles/latest/?per_page=11&page=${generateRandomNumber(
-      1,
-      1000
-    )}`
+    `https://dev.to/api/articles/latest/?per_page=19&page=${generateRandomNumber(1,1000)}`
   );
 
   const data2 = await response.json();
@@ -135,7 +46,7 @@ export default async ({ params }) => {
               <img
                 width={40}
                 class="author-img"
-                src={user.profile_image_90}
+                src={data.user.profile_image_90}
                 alt=""
               />{" "}
               {data.user.name}
@@ -181,8 +92,6 @@ export default async ({ params }) => {
     </>
   );
 };
-let metadata = metadata2;
-export { metadata };
 
 function ArticleCard({ article }) {
   return (