Skip to content

Commit e7cede9

Browse files
author
wutali
committed
Initial commit from Create Next App
0 parents  commit e7cede9

21 files changed

+7732
-0
lines changed

‎.gitignore

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
8+
# testing
9+
/coverage
10+
11+
# next.js
12+
/.next/
13+
/out/
14+
15+
# production
16+
/build
17+
18+
# misc
19+
.DS_Store
20+
.env*
21+
22+
# debug
23+
npm-debug.log*
24+
yarn-debug.log*
25+
yarn-error.log*

‎README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
This is a starter template for [Learn Next.js](https://nextjs.org/learn).

‎components/date.tsx

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { parseISO, format } from 'date-fns'
2+
3+
export default function Date({ dateString }: { dateString: string }) {
4+
const date = parseISO(dateString)
5+
return <time dateTime={dateString}>{format(date, 'LLLL d, yyyy')}</time>
6+
}

‎components/layout.module.css

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
.container {
2+
max-width: 36rem;
3+
padding: 0 1rem;
4+
margin: 3rem auto 6rem;
5+
}
6+
7+
.header {
8+
display: flex;
9+
flex-direction: column;
10+
align-items: center;
11+
}
12+
13+
.headerImage {
14+
width: 6rem;
15+
height: 6rem;
16+
}
17+
18+
.headerHomeImage {
19+
width: 8rem;
20+
height: 8rem;
21+
}
22+
23+
.backToHome {
24+
margin: 3rem 0 0;
25+
}

‎components/layout.tsx

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
import Head from 'next/head'
2+
import styles from './layout.module.css'
3+
import utilStyles from '../styles/utils.module.css'
4+
import Link from 'next/link'
5+
6+
const name = '[Your Name]'
7+
export const siteTitle = 'Next.js Sample Website'
8+
9+
export default function Layout({
10+
children,
11+
home
12+
}: {
13+
children: React.ReactNode
14+
home?: boolean
15+
}) {
16+
return (
17+
<div className={styles.container}>
18+
<Head>
19+
<link rel="icon" href="/favicon.ico" />
20+
<meta
21+
name="description"
22+
content="Learn how to build a personal website using Next.js"
23+
/>
24+
<meta
25+
property="og:image"
26+
content={`https://og-image.now.sh/${encodeURI(
27+
siteTitle
28+
)}.png?theme=light&md=0&fontSize=75px&images=https%3A%2F%2Fassets.zeit.co%2Fimage%2Fupload%2Ffront%2Fassets%2Fdesign%2Fnextjs-black-logo.svg`}
29+
/>
30+
<meta name="og:title" content={siteTitle} />
31+
<meta name="twitter:card" content="summary_large_image" />
32+
</Head>
33+
<header className={styles.header}>
34+
{home ? (
35+
<>
36+
<img
37+
src="/images/profile.jpg"
38+
className={`${styles.headerHomeImage} ${utilStyles.borderCircle}`}
39+
alt={name}
40+
/>
41+
<h1 className={utilStyles.heading2Xl}>{name}</h1>
42+
</>
43+
) : (
44+
<>
45+
<Link href="/">
46+
<a>
47+
<img
48+
src="/images/profile.jpg"
49+
className={`${styles.headerImage} ${utilStyles.borderCircle}`}
50+
alt={name}
51+
/>
52+
</a>
53+
</Link>
54+
<h2 className={utilStyles.headingLg}>
55+
<Link href="/">
56+
<a className={utilStyles.colorInherit}>{name}</a>
57+
</Link>
58+
</h2>
59+
</>
60+
)}
61+
</header>
62+
<main>{children}</main>
63+
{!home && (
64+
<div className={styles.backToHome}>
65+
<Link href="/">
66+
<a>← Back to home</a>
67+
</Link>
68+
</div>
69+
)}
70+
</div>
71+
)
72+
}

‎global.d.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
declare module 'remark-html' {
2+
const html: any
3+
export default html
4+
}

‎lib/posts.ts

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
import fs from 'fs'
2+
import path from 'path'
3+
import matter from 'gray-matter'
4+
import remark from 'remark'
5+
import html from 'remark-html'
6+
7+
const postsDirectory = path.join(process.cwd(), 'posts')
8+
9+
export function getSortedPostsData() {
10+
// Get file names under /posts
11+
const fileNames = fs.readdirSync(postsDirectory)
12+
const allPostsData = fileNames.map(fileName => {
13+
// Remove ".md" from file name to get id
14+
const id = fileName.replace(/\.md$/, '')
15+
16+
// Read markdown file as string
17+
const fullPath = path.join(postsDirectory, fileName)
18+
const fileContents = fs.readFileSync(fullPath, 'utf8')
19+
20+
// Use gray-matter to parse the post metadata section
21+
const matterResult = matter(fileContents)
22+
23+
// Combine the data with the id
24+
return {
25+
id,
26+
...(matterResult.data as { date: string; title: string })
27+
}
28+
})
29+
// Sort posts by date
30+
return allPostsData.sort((a, b) => {
31+
if (a.date < b.date) {
32+
return 1
33+
} else {
34+
return -1
35+
}
36+
})
37+
}
38+
39+
export function getAllPostIds() {
40+
const fileNames = fs.readdirSync(postsDirectory)
41+
return fileNames.map(fileName => {
42+
return {
43+
params: {
44+
id: fileName.replace(/\.md$/, '')
45+
}
46+
}
47+
})
48+
}
49+
50+
export async function getPostData(id: string) {
51+
const fullPath = path.join(postsDirectory, `${id}.md`)
52+
const fileContents = fs.readFileSync(fullPath, 'utf8')
53+
54+
// Use gray-matter to parse the post metadata section
55+
const matterResult = matter(fileContents)
56+
57+
// Use remark to convert markdown into HTML string
58+
const processedContent = await remark()
59+
.use(html)
60+
.process(matterResult.content)
61+
const contentHtml = processedContent.toString()
62+
63+
// Combine the data with the id and contentHtml
64+
return {
65+
id,
66+
contentHtml,
67+
...(matterResult.data as { date: string; title: string })
68+
}
69+
}

‎next-env.d.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
/// <reference types="next" />
2+
/// <reference types="next/types/global" />

0 commit comments

Comments
 (0)