initial commit

src/Pages/Blog/Blog.jsx

@@ -0,0 +1,50 @@
+import { Link } from "react-router"
+import { useEffect, useState } from "react";
+
+export default function Blog({lang}){
+    const [articles, setArticles] = useState([])
+    const [loading, setLoading] = useState(true)
+    
+    useEffect(() => {
+        
+        fetch(`${import.meta.env.VITE_DIRECTUS_URL}/items/Blog`)
+        .then(res => res.json())
+        .then(data => {setArticles(data.data), setLoading(false), console.log(data.data)})
+        
+    }, [])
+    
+    if(loading === true){
+        return(
+            <span className="Loading">
+                Loading
+            </span>
+        )
+    }
+    
+    return(
+        <section>
+            <div className="breadcrumb">
+                <Link to="/">Home</Link>
+                <span>/</span>
+                <h1>Blog</h1>
+            </div>
+            <div className="separator"></div>
+            {articles?.map((e,i)=>{return(
+            <Link to={`/blog/article?id=${e.id}`} key={`article${i}${lang}`} className="BlogElement">
+                <h2>Titre</h2>
+                    <div className="separator"></div>
+                    <div className="HomeImg">
+                        <img src={`${import.meta.env.VITE_DIRECTUS_URL + "/assets/" + e?.presentation }`} alt="" />
+                
+                    </div>
+                    {lang === "fr" ? 
+                            <h3>{e.title}</h3>
+                        : <h3>{e.title_en}</h3>}
+            </Link>
+                
+            )})}
+            
+            
+        </section>
+    )
+}