(oluşturuldu) blog görünümü oluşturuldu

This commit is contained in:
Yusuf İpek
2021-08-12 15:25:04 +03:00
parent 384d5bc799
commit 2f74cdf1f1
7 changed files with 1139 additions and 15 deletions
+2 -4
View File
@@ -2,16 +2,14 @@ export default function Hakkinda() {
return (
<div className="about">
<div>
<h1 className="heading-1 u-center-text u-margin-bottom-small">
Site Hakkında
</h1>
<h1 className="u-center-text u-margin-bottom-small">Site Hakkında</h1>
<p>
Bu websitesinde reklam, izleyici veya çerez yoktur ve herkes rehber
yazabilir.
</p>
</div>
<div>
<h2 className="heading-2">Nasıl Rehber Yazarım?</h2>
<h2>Nasıl Rehber Yazarım?</h2>
<ul className="about_list">
<li>
<a href="#">Örnek rehberi</a> indirin ve kuralları okuyun.{" "}
+78
View File
@@ -0,0 +1,78 @@
import Head from "next/head";
import Image from "next/image";
import { createClient } from "contentful";
import ReactMarkdown from "react-markdown";
export default function PostDetails({ posts }) {
if (!posts)
return (
<div className="loading">
<Head>
<title> Loading... </title>
</Head>
<h1 className="heading-1 u-center-text">Yükleniyor...</h1>
</div>
);
const { title, featuredImage, rehber, description } = posts.fields;
return (
<div className="markdown">
<Head>
<title>{title} - Teknoloji Rehberleri</title>
<meta name="description" content={description} />
<meta property="og:title" content={`${title} - Teknoloji Rehberleri`} />
<meta property="og:description" content={description} />
<meta
property="og:image"
content={`https:${featuredImage.fields.file.url}`}
/>
</Head>
<Image
src={`https:${featuredImage.fields.file.url}`}
alt={featuredImage.fields.file.fileName}
width={featuredImage.fields.file.details.image.width}
height={featuredImage.fields.file.details.image.height}
className="markdown_featuredImage"
/>
<ReactMarkdown>{rehber}</ReactMarkdown>
</div>
);
}
const client = createClient({
space: process.env.CONTENTFUL_SPACE_ID,
accessToken: process.env.CONTENTFUL_ACCESS_KEY,
});
export const getStaticPaths = async () => {
const res = await client.getEntries({ content_type: "rehber" });
const paths = res.items.map((item) => {
return {
params: { slug: item.fields.slug },
};
});
return {
paths,
fallback: true,
};
};
export async function getStaticProps({ params }) {
const { items } = await client.getEntries({
content_type: "rehber",
"fields.slug": params.slug,
});
if (!items.length) {
return { redirect: { destination: "/404", permanent: false } };
}
return {
props: { posts: items[0] },
revalidate: 10,
};
}