upload

.editorconfig

@@ -0,0 +1,13 @@
+# EditorConfig is awesome: https://EditorConfig.org
+
+# top-most EditorConfig file
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = crlf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = false
+quote_type = single

.env.example

@@ -0,0 +1,39 @@
+# oauth app
+GITHUB_ID=
+GITHUB_SECRET=
+
+
+GITHUB_ACCESS_TOKEN=
+GITHUB_API_BASEURL=
+
+# BLOG SETTINGS
+PIXABAY_KEY=
+DEFAULT_COVER=
+
+# Created by Vercel CLI
+EDGE_CONFIG=
+NX_DAEMON=
+OPENAI_API_KEY=
+POSTGRES_DATABASE="verceldb"
+POSTGRES_HOST=
+POSTGRES_PASSWORD=
+POSTGRES_PRISMA_URL=
+POSTGRES_URL=
+POSTGRES_URL_NON_POOLING=
+POSTGRES_USER="default"
+TURBO_REMOTE_ONLY=""
+TURBO_RUN_SUMMARY=""
+VERCEL="1"
+VERCEL_ENV="development"
+VERCEL_GIT_COMMIT_AUTHOR_LOGIN=""
+VERCEL_GIT_COMMIT_AUTHOR_NAME=""
+VERCEL_GIT_COMMIT_MESSAGE=""
+VERCEL_GIT_COMMIT_REF=""
+VERCEL_GIT_COMMIT_SHA=""
+VERCEL_GIT_PREVIOUS_SHA=""
+VERCEL_GIT_PROVIDER=""
+VERCEL_GIT_PULL_REQUEST_ID=""
+VERCEL_GIT_REPO_ID=""
+VERCEL_GIT_REPO_OWNER=""
+VERCEL_GIT_REPO_SLUG=""
+VERCEL_URL=""

.eslintrc.json

@@ -0,0 +1,7 @@
+{
+  "extends": "next/core-web-vitals",
+  "rules": {
+    "react-hooks/rules-of-hooks": "off",
+    "@next/next/no-img-element": "off"
+  }
+}

.gitignore

@@ -0,0 +1,39 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+
+.vercel
+
+.env

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 akirco
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,61 @@
+This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
+
+[中文](READMD_CN.md)
+
+## Next.js and GitHub Gist-based Blog
+
+### Project Description
+
+This project is a blog system based on Next.js and GitHub Gist. It supports code snippets in various languages, including TypeScript, JavaScript, TSX, JSON, JSON5, Python, Rust, Go, PHP, Lua, Shell, PowerShell, HTML, CSS, and SCSS. Code snippets are displayed in code blocks. Markdown and MDX files are rendered into beautiful web pages using next-mdx-remote.
+
+Additionally, this blog system supports categories, tags, and article archives. The commenting feature is currently under testing and will be introduced in future versions. There are also plans to synchronize the star feature of GitHub Gist, allowing users to bookmark articles.
+
+### Tech Stack
+
+Next.js
+TypeScript
+GitHub Gist
+
+### Features
+
+Support for code snippets in multiple languages
+Render Markdown and MDX files using next-mdx-remote
+Support for categories, tags, and article archives
+Commenting feature (under testing)
+Planned synchronization of GitHub Gist star feature
+
+### Installation and Usage
+
+- Clone the project
+- Create a postgres database on Vercel
+- Pull the environment variables
+
+```shell
+# Customize the following
+GITHUB_ID=
+GITHUB_SECRET=
+GITHUB_ACCESS_TOKEN=
+GITHUB_API_BASEURL="https://api.github.com"
+# PIXABAY API KEY
+PIXABAY_KEY=
+# Direct link to the cover image
+DEFAULT_COVER=
+```
+
+- Test and deploy
+
+```shell
+npm run dev
+
+vercel --prod
+```
+
+- [Rules for Writing Blog Content](https://gist.github.com/akirco/4543214ca7eeee637873f9cad20f545e)
+
+### Contribution
+
+Contributions to this project are welcome. If you find any issues or have suggestions for improvements, please submit an issue or provide a Pull Request.
+
+### License
+
+This project is licensed under the MIT License.

README_CN.md

@@ -0,0 +1,65 @@
+## 基于 Next.js 和 GitHub Gist 的博客
+
+[English](./README.md)
+
+### 项目简介
+
+> 该项目是一个基于 Next.js 和 GitHub Gist 的博客系统。 TypeScript、JavaScript、TSX、JSON、JSON5、Python、Rust、Go、PHP、Lua、Shell、PowerShell、HTML、CSS 和 SCSS 代码段以代码块的形式展示。
+
+对于 Markdown 和 MDX 文件，使用 next-mdx-remote 渲染成漂亮的网页。
+
+> 此外，该博客系统还支持分类、标签和文章归档功能。评论功能目前正在测试中，并计划在后续版本中引入。同时，也计划同步 GitHub Gist 的收藏功能，实现博文收藏。
+
+### 技术栈
+
+Next.js
+TypeScript
+GitHub Gist
+
+### 功能特点
+
+支持多种语言的代码展示
+
+使用 next-mdx-remote 渲染 Markdown 和 MDX 文件
+
+支持分类、标签和文章归档
+
+支持评论功能（正在测试中）
+
+计划同步 GitHub Gist 的收藏功能
+
+计划增强 mdx
+
+### 安装和使用
+
+- 克隆该项目
+- vercel 创建 postgres 数据库
+- 拉取环境变量
+
+```shell
+# 以下自定义
+GITHUB_ID=
+GITHUB_SECRET=
+GITHUB_ACCESS_TOKEN=
+GITHUB_API_BASEURL="https://api.github.com"、
+# PIXABAY API KEY
+PIXABAY_KEY=
+# 封面图片直链
+DEFAULT_COVER=
+```
+
+- 测试并部署
+
+```shell
+vercel --prod
+```
+
+- [博文书写规则，更多细节自己探索或联系我](https://gist.github.com/akirco/4543214ca7eeee637873f9cad20f545e)
+
+### 贡献
+
+欢迎对该项目进行贡献。如果您发现了问题或有改进的建议，请提交 issue 或者直接提供 Pull Request。
+
+### 许可证
+
+该项目基于 MIT 许可证 开源。

app/about/page.tsx

@@ -0,0 +1,88 @@
+import { edgeConfigClient } from '@/libs/utils/edge';
+import Link from 'next/link';
+import { FaTwitter, FaGithub, FaCodepen, FaReddit } from 'react-icons/fa';
+
+export default async function About() {
+  const about = (await edgeConfigClient.get('about')) as Blog.About;
+
+  const titleMappings: Record<string, () => JSX.Element> = {
+    contact: () => (
+      <div key="contact" className="flex flex-col gap-3 ">
+        <h1 className="text-3xl font-bold ">contact</h1>
+        <div className="flex gap-4">
+          <Link
+            href={about.contact.codepen}
+            target="_blank"
+            className="px-2 py-2 text-xl border rounded-md hover:bg-background-primary border-border-primary backdrop-blur-md"
+          >
+            <FaCodepen />
+          </Link>
+          <Link
+            href={about.contact.github}
+            target="_blank"
+            className="px-2 py-2 text-xl border rounded-md hover:bg-background-primary border-border-primary backdrop-blur-md"
+          >
+            <FaGithub />
+          </Link>
+          <Link
+            href={about.contact.twitter}
+            target="_blank"
+            className="px-2 py-2 text-xl border rounded-md hover:bg-background-primary border-border-primary backdrop-blur-md"
+          >
+            <FaTwitter />
+          </Link>
+          <Link
+            href={about.contact.reddit}
+            target="_blank"
+            className="px-2 py-2 text-xl border rounded-md hover:bg-background-primary border-border-primary backdrop-blur-md"
+          >
+            <FaReddit />
+          </Link>
+        </div>
+        <p>{about.contact.email}</p>
+      </div>
+    ),
+    site: () => (
+      <div key="site">
+        <h1 className="text-3xl font-bold ">site</h1>
+        <p>{about.site.description}</p>
+        <p>
+          {about.site.features.map((fea) => {
+            return <li key={fea}>{fea}</li>;
+          })}
+        </p>
+      </div>
+    ),
+    technology: () => (
+      <div key={'technology'}>
+        <h1 className="text-3xl font-bold ">technology</h1>
+        <div className="flex flex-wrap gap-2 py-5">
+          {about.technology.map((r) => {
+            return (
+              <p
+                key={r}
+                className="px-3 py-1 rounded-2xl bg-background-primary"
+              >
+                {r}
+              </p>
+            );
+          })}
+        </div>
+      </div>
+    ),
+  };
+
+  return (
+    <div className="flex flex-col w-full gap-5 px-2 py-6">
+      <div className="w-full md:w-[80%] lg:w-[60%] mx-auto p-5 rounded shadow-lg bg-background-secondry flex flex-col gap-5">
+        {Object.keys(about).map((title) => {
+          const renderFunction = titleMappings[title];
+          if (renderFunction) {
+            return renderFunction();
+          }
+          return null;
+        })}
+      </div>
+    </div>
+  );
+}

app/api/comment/route.ts

@@ -0,0 +1,29 @@
+import { NextResponse } from 'next/server';
+import { Octokit } from '@octokit/rest';
+import { getComments } from '@/libs/gists/gists-api';
+import { Decrypt } from '@/libs/utils/crypto';
+
+export async function POST(request: Request) {
+  const { id, token, comment } = await request.json();
+  const octokit = new Octokit({
+    auth: Decrypt(token),
+  });
+  const res = await octokit.gists.createComment({
+    gist_id: id,
+    body: comment,
+  });
+  return NextResponse.json(res);
+}
+
+export async function GET(request: Request) {
+  const { searchParams } = new URL(request.url);
+  const id = searchParams.get('id');
+  if (!id) {
+    return NextResponse.json({
+      CODE: 405,
+      MESSAGE: 'THE REQUEST PARAM `id` IS MISSING',
+    });
+  }
+  const comments = await getComments(id);
+  return NextResponse.json(comments);
+}

app/api/cover/route.ts

@@ -0,0 +1,11 @@
+import { NextResponse } from 'next/server';
+
+export async function GET() {
+  const api_url = 'https://api.likepoems.com/img/nature?type=json';
+  const response = await (
+    await fetch(api_url, {
+      cache: 'no-cache',
+    })
+  ).json();
+  return NextResponse.json({ url: response.url });
+}