feat(metadata): add it (#20)

AugustinMauroy · web-flow · commit 606594465cc7 · 2025-02-12T17:56:03.000+01:00
diff --git a/app/apple-icon.jpg b/app/apple-icon.jpg
diff --git a/app/article/[[...categories]]/page.tsx b/app/article/[[...categories]]/page.tsx
@@ -3,6 +3,7 @@ import { ArticleCard } from '~/components/Post/ArticleCard/index.tsx';
 import { getPostsMetadata } from '~/lib/post.ts';
 import styles from './page.module.css';
 import type { FC } from 'react';
+import type { Metadata } from 'next';
 
 type CategoriesParams = {
 	categories?: string[];
@@ -43,6 +44,17 @@ export const generateStaticParams = () => {
 	return params;
 };
 
+export const generateMetadata = async ({
+	params,
+}: PageProps): Promise<Metadata> => {
+	const currentCategories = (await params).categories || [];
+
+	return {
+		title: `Articles${currentCategories.length > 0 ? ` - ${currentCategories.join(', ')}` : ''}`,
+		description: 'Here you can find all the articles available on the website.',
+	};
+};
+
 const Page: FC<PageProps> = async ({ params }) => {
 	const currentCategories = (await params).categories || [];
 	const postsMetadata = await getPostsMetadata(currentCategories[0]);
diff --git a/app/article/post/[article]/page.tsx b/app/article/post/[article]/page.tsx
@@ -4,6 +4,7 @@ import { getAllPosts } from '~/lib/post.ts';
 import { ArticleHeader } from '~/components/Post/ArticleHeader/index.tsx';
 import styles from './page.module.css';
 import type { FC } from 'react';
+import type { Metadata } from 'next';
 import type { PostFrontmatter } from '~/types/frontmatter';
 import '~/styles/markdown.css';
 
@@ -24,6 +25,24 @@ export async function generateStaticParams() {
 	});
 }
 
+export async function generateMetadata({
+	params,
+}: PageProps): Promise<Metadata> {
+	const article = (await params).article;
+	const slugs = ['post', article];
+
+	const mdxResult = await getContent<PostFrontmatter>(slugs);
+
+	if (!mdxResult) notFound();
+
+	const { frontmatter } = mdxResult;
+
+	return {
+		title: frontmatter.title,
+		description: frontmatter.description,
+	};
+}
+
 const Page: FC<PageProps> = async ({ params }) => {
 	const article = (await params).article;
 	const slugs = ['post', article];
diff --git a/app/icon.svg b/app/icon.svg
@@ -0,0 +1,6 @@
+<svg width="200" height="175" viewBox="0 0 200 175" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10.199 65.02L50 42.043L89.801 65.02V110.978L50 133.959L10.199 110.979V65.021V65.02Z" stroke="#3E7A38" stroke-width="7"/>
+<path d="M60.199 27.02L100 4.04199L139.801 27.022V72.98L100 95.96L60.199 72.98V27.02Z" stroke="#3E7A38" stroke-width="7"/>
+<path d="M60.199 102.021L100 79.041L139.801 102.021V147.979L100 170.959L60.199 147.979V102.021Z" stroke="#3E7A38" stroke-width="7"/>
+<path d="M110.199 65.02L150 42.043L189.801 65.022V110.98L150 133.959L110.199 110.979V65.021V65.02Z" stroke="#3E7A38" stroke-width="7"/>
+</svg>
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -3,8 +3,14 @@ import { GeistSans } from 'geist/font/sans';
 import { GeistMono } from 'geist/font/mono';
 import { Header } from '~/components/Sections/Header/index.tsx';
 import type { FC, PropsWithChildren } from 'react';
+import type { Metadata } from 'next';
 import '~/styles/globals.css';
 
+const metadata: Metadata = {
+	title: 'Nodejs-Loaders',
+	description: 'A collection of loaders for Node.js',
+};
+
 const RootLayout: FC<PropsWithChildren> = ({ children }) => (
 	<html lang="en">
 		<body className={classNames(GeistSans.className, GeistMono.className)}>
@@ -14,4 +20,5 @@ const RootLayout: FC<PropsWithChildren> = ({ children }) => (
 	</html>
 );
 
+export { metadata };
 export default RootLayout;
diff --git a/app/page.tsx b/app/page.tsx
@@ -1,5 +1,5 @@
 import { Hero } from '~/components/Landing/Hero/index.tsx';
-import { LatestArticleSection } from '~/components/Landing/LatestArticleSection/index.tsx';
+import { LatestArticleSection } from '~/components/Landing/LastestArticleSection/index.tsx';
 import type { FC } from 'react';
 
 const Page: FC = () => (
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -22,7 +22,7 @@
   "dependencies": {
     "@radix-ui/react-avatar": "~1.1.2",
     "classnames": "~2.5.1",
-    "next": "15.1.6",
+    "next": "15.1.7",
     "next-mdx-remote": "~5.0.0",
     "react": "19.0.0",
     "react-dom": "19.0.0"
@@ -33,7 +33,7 @@
     "@nodejs-loaders/css-module": "1.0.1",
     "@nodejs-loaders/tsx": "1.0.2",
     "@testing-library/react": "~16.2.0",
-    "@types/node": "~22.12.0",
+    "@types/node": "~22.13.1",
     "@types/react": "~19.0.8",
     "@types/react-dom": "~19.0.3",
     "autoprefixer": "~10.4.20",
