diff --git a/app/blog/[id]/page.js b/app/blog/[id]/page.js
new file mode 100644
index 00000000..a6b7a876
--- /dev/null
+++ b/app/blog/[id]/page.js
@@ -0,0 +1,103 @@
+import Link from 'next/link'
+
+import { convertMarkdownToHtml, convertToStringDate } from '@/services/utils'
+import ArrowLeftIcon from '@/components/Icons/ArrowLeftIcon'
+import getAllArticle from '@/services/getAllArticle'
+import getOneArticle from '@/services/getOneArticle'
+import { Layout } from '@/components/Global/Layout'
+import Footer from '@/components/Global/Footer'
+import CTA from '@/components/Global/CTA'
+import Nav from '@/components/Global/Nav'
+
+export const dynamicParams = false
+export const revalidate = 10
+
+export const generateStaticParams = async () => {
+ const articleList = await getAllArticle()
+
+ const pathList = articleList?.map(record => ({
+ id: record.attributes.slug,
+ }))
+
+ return pathList || []
+}
+
+export const generateMetadata = async ({ params }) => {
+ const article = await getOneArticle(params.id)
+
+ const meta = article?.attributes
+ return {
+ description:
+ meta?.seo_description ??
+ 'Découvrez cet article passionnant de la part de My-Makeup',
+ // seo tag canonical link
+ alternates: {
+ canonical: 'https://my-makeup.fr/blog/' + meta?.slug,
+ },
+ title: meta?.seo_title ?? 'My-Makeup',
+ }
+}
+
+const BlogArticle = async ({ params }) => {
+ const { id } = params
+ const article = await getOneArticle(id)
+ const articleWithConvertedContent = await convertMarkdownToHtml(article)
+ const articleAttributes = articleWithConvertedContent?.attributes
+
+ return (
+ <>
+
+
+
+
+ {
+
+
+
+ }
+ {articleAttributes && (
+
+
+
+ {articleAttributes.title}
+
+
+
+
+
+
+
+
+
+
+ Auteur.e : {articleAttributes.author}
+
+
+
+
+ )}
+
+
+
+
+
+ >
+ )
+}
+
+export default BlogArticle
diff --git a/src/pages/blog.js b/app/blog/page.js
similarity index 79%
rename from src/pages/blog.js
rename to app/blog/page.js
index 33c335b8..1d0c4a54 100644
--- a/src/pages/blog.js
+++ b/app/blog/page.js
@@ -1,36 +1,30 @@
-import React from 'react'
-
import Image from 'next/image'
-import Head from 'next/head'
import Link from 'next/link'
+import getAllArticleOrderedByDesc from '@/services/getAllArticleOrderedByDesc'
import { convertToStringDate } from '@/services/utils'
import Footer from '@/components/Global/Footer'
import Hero from '@/components/Global/Hero'
import Nav from '@/components/Global/Nav'
import CTA from '@/components/Global/CTA'
-/**
- * @param props
- * @constructor
- */
-function Blog({ articles }) {
- // take only the first 3 articles
- const lastArticles = articles.slice(0, 3)
+export const metadata = {
+ description:
+ "L'actualité de My-Makeup, ce que nous faisons pour améliorer votre quotidien ! Et les nouveautés qui arrivent bientôt !",
+ // seo tag canonical link
+ alternates: {
+ canonical: 'https://my-makeup.fr/blog',
+ },
+ title: 'Blog de My-Makeup',
+}
+
+async function Blog() {
+ const articles = await getAllArticleOrderedByDesc()
+
+ const lastArticles = articles?.slice(0, 3)
return (
<>
-
- Blog de My-Makeup
-
- {/* seo tag canonical link */}
-
-
-
+
+
+
+ {
+ "Une idée, une envie de collaborer, une question ? N'hésitez pas à nous contacter !"
+ }
+ >
+ }
+ imgBackgroundSrc={'/assets/back/maquilleuse_europeenne_white.webp'}
+ isCTALoginDisplayed={false}
+ isSearchDisplayed={false}
+ isSimpleVersionDisplayed={true}
+ title={<>Contact>}
+ />
+
+
+ Un message en particulier ?
+
+
+ {
+ "Une demande particulière, un bug, une idée ? N'hésitez pas à nous contacter via le formulaire ci-dessous !"
+ }
+
+
+
+
+
+
+
+ Contactez-nous
+
+
+ {
+ "My-Makeup, plus qu'une plateforme de mise en relation, une équipe de passionnés à votre service !"
+ }
+