Skip to content

lidelong-0201/next-yuque-elog

Repository files navigation

delong的博客

语雀作为博客后台,elog生成语雀内容,nextjs+mdx进行渲染,cloudflare+vercel搭建

使用了以下技术和工具:

  • Tailwind CSS: 一个高度可定制的 CSS 框架,用于快速构建现代化的用户界面。
  • Next.js: 一个基于 React 的轻量级框架,用于构建静态和服务器渲染的应用程序。
  • Headless UI: 一个可访问性优先的 UI 组件库,用于构建无样式的组件。
  • MDX: 一种将 JSX 和 Markdown 结合的格式,用于编写可扩展的文档。
  • Vercel: 一个用于部署和托管静态网站的云平台,提供了无缝的 Next.js 集成。
  • Elog:Markdown 批量导出工具、开放式跨平台博客解决方案,随意组合写作平台。
  • 语雀(Yuque): 一个优秀的知识创作与分享工具,用于撰写和管理博客的内容。

功能特性

  • 使用 Tailwind CSS 构建美观、响应式的用户界面。
  • 使用 Next.js 实现服务器渲染和静态生成,提供更好的性能和 SEO 优化。
  • 使用 Headless UI 提供可访问性优先的无样式组件,确保博客的可访问性。
  • 使用 MDX 编写可扩展的文档,可以轻松地在 Markdown 中嵌入 JSX 组件。
  • 使用 Vercel 部署和托管博客,享受无缝的 Next.js 集成和自动化部署。
  • 使用 Elog Markdown 批量导出工具、开放式跨平台博客解决方案,随意组合写作平台(语雀/Notion/FlowUs/飞书)和博客平台(Hexo/Vitepress/Halo/Confluence/WordPress等)。
  • 使用语雀(Yuque)进行知识创作和分享,方便管理博客的内容和团队协作。

快速开始

  1. 克隆仓库到本地:

    git clone https://github.com/lidelong-0201/next-yuque-elog.git
  2. 安装依赖:

    cd your-blog
    pnpm install
  3. 生成文章

    cp .env.excample .env

    填写对应的环境变量

    pnpm run sync:local
  4. 在本地开发服务器上运行博客:

    pnpm run dev

    博客将在 http://localhost:3000 上运行。

部署

  1. 在 Vercel 上创建一个新项目。

  2. 将你的博客仓库与 Vercel 项目关联。

  3. 配置 Vercel 项目的环境变量,即env内容。

  4. 部署博客到 Vercel:

    pnpm run build

    构建完成后,博客将自动部署到 Vercel。

贡献

欢迎贡献你的想法、问题和改进!请提交 issue 或者发起 pull 请求。