64 lines
1.8 KiB
JavaScript
64 lines
1.8 KiB
JavaScript
import { Grid, Container, Typography, Paper } from "@mui/material";
|
||
import Link from "next/link";
|
||
import { remark } from "remark";
|
||
import mdx from "remark-mdx";
|
||
import fs from "fs";
|
||
|
||
export default function Home({ posts }) {
|
||
return (
|
||
<Container>
|
||
<Grid container spacing={2}>
|
||
<Grid item xs={12}>
|
||
<Paper
|
||
style={{
|
||
padding: "1rem",
|
||
margin: "1rem",
|
||
backgroundColor: "#fafafa",
|
||
}}
|
||
>
|
||
<Typography variant="h3">窝</Typography>
|
||
<hr />
|
||
<Typography variant="body1">用对的工具，做对的事。</Typography>
|
||
</Paper>
|
||
</Grid>
|
||
{posts.map((post) => (
|
||
<Grid item sm={6} md={4} key={post.id}>
|
||
<Link href={`/posts/${post.id}`} passHref>
|
||
<Paper
|
||
style={{
|
||
padding: "1rem",
|
||
margin: "1rem",
|
||
backgroundColor: "#fafafa",
|
||
}}
|
||
>
|
||
<Typography variant="h5">{post.meta.title}</Typography>
|
||
<Typography variant="body1">{post.meta.description}</Typography>
|
||
</Paper>
|
||
</Link>
|
||
</Grid>
|
||
))}
|
||
</Grid>
|
||
</Container>
|
||
);
|
||
}
|
||
|
||
export async function getStaticProps(context) {
|
||
const posts = fs.readdirSync("./pages/posts").map((file) => {
|
||
const content = fs.readFileSync(`./pages/posts/${file}`, "utf8");
|
||
const remarkAST = remark().use(mdx).parse(content);
|
||
var { value, body } = remarkAST.children[0];
|
||
value = value.replaceAll("\n", "");
|
||
const toParse = value.slice(value.indexOf("{"), value.lastIndexOf("}") + 1);
|
||
const meta = JSON.parse(toParse);
|
||
return {
|
||
id: file.replace(".mdx", ""),
|
||
meta,
|
||
};
|
||
});
|
||
return {
|
||
props: {
|
||
posts,
|
||
},
|
||
};
|
||
}
|