Skip to content
This repository was archived by the owner on May 13, 2025. It is now read-only.

Commit dff994c

Browse files
okisdevokisdev
authored
feat(bump): 2.0.0 (#511)
1 parent b976fcf commit dff994c

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

73 files changed

+2348
-4787
lines changed

‎.env.example‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,14 @@
1-
NOTION_API =
2-
NOTION_TABLE_SLUG =
1+
# Notion
2+
NOTION_API_KEY=
3+
NOTION_DATABASE_ID=
4+
5+
# Redis
6+
REDIS_URL=
7+
REDIS_TOKEN=
8+
9+
# Umami
10+
NEXT_PUBLIC_UMAMI_URL=
11+
NEXT_PUBLIC_UMAMI_WEBSITE_ID=
12+
13+
# Site
14+
NEXT_PUBLIC_SITE_URL=

‎.eslintrc‎

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎.gitignore‎

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,12 @@
33
# dependencies
44
/node_modules
55
/.pnp
6-
.pnp.js
6+
.pnp.*
7+
.yarn/*
8+
!.yarn/patches
9+
!.yarn/plugins
10+
!.yarn/releases
11+
!.yarn/versions
712

813
# testing
914
/coverage
@@ -23,12 +28,17 @@
2328
npm-debug.log*
2429
yarn-debug.log*
2530
yarn-error.log*
31+
.pnpm-debug.log*
2632

27-
# local env files
28-
.env.local
29-
.env.development.local
30-
.env.test.local
31-
.env.production.local
33+
# env files (can opt-in for committing if needed)
34+
.env*
3235

3336
# vercel
3437
.vercel
38+
39+
# typescript
40+
*.tsbuildinfo
41+
next-env.d.ts
42+
43+
# Turborepo
44+
.turbo

‎.vscode/settings.json‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"editor.codeActionsOnSave": {
3+
"source.organizeImports.biome": "explicit"
4+
},
5+
"i18n-ally.localesPaths": [
6+
"**/locales"
7+
]
8+
}

‎LICENSE‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
MIT License
22

3-
Copyright (c) 2021 Harry Yep
3+
Copyright (c) 2025 Harry Yep
44

55
Permission is hereby granted, free of charge, to any person obtaining a copy
66
of this software and associated documentation files (the "Software"), to deal
@@ -18,4 +18,4 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
1818
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
1919
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
2020
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21-
SOFTWARE.
21+
SOFTWARE.

‎README.md‎

Lines changed: 3 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -1,70 +1,20 @@
11
# Notion Blog React
22

3-
[**English**](#) | [简体中文](README.zh-CN.md)
3+
> A Notion Blog powered by Next.js
44
5-
> A fast serverless Blog powered by Notion.
6-
7-
A Blog powered by [Notion](https://notion.so), built with [React.JS](https://reactjs.org), [Next.JS](https://nextjs.org), [tailwindcss](https://tailwindcss.com), [TypeScript](https://www.typescriptlang.org/), [notion-api-worker](https://github.com/splitbee/notion-api-worker), [React-Notion-X](https://github.com/NotionX/react-notion-x/) and more.
8-
9-
> See [Notion Photo React](https://github.com/Harry-Yep/Notion-Photo-React), if you would like to create a personal photo gallery website powered by Notion.
5+
> See [Notion Photo React](https://github.com/okisdev/Notion-Photo-React) for a similar project that uses Notion as a database for photos.
106
117
## Demo
128

139
- [nbr.okis.dev](https://nbr.okis.dev)
1410

15-
## Features
16-
17-
Please see the **[features section](https://github.com/NotionX/react-notion-x#features)** on React-Notion-X by [NotionX](https://github.com/NotionX/).
18-
19-
And also, you can...
20-
21-
- Easily change the things you want by editing [`.env`](./.env.example) file.
22-
- Support [Google Analytics](https://analytics.google.com/) & [Splitbee Analytics](https://splitbee.io/).
23-
- Self host notion-api by using [Cloudflare Workers](https://workers.dev). (Default [notion-api](https://notion-api.splitbee.io) By Splitbee)
24-
- Use your favorite Google Fonts.
25-
- Use your own domain.
26-
27-
## Performance
28-
29-
![Notion-Blog-React-Lighthouse-Performance-Desktop](https://cdn.harrly.com/project/GitHub/Notion-Blog-React/img/Lighthouse-Performance-Desktop.png)
30-
31-
- Use [Lighthouse](https://developers.google.com/web/tools/lighthouse) for testing
32-
33-
## Known Issues
34-
35-
- ❌ Some Notion blocks is not supported. (Please see [here](https://github.com/NotionX/react-notion-x#supported-blocks) for more info.)
36-
3711
## How to deploy
3812

3913
Please visit Notion Blog React [Documentation](https://docs.okis.dev/docs/notion-blog-react) for more details.
4014

4115
## Problem(s) with deployment
4216

4317
- email: [hi@okis.dev](mailto:hi@okis.dev)
44-
- Telegram: [@okisdev](https://t.me/okisdev)
45-
46-
## Improvement / Plans
47-
48-
- [x] Add [React-Notion-X](https://github.com/NotionX/react-notion-x) supported or Mix current api with [React-Notion-X](https://github.com/NotionX/react-notion-x).
49-
- [x] Using [Notion Official API](https://developers.notion.com/). (Blogging entirely using Notion's official API is finished and hope to release it soon in the future)
50-
- [ ] Add PostView.
51-
- [ ] Add Tag.
52-
53-
## Related (Examples or Technology being used)
54-
55-
- [Splitee Blog](https://splitbee.io/blog) (using React-Notion, contributor of React-Notion)
56-
- [timo.sh](https://timo.sh/) (using React-Notion, contributor of React-Notion)
57-
- [TransitiveBullsh.it](https://transitivebullsh.it/) (using React-Notion-X, contributor of React-Notion-X)
58-
- [Vercel](https://vercel.com)
59-
- [Cloudflare Workers](https://workers.dev)
60-
- [React](https://reactjs.org)
61-
- [Next.js](https://nextjs.org)
62-
- [tailwindcss](https://tailwindcss.com)
63-
- [TypeScript](https://www.typescriptlang.org/)
64-
- [Notion-Api-Worker](https://github.com/splitbee/notion-api-worker)
65-
- [React-Notion-X](https://github.com/NotionX/react-notion-x)
66-
- [Google Analytics](https://analytics.google.com/)
67-
- [Splitee](https://splitbee.io/)
6818

6919
## Alternatives
7020

@@ -77,6 +27,4 @@ Please visit Notion Blog React [Documentation](https://docs.okis.dev/docs/notion
7727

7828
## Credits
7929

80-
Copyright (c) 2022 Harry Yep
81-
82-
- All Authors & Contributors who own its repository
30+
Copyright (c) 2025 Harry Yep

‎README.zh-CN.md‎

Lines changed: 0 additions & 80 deletions
This file was deleted.

‎app/(posts)/[slug]/opengraph-image.tsx‎

Lines changed: 145 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,145 @@
1+
import { env } from '@/lib/env';
2+
import { getPostBySlug } from '@/lib/notion';
3+
import { format } from 'date-fns';
4+
import { ImageResponse } from 'next/og';
5+
6+
export const size = {
7+
width: 1200,
8+
height: 630,
9+
};
10+
11+
export const contentType = 'image/png';
12+
13+
// Image generation
14+
export default async function Image({ params }: { params: { slug: string } }) {
15+
const post = await getPostBySlug(params.slug);
16+
17+
if (!post) {
18+
return new Response('Not found', { status: 404 });
19+
}
20+
21+
return new ImageResponse(
22+
// ImageResponse JSX element
23+
<div
24+
style={{
25+
height: '100%',
26+
width: '100%',
27+
display: 'flex',
28+
flexDirection: 'column',
29+
backgroundColor: 'white',
30+
padding: '60px 80px',
31+
fontFamily: 'Inter, system-ui, sans-serif',
32+
}}
33+
>
34+
{/* Header with logo */}
35+
<div
36+
style={{
37+
display: 'flex',
38+
alignItems: 'center',
39+
marginBottom: '40px',
40+
}}
41+
>
42+
{/* biome-ignore lint/a11y/noSvgWithoutTitle: <explanation> */}
43+
<svg height={40} viewBox='0 0 75 65' fill='black' style={{ marginRight: '20px' }}>
44+
<path d='M37.59.25l36.95 64H.64l36.95-64z' />
45+
</svg>
46+
<div
47+
style={{
48+
fontSize: '24px',
49+
fontWeight: 'bold',
50+
color: 'black',
51+
}}
52+
>
53+
Notion Blog React
54+
</div>
55+
</div>
56+
57+
{/* Main content */}
58+
<div
59+
style={{
60+
display: 'flex',
61+
flexDirection: 'column',
62+
flex: 1,
63+
justifyContent: 'center',
64+
}}
65+
>
66+
{/* Title */}
67+
<h1
68+
style={{
69+
fontSize: '60px',
70+
fontWeight: 'bold',
71+
color: 'black',
72+
marginBottom: '30px',
73+
lineHeight: 1.2,
74+
maxWidth: '1000px',
75+
}}
76+
>
77+
{post.title}
78+
</h1>
79+
80+
{/* Metadata */}
81+
<div
82+
style={{
83+
display: 'flex',
84+
alignItems: 'center',
85+
marginBottom: '20px',
86+
fontSize: '24px',
87+
color: '#666',
88+
}}
89+
>
90+
{post.date && <div style={{ marginRight: '20px' }}>{format(new Date(post.date), 'MMMM d, yyyy')}</div>}
91+
92+
{post.tag && post.tag.length > 0 && (
93+
<div style={{ display: 'flex', gap: '10px' }}>
94+
{post.tag.map((tag) => (
95+
<div
96+
key={tag}
97+
style={{
98+
backgroundColor: '#f0f0f0',
99+
padding: '4px 12px',
100+
borderRadius: '4px',
101+
fontSize: '18px',
102+
}}
103+
>
104+
{tag}
105+
</div>
106+
))}
107+
</div>
108+
)}
109+
</div>
110+
111+
{/* Description if available */}
112+
{post.description && (
113+
<div
114+
style={{
115+
fontSize: '28px',
116+
color: '#444',
117+
maxWidth: '900px',
118+
lineHeight: 1.4,
119+
}}
120+
>
121+
{post.description}
122+
</div>
123+
)}
124+
</div>
125+
126+
{/* Footer */}
127+
<div
128+
style={{
129+
display: 'flex',
130+
justifyContent: 'space-between',
131+
alignItems: 'center',
132+
marginTop: '40px',
133+
fontSize: '20px',
134+
color: '#666',
135+
}}
136+
>
137+
<div>{env.NEXT_PUBLIC_SITE_URL}</div>
138+
<div>Read more →</div>
139+
</div>
140+
</div>,
141+
{
142+
...size,
143+
}
144+
);
145+
}

0 commit comments

Comments
 (0)