mirror of
https://github.com/DefectingCat/DefectingCat.github.io
synced 2025-07-15 16:51:37 +00:00
Add fetch post list
* add gray-matter
This commit is contained in:
@ -52,14 +52,14 @@ const HeadBar: FC = () => {
|
||||
className={cn(
|
||||
'text-lg md:block',
|
||||
'bg-white rounded-md',
|
||||
'dark:bg-rua-gray-800',
|
||||
'absolute md:static',
|
||||
'p-5 right-6 top-14',
|
||||
'md:bg-transparent md:p-[unset]',
|
||||
'md:right-[unset] md:top-[unset]',
|
||||
'w-1/3 md:w-auto',
|
||||
{
|
||||
hidden: !showMenu,
|
||||
}
|
||||
'md:dark:bg-transparent',
|
||||
showMenu || 'hidden'
|
||||
)}
|
||||
>
|
||||
<ul className={cn('flex flex-col', 'md:flex-row')}>
|
||||
|
4
lib/utils/constant.ts
Normal file
4
lib/utils/constant.ts
Normal file
@ -0,0 +1,4 @@
|
||||
export const server =
|
||||
process.env.NODE_ENV === 'development'
|
||||
? 'http://localhost:3000'
|
||||
: 'https://rua.plus';
|
12
lib/utils/index.ts
Normal file
12
lib/utils/index.ts
Normal file
@ -0,0 +1,12 @@
|
||||
export const sortByDate = (
|
||||
{ date: a }: { date: string },
|
||||
{ date: b }: { date: string }
|
||||
) => {
|
||||
if (a < b) {
|
||||
return 1;
|
||||
} else if (a > b) {
|
||||
return -1;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
};
|
@ -29,6 +29,7 @@
|
||||
"autoprefixer": "^10.4.4",
|
||||
"eslint": "8.11.0",
|
||||
"eslint-config-next": "12.1.0",
|
||||
"gray-matter": "^4.0.3",
|
||||
"jest": "^27.5.1",
|
||||
"postcss": "^8.4.12",
|
||||
"tailwindcss": "^3.0.23",
|
||||
|
38
pages/api/posts.ts
Normal file
38
pages/api/posts.ts
Normal file
@ -0,0 +1,38 @@
|
||||
import type { NextApiRequest, NextApiResponse } from 'next';
|
||||
import fs from 'fs';
|
||||
import path from 'path';
|
||||
import matter from 'gray-matter';
|
||||
import { MyMatters, Post } from 'types';
|
||||
import { sortByDate } from 'lib/utils';
|
||||
|
||||
export default async function handler(
|
||||
req: NextApiRequest,
|
||||
res: NextApiResponse<Post[]>
|
||||
) {
|
||||
const getPosts = () => {
|
||||
const files = fs.readdirSync(path.join('pages/p'));
|
||||
const posts = files
|
||||
.map((filename) => {
|
||||
const markdownWithMeta = fs.readFileSync(
|
||||
path.join('pages/p', filename),
|
||||
'utf-8'
|
||||
);
|
||||
const slug = filename.replace(/\.mdx$/, '');
|
||||
const { data: meta } = matter(markdownWithMeta);
|
||||
return {
|
||||
slug,
|
||||
...({ ...meta } as MyMatters),
|
||||
};
|
||||
})
|
||||
.sort(sortByDate);
|
||||
|
||||
res.status(200).json(posts);
|
||||
};
|
||||
|
||||
switch (req.method) {
|
||||
case 'GET':
|
||||
return getPosts();
|
||||
default:
|
||||
return res.status(405).end(`Method ${req.method} Not Allowed`);
|
||||
}
|
||||
}
|
@ -1,7 +1,40 @@
|
||||
import { FC } from 'react';
|
||||
import MainLayout from 'layouts/MainLayout';
|
||||
import { Post } from 'types';
|
||||
import { InferGetStaticPropsType } from 'next';
|
||||
import { ReactElement } from 'react';
|
||||
import { server } from 'lib/utils/constant';
|
||||
|
||||
const Blog: FC = () => {
|
||||
return <></>;
|
||||
const Blog = ({ posts }: InferGetStaticPropsType<typeof getStaticProps>) => {
|
||||
return (
|
||||
<>
|
||||
<main className="max-w-3xl mx-auto">
|
||||
<h1 className="text-5xl font-semibold text-center font-Barlow">
|
||||
Blog posts
|
||||
</h1>
|
||||
|
||||
<div>
|
||||
{posts.map((post) => (
|
||||
<article key={post.slug}>{post.title}</article>
|
||||
))}
|
||||
</div>
|
||||
</main>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export const getStaticProps = async () => {
|
||||
const response = await fetch(`${server}/api/posts`);
|
||||
const posts = (await response.json()) as Post[];
|
||||
|
||||
return {
|
||||
props: {
|
||||
posts,
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
Blog.getLayout = function getLayout(page: ReactElement) {
|
||||
return <MainLayout>{page}</MainLayout>;
|
||||
};
|
||||
|
||||
export default Blog;
|
||||
|
@ -1,3 +1,9 @@
|
||||
---
|
||||
title: First post test
|
||||
date: '2022-03-22'
|
||||
tags: ['functions', 'javascript']
|
||||
---
|
||||
|
||||
## Hello
|
||||
|
||||
This is my first post.
|
||||
|
@ -9,3 +9,13 @@ export type NextPageWithLayout = {
|
||||
export type AppPropsWithLayout = AppProps & {
|
||||
Component: NextPageWithLayout;
|
||||
};
|
||||
|
||||
export interface MyMatters {
|
||||
title: string;
|
||||
date: string;
|
||||
tags: string;
|
||||
}
|
||||
|
||||
export interface Post extends MyMatters {
|
||||
slug: string;
|
||||
}
|
||||
|
40
yarn.lock
40
yarn.lock
@ -2083,6 +2083,13 @@ expect@^27.5.1:
|
||||
jest-matcher-utils "^27.5.1"
|
||||
jest-message-util "^27.5.1"
|
||||
|
||||
extend-shallow@^2.0.1:
|
||||
version "2.0.1"
|
||||
resolved "https://registry.npmmirror.com/extend-shallow/-/extend-shallow-2.0.1.tgz#51af7d614ad9a9f610ea1bafbb989d6b1c56890f"
|
||||
integrity sha512-zCnTtlxNoAiDc3gqY2aYAWFx7XWWiasuF2K8Me5WbN8otHKTUKBwjPtNpRs/rbUZm7KxWAaNj7P1a/p52GbVug==
|
||||
dependencies:
|
||||
is-extendable "^0.1.0"
|
||||
|
||||
extend@^3.0.0:
|
||||
version "3.0.2"
|
||||
resolved "https://registry.npmmirror.com/extend/-/extend-3.0.2.tgz#f8b1136b4071fbd8eb140aff858b1019ec2915fa"
|
||||
@ -2308,6 +2315,16 @@ graceful-fs@^4.2.9:
|
||||
resolved "https://registry.npmmirror.com/graceful-fs/-/graceful-fs-4.2.9.tgz#041b05df45755e587a24942279b9d113146e1c96"
|
||||
integrity sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ==
|
||||
|
||||
gray-matter@^4.0.3:
|
||||
version "4.0.3"
|
||||
resolved "https://registry.npmmirror.com/gray-matter/-/gray-matter-4.0.3.tgz#e893c064825de73ea1f5f7d88c7a9f7274288798"
|
||||
integrity sha512-5v6yZd4JK3eMI3FqqCouswVqwugaA9r4dNZB1wwcmrD02QkV5H0y7XBQW8QwQqEaZY1pM9aqORSORhJRdNK44Q==
|
||||
dependencies:
|
||||
js-yaml "^3.13.1"
|
||||
kind-of "^6.0.2"
|
||||
section-matter "^1.0.0"
|
||||
strip-bom-string "^1.0.0"
|
||||
|
||||
has-bigints@^1.0.1:
|
||||
version "1.0.1"
|
||||
resolved "https://registry.yarnpkg.com/has-bigints/-/has-bigints-1.0.1.tgz#64fe6acb020673e3b78db035a5af69aa9d07b113"
|
||||
@ -2535,6 +2552,11 @@ is-decimal@^2.0.0:
|
||||
resolved "https://registry.npmmirror.com/is-decimal/-/is-decimal-2.0.1.tgz#9469d2dc190d0214fd87d78b78caecc0cc14eef7"
|
||||
integrity sha512-AAB9hiomQs5DXWcRB1rqsxGUstbRroFOPPVAomNk/3XHR5JyEZChOyTWe2oayKnsSsr/kcGqF+z6yuH6HHpN0A==
|
||||
|
||||
is-extendable@^0.1.0:
|
||||
version "0.1.1"
|
||||
resolved "https://registry.npmmirror.com/is-extendable/-/is-extendable-0.1.1.tgz#62b110e289a471418e3ec36a617d472e301dfc89"
|
||||
integrity sha512-5BMULNob1vgFX6EjQw5izWDxrecWK9AM72rugNr0TFldMOi0fj6Jk+zeKIt0xGj4cEfQIJth4w3OKWOJ4f+AFw==
|
||||
|
||||
is-extglob@^2.1.1:
|
||||
version "2.1.1"
|
||||
resolved "https://registry.yarnpkg.com/is-extglob/-/is-extglob-2.1.1.tgz#a88c02535791f02ed37c76a1b9ea9773c833f8c2"
|
||||
@ -3185,6 +3207,11 @@ json5@^2.1.2:
|
||||
array-includes "^3.1.3"
|
||||
object.assign "^4.1.2"
|
||||
|
||||
kind-of@^6.0.0, kind-of@^6.0.2:
|
||||
version "6.0.3"
|
||||
resolved "https://registry.npmmirror.com/kind-of/-/kind-of-6.0.3.tgz#07c05034a6c349fa06e24fa35aa76db4580ce4dd"
|
||||
integrity sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==
|
||||
|
||||
kleur@^3.0.3:
|
||||
version "3.0.3"
|
||||
resolved "https://registry.npmmirror.com/kleur/-/kleur-3.0.3.tgz#a79c9ecc86ee1ce3fa6206d1216c501f147fc07e"
|
||||
@ -4383,6 +4410,14 @@ scheduler@^0.20.2:
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.1"
|
||||
|
||||
section-matter@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.npmmirror.com/section-matter/-/section-matter-1.0.0.tgz#e9041953506780ec01d59f292a19c7b850b84167"
|
||||
integrity sha512-vfD3pmTzGpufjScBh50YHKzEu2lxBWhVEHsNGoEXmCmn2hKGfeNLYMzCJpe8cD7gqX7TJluOVpBkAequ6dgMmA==
|
||||
dependencies:
|
||||
extend-shallow "^2.0.1"
|
||||
kind-of "^6.0.0"
|
||||
|
||||
semver@^6.0.0, semver@^6.3.0:
|
||||
version "6.3.0"
|
||||
resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d"
|
||||
@ -4546,6 +4581,11 @@ strip-ansi@^6.0.0, strip-ansi@^6.0.1:
|
||||
dependencies:
|
||||
ansi-regex "^5.0.1"
|
||||
|
||||
strip-bom-string@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.npmmirror.com/strip-bom-string/-/strip-bom-string-1.0.0.tgz#e5211e9224369fbb81d633a2f00044dc8cedad92"
|
||||
integrity sha512-uCC2VHvQRYu+lMh4My/sFNmF2klFymLX1wHJeXnbEJERpV/ZsVuonzerjfrGpIGF7LBVa1O7i9kjiWvJiFck8g==
|
||||
|
||||
strip-bom@^3.0.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.yarnpkg.com/strip-bom/-/strip-bom-3.0.0.tgz#2334c18e9c759f7bdd56fdef7e9ae3d588e68ed3"
|
||||
|
Reference in New Issue
Block a user