搭建基于nextjs的静态博客程序fad

首先fork此项目https://github.com/fracture91/ahurle-dev，我fork后的项目地址是

https://github.com/ymbrite/fad/, 

然后访问https://github.com/ymbrite/fad/tree/master/pages/blog，新建源帖fh.mdx，内容为：

import * as doubleLaptop from "@/public/img/double-laptop.jpg"
import imgAttrs from "@/helpers/imgAttrs"
import { IncrementButton } from "@/components/IncrementButton"
import { Box } from "theme-ui"

export const meta = {
  title: "战马",
  published: true,
  datePublished: 1618848000000,
  bannerPhoto: {
    ...imgAttrs(doubleLaptop),
    alt: "Andrew lying on a couch wearing sunglasses, somehow typing on two laptops simultaneously, smiling at the camera",
    caption: "Protip: Always use two laptops to maximize typing speed",
  },
}

此处写视频的嵌入代码

（ 详见https://github.com/ymbrite/fad/blob/master/pages/blog/fh.mdx?plain=1）

 访问https://github.com/ymbrite/fad/blob/master/package.json，设置

"engines": { "node": "24.x" } 

 然后访问vercel.com/new ,导入项目https://github.com/ymbrite/fad

 添加环境变量NODE_OPTIONS ，其值为 --openssl-legacy-provider

然后，点击deploy按钮，等待部署完成，部署完成后，我得到网址

https://fad-gamma.vercel.app/

 新建源帖后，博客网站2-3分钟内就会自动更新。

 项目地址：

https://github.com/fracture91/ahurle-dev

https://github.com/ymbrite/fad

演示博客：https://fad-gamma.vercel.app/

https://fad-gamma.vercel.app/blog/
https://fad-gamma.vercel.app/blog/fh 能显示视频.

同一天里的帖子是按字母顺序从上到下排列的：

 https://fad-gamma.vercel.app/blog/cd-test

 https://fad-gamma.vercel.app/blog/ce

 https://fad-gamma.vercel.app/blog/fh