AI 摘要：本文详细介绍了如何使用 CSS 的新特性 shape() 函数，通过 clip-path 创建花朵形状。作者从 shape() 函数的基本概念入手，聚焦于 arc 命令，结合几何原理和具体代码示例，展示了如何绘制复杂的花朵形状，并通过调整弧线的大小和方向生成不同的形状效果。文章还探讨了代码优化技巧以及浏览器的兼容性问题，适合对 CSS 高级形状设计感兴趣的开发者学习。

• 什么是 shape() 函数？
• 介绍了 shape() 作为 clip-path 的新值，突破了 polygon() 只能绘制直线的限制，支持绘制曲线。
• 与 SVG 路径语法相似，提供了更多的灵活性，但语法复杂，需要大量练习。
• 本文聚焦于 arc 命令，下一篇文章将探讨 curve 命令，并以创建有趣形状为目标。
• Arc 命令详解
• arc 命令用于在两点之间绘制椭圆弧，本文简化讨论为圆弧情况。
• 通过几何原理解释了两点和半径确定的两个圆，以及由此生成的四种弧线（小/大，顺/逆时针）。
• 提供了 shape(from Xa Ya, arc to Xb Yb of R [large or small] [cw or ccw]) 的代码示例，并通过演示说明不同参数的效果。
• 创建花朵形状
• 以之前的文章为基础，展示了如何使用 shape() 绘制花朵形状，通过多个小圆弧连接形成花瓣。
• 详细讲解了点的坐标计算和半径公式，使用 Sass 循环生成代码，并通过调整参数解决反向形状问题。
• 最终通过 small ccw 和 large cw 组合，得到目标花朵形状，并展示了其他有趣的形状变体。
• 结论与示例
• 总结了 arc 命令的使用，鼓励读者从圆弧扩展到椭圆弧的学习。
• 以心形为例作为最终演示，引导读者自行思考实现方式，并推荐作者的在线生成器获取更多代码资源。
• 浏览器兼容性
• 指出目前仅 Chrome、Edge 和 Safari 完全支持 shape() 函数，提醒开发者注意兼容性问题。

Css-Generators

CSS Generator for Flower Shapes

Create fancy flower shapes using CSS mask. Get an optimized & modern code in no time.

AI 摘要：本文详细介绍了如何使用 Pages CMS 作为静态网站的内容管理系统，结合 Astro 等静态站点生成器，简化内容管理流程。作者分享了 Pages CMS 的核心优势，包括易用性、最小化依赖、协作功能和高度自定义性，并通过实际案例展示了如何将其与 Astro 的内容集合功能集成，管理 Markdown 文件和自定义字段。此外，文章还涵盖了 Pages CMS 的配置、与 GitHub 仓库的连接、内容创建以及自动部署的步骤，为静态网站开发者提供了实用指南。

CSS-Tricks

Using Pages CMS for Static Site Content Management | CSS-Tricks

I know, I know: there are a ton of content management system options available, and while I've tested several, none have really been the one, y'know? Weird pricing models, difficult customization, some even end up becoming a whole 'nother thing to manage.

从今天开始，我们将为大家提供更多访问 Manus 的机会！

• 向所有人开放，无需等待名单
• 所有用户每天可免费执行一项任务（300积分）
• 所有用户一次性获得1,000积分奖励

更多价值，更多灵活性。享受你的免费积分并邀请朋友来体验吧！

AI 摘要：本文由 Dan ⚡️ 在 X 平台分享了如何利用 AI 和任务管理系统高效构建产品的流程。他强调了详细需求编写、产品需求文档 (PRD) 的创建、任务管理工具的选择以及基于任务的构建循环的重要性。Dan 推荐使用 TaskMaster AI 作为任务管理工具，并提供了一个简单的提示循环来确保任务按逻辑顺序执行，避免复杂项目中的混乱。

• 1. 编写详细需求
• 花费 15-20 分钟深入思考，确保 AI 明确你的构建目标。
• 需求需简洁但全面，包含技术栈等细节。
• 总结：这一步是确保 AI 理解项目愿景的基础，避免后续沟通偏差。

• 2. 创建产品需求文档 (PRD.txt)
• 使用博客中提供的提示，将需求整理成正式的产品需求文档。
• 仔细复查文档内容，确保无遗漏。
• 总结：PRD 作为项目蓝图，是后续任务分解和执行的重要依据。

• 3. 使用任务管理系统
• 推荐了四种任务管理工具：TaskMaster AI、Roocode Boomerang Tasks、Shrimp Task Manager 和 Cline Task Tool。
• Dan 个人更倾向于 TaskMaster AI，原因是其集成了 Perplexity 进行网络搜索，能更好地处理复杂性，正确识别依赖关系并按逻辑顺序执行任务。
• 其他工具如 MCP 与 Cursor 配合良好，也支持 CLI 直接使用。
• 总结：选择合适的任务管理工具是项目有序推进的关键，TaskMaster AI 在复杂项目中表现更优。

• 4. 使用简单的任务构建循环
• 强调构建循环必须严格围绕任务进行，避免偏离任务管理系统，否则复杂项目容易出错。
• 提供了一个简单的提示循环：
• "Show tasks" - 查看任务列表。
• "What's the next task I should work on? Please consider dependencies and priorities." - 询问下一个优先任务。
• "Implement task 2 and all of its subtasks." - 执行具体任务及其子任务。
• "I'd like to add a new task that ..." - 添加新任务。
• 更多示例可在推文中查看，核心是始终保持任务管理的一致性。
• 总结：任务构建循环是确保项目按部就班执行的关键方法，严格遵循可避免混乱。

AI 摘要：本文详细介绍了7种开源自托管评论系统的替代方案，以替代 Disqus，特别适合那些关注隐私、成本和自定义需求的博客主或网站管理者。文章从 Disqus 的局限性入手，分析了其免费计划的限制以及升级到专业计划的高成本，提出自托管开源解决方案作为更经济和灵活的选择。作者列举了7种评论系统（HashOver、Schnack、Valine、Commentics、Commento、Remark42 和 Isso），并对每种系统的特点、优势和技术细节进行了深入分析，帮助读者根据需求选择合适的工具。

引言
• 作者在选择博客评论系统时的困惑，初期选择了 Disqus，但随着博客流量增长，Disqus 的免费计划限制和收费问题凸显。
• 提出自托管开源评论系统作为替代方案，特别是在隐私和成本方面的优势。
• 分享7种可自托管的开源评论系统，适用于博客和静态页面。

1. HashOver：
• 特点：免费开源的 PHP 评论系统，支持完全匿名评论，易于主题定制。
• 功能：通过简单几行 JavaScript 或 PHP 代码嵌入网站，支持 XML、JSON 或 SQL 数据库存储评论。
• 优势：自托管，注重隐私，替代 Disqus，遵循 GNU Affero General Public License 许可证。

2. Schnack：
• 特点：基于 JavaScript 的开源评论系统，体积小（仅 8KB），无广告、无追踪。
• 功能：简洁的 UI，便于审核评论，支持信任/屏蔽用户，Webpush 通知新评论，支持 GitHub、Twitter 等第三方认证。
• 优势：轻量、用户友好，无需额外用户管理系统。

3. Valine：
• 特点：快速、简单且强大的评论系统，默认安全，无需服务器端实现。
• 功能：支持表情、高速加载、完整 Markdown 语法、轻量化设计，1.2.0 版本新增文章阅读统计。
• 优势：简洁高效，注重用户体验。

4. Commentics：
• 特点：免费高级 PHP 评论脚本，代码开源，注重集成性、可定制性和安全性。
• 功能：易于嵌入现有页面，保持内容新鲜以吸引访客和搜索引擎。
• 优势：适用于文章评论或独立评论页面，功能丰富。

5. Commento：
• 特点：轻量快速（仅 11KB 的 JavaScript 和 CSS），加载速度快，注重隐私。
• 功能：不收集用户信息，内置高级审核工具、自动垃圾过滤和 Akismet 集成。
• 优势：无垃圾评论，页面加载速度提升可增加网站流量。

6. Remark42：
• 特点：轻量、简单且功能齐全的自托管评论系统，注重隐私，不追踪用户。
• 功能：支持社交登录、邮件登录、可选匿名评论、多级嵌套评论、Markdown 格式、图片上传、评论投票和置顶、近期评论列表、Disqus 导入、Telegram 通知等。
• 技术：无需外部数据库，数据存储于单一文件，支持 Docker 一键部署，跨平台运行，UI 简洁且可定制。
• 优势：功能全面，适合多场景使用，支持多站点模式和自动 SSL 集成。

7. Isso：
• 特点：基于 Python 和 JavaScript 的轻量评论服务器，作为 Disqus 的直接替代品。
• 功能：支持匿名评论，身份管理简单，通过 JavaScript 和跨域资源共享轻松集成到静态网站。
• 优势：轻量易用，注重隐私和简洁性。

Our Code World

Top 7: Best Open Source Self-Hosted Comment System Alternatives to Disqus

See our review from 7 of the best Open Source Self-Hosted Comment System Alternatives to Disqus.

AI 摘要：本文详细探讨了 Astro 框架与内容管理系统（CMS）的结合，分析了如何为 Astro 网站选择合适的 CMS。Astro 作为一个快速、现代的网站构建框架，凭借其 Islands Architecture 实现了静态网站速度与动态功能的平衡。然而，对于需要扩展性、多人协作、动态内容或结构化编辑流程的项目，选择合适的 CMS 至关重要。文章列出了 9 款适合 Astro 的顶级 CMS，评估了它们的功能、局限性、定价以及与 Astro 的集成效果，并提供了选择 CMS 时需考虑的关键因素，如内容交付方式、编辑体验、性能优化、定价与扩展性及生态系统支持。

• 选择 CMS 的关键考量：
• 内容交付与 API 结构：介绍了三种 CMS 类型（Headless CMS、Git-based CMS、Traditional CMS）及其与 Astro 静态生成（SSG）或动态模式（SSR/混合模式）的适配性，强调快速响应 API 和缓存的重要性。
• 编辑体验与易用性：讨论了技术用户与非技术用户对 CMS UI、实时预览和编辑工具的不同需求。
• 性能与静态优化：强调 CMS 应支持 SSG、提供良好的缓存和 CDN 支持，并具备增量静态再生（ISR）功能以保持 Astro 的性能优势。
• 定价与扩展性：分析了 CMS 定价模式的多样性（免费、按使用付费等）以及对流量和内容增长的适应性。
• 生态系统与 Astro 支持：建议选择有官方 Astro SDK、插件或良好文档支持的 CMS，以简化集成。

• 9 款推荐 CMS 详细解析：
• Hygraph：一款 GraphQL 原生无头 CMS，注重速度与结构化内容，支持内容联合与多语言管理，适合企业级应用；限制在于 GraphQL 学习曲线和无内置前端渲染；定价从免费到企业定制。
• Contentful：强调扩展性和 API 优先设计，适合从博客到企业级项目，支持多平台内容交付；限制为高流量成本较高及 GraphQL 查询限制；定价从免费到 $300/月起。
• Sanity：高度可定制的无头 CMS，提供实时 API 和 Sanity Studio 自定义编辑界面；限制在于非技术用户使用难度和 GROQ 查询学习曲线；定价从免费到 $15/座/月起。
• Storyblok：混合无头 CMS，具备实时视觉编辑和组件化内容模型；限制为自定义后端适配性较弱及定价较高；定价从 €99/月起。
• Strapi：开源自托管无头 CMS，提供 API 优先设计和动态区域功能；限制为自托管维护成本及学习曲线；定价从免费到 $15/座/月起。
• Tina CMS：开源 Git 驱动 CMS，适合静态网站和 JAMstack 架构；限制为无传统数据库支持动态内容较弱；定价从免费到 $29/月起。
• Prismic：无头页面构建器，结合视觉页面编辑与 Slice Machine 工具；限制为 API 灵活性较低及成本随用户增长；定价从免费到 $10/月起。
• Ghost：专注于出版的平台，适合内容创作者和会员制网站；限制为非完整 CMS，缺乏结构化内容支持；定价从免费到 $9/月起。
• WordPress：全球最受欢迎 CMS，支持无头模式但非原生设计；限制为性能和安全性问题；定价免费但附加成本较高。

• 总结与建议：文章最后强调选择 CMS 需根据项目需求（如结构化内容、动态查询或直观编辑器）进行权衡，并推荐 Hygraph 作为与 Astro 集成顺畅的 GraphQL 原生选项。