无标题文档

无标题文档

无标题文档

为 TipTap 编辑器添加表格支持与 Markdown 粘贴转换

背景 在使用 TipTap 富文本编辑器时，遇到了两个常见的痛点： 1. 无法插入和编辑表格 - 很多技术文档需要用表格展示数据，但编辑器不支持 2. 无法粘贴 Markdown - 从其他地方复制的 Markdown 文本粘贴进来只是纯文本，需要手动重新格式化 这两个问题严重影响了写作效率，特别是在撰写技术博客时。 技术方案 表格支持 TipTap 官方提供了 系列扩展，包括： - - 表格...

巴菲特的投资战绩

Next.js 后端权限系统设计：从用户到管理员的完整方案

背景 在开发 Ink&Code 博客系统时，后端的权限设计是一个核心挑战。系统需要支持： - 普通用户管理自己的文章 - 管理员审核和管理所有内容 - 开发者拥有最高权限 - 外部服务（如 GitHub Actions）通过 API Token 调用接口 如何设计一个清晰、安全、易于扩展的权限系统？本文将分享基于 Next.js + Prisma + NextAuth.js 的后端架构实践。 技术...

Tailwind CSS 响应式设计实战：从移动端到桌面端的完整方案

背景 在开发 Ink&Code 博客系统时，响应式设计是一个核心需求。用户可能在手机上刷文章，在 iPad 上阅读，或者在桌面大屏上写作。如何让同一套代码在所有设备上都有良好的体验？ 本文将分享使用 Tailwind CSS 实现响应式设计的实践经验，包括移动优先原则、断点系统、组件适配等关键技巧。 技术方案 核心原则：Mobile First Tailwind CSS 采用「移动优先」的设计理念...

在 Next.js 中打造专业级 TipTap 富文本编辑器

背景 在开发博客系统时，一个好用的富文本编辑器是核心体验。传统的 textarea 太简陋，而很多富文本编辑器要么过于臃肿，要么难以定制。TipTap 是一个基于 ProseMirror 的现代化编辑器框架，它模块化、可扩展，非常适合需要深度定制的场景。 本文将分享如何在 Next.js 项目中实现一个功能完善的 TipTap 编辑器，包括： - 完整的工具栏（格式化、标题、列表、代码块等） -...

你好 会议

构建安全的内容生态：Ink & Code 用户访问控制与内容可见性深度解析

背景 在构建一个现代化的博客平台时，内容安全与用户权限管理是至关重要的环节。最近，我在 Ink & Code 项目中完成了一系列关于用户访问控制和内容可见性的增强功能，这些改动看似简单，实则涉及到了平台安全、用户体验和系统架构的多个层面。 为什么需要这些改动？ 1. 安全边界模糊：原有的系统虽然提供了基础的认证机制，但在用户状态管理（如封禁状态）和内容过滤方面存在漏洞。被封禁的用户仍然可以访问某些...

移动优先的现代博客后台：从响应式设计到用户体验优化

背景 在移动互联网时代，技术博客的读者和管理者都越来越多地使用移动设备进行访问和操作。然而，许多博客系统的后台管理界面仍然停留在“桌面优先”的设计理念上，导致在移动设备上操作困难、体验不佳。 我们的 Ink & Code 博客系统最初版本也存在这个问题：管理员侧边栏在移动端会挤压内容区域，编辑器工具栏在小屏幕上布局混乱，文章标签在窄屏幕上溢出，汉堡菜单缺失等等。这些问题不仅影响了管理效率，也违背了...

从私有到开放：为博客系统实现访客友好的公开内容API

背景 在构建个人博客系统时，我们常常面临一个设计抉择：内容应该完全私有还是部分公开？传统的博客系统通常采用两种极端方案：要么是完全开放的静态站点，要么是完全私有的内容管理系统。但现代开发者博客往往需要更灵活的访问控制——作者需要私密空间来管理草稿和未完成的内容，同时希望访客能够浏览已发布的优质文章。 在 Ink & Code 项目的早期版本中，我们实现了一个完整的后台管理系统，支持文章的分类、排序...

从零构建用户关注系统：Next.js 全栈实现深度解析

背景 在当今的社交化内容平台中，用户关系网络是构建社区生态的核心。传统的博客系统往往只关注内容创作，而忽略了作者与读者、读者与读者之间的连接。ink-and-code 作为一个现代化的博客系统，我们意识到单纯的单向内容输出已经无法满足用户需求。 为什么需要关注系统？ 1. 增强用户粘性：关注机制让读者能够持续追踪感兴趣的作者，形成稳定的内容消费关系 2. 构建社区氛围：双向的关注关系能够促进用户间...

从零到一：在Next.js博客中实现优雅的文档树拖拽排序

背景 在内容管理系统中，文档的组织和排序一直是个看似简单却充满挑战的问题。传统的博客系统通常只提供按时间或字母排序，但在实际使用中，作者往往希望按照自己的逻辑来组织文章——比如将系列教程按顺序排列，或者将相关主题的文章归为一组。 在Ink & Code博客系统的早期版本中，我们遇到了几个痛点： 1. 排序不灵活：文章只能按创建时间倒序排列，无法手动调整顺序 2. 跨分类移动繁琐：需要先编辑文章，修...

从简单差异到深度理解：构建智能化的自动博客生成工作流# 验证解析结果if [ -z "$TITLE" ] || [ ! -s /tmp/content.txt ]; then echo "Error - Failed to parse AI output" echo "Raw output -" cat /tmp/ai_output.txt exit 1fi```## 关键代码###...

背景 在软件开发过程中，每一次代码提交都承载着开发者的思考、决策和技术演进。然而，传统的提交信息往往过于简略，难以完整记录背后的技术细节和设计思路。特别是在开源项目或团队协作中，理解一个改动的"为什么"比知道"做了什么"更为重要。 我们之前实现了一个基于 GitHub Actions 的自动博客生成系统，当提交信息包含 标签时，系统会自动生成一篇技术博客。但最初的版本存在一个明显的局限性：它只能...

自动化博客生成：支持TipTap JSON格式转换的GitHub Actions实践

背景 在技术写作和内容创作领域，保持高效且一致的工作流程至关重要。对于开发者而言，将日常的代码提交、技术思考快速转化为结构化的博客内容，是一个常见的需求。传统的博客写作往往需要在内容管理系统（CMS）的富文本编辑器中进行手动排版，这个过程不仅耗时，而且容易打断开发者的思维流。 近期，我在维护一个名为“ink-and-code”的个人项目，旨在探索代码与写作的融合。该项目的一个核心功能是自动将Git...