1.内容管理

本博客的文章均采用 Markdown 格式书写，这是一种轻量级标记语言，能够高效地处理文本内容的排版结构，如标题、列表、引用、代码块等。相比传统编辑器，它更专注于内容本身，排版简洁统一。

在此基础上，博客支持 MDX 扩展，它允许在 Markdown 文本中嵌入组件或可执行模块。例如，在技术性文章中嵌入交互图表或代码演示，实现文图结合与增强信息表达能力。

由于 Markdown 无法嵌入图片，需要单独存储。本博客的图片存储在腾讯云 COS（对象存储），解决 Markdown 文件中图片引用的路径问题。

2.支付：Buy Me a Coffee

博客集成了 “Buy Me a Coffee” 平台，点击文章末尾的按钮可以跳转至打赏页面。平台收取手续费 5%，需绑定海外银行卡提现。

打赏支持银行卡（Visa/Master card/American Express）和 Cash App。需注意：跨币种打赏会有额外费用。

Buy Me a Coffee 不仅支持打赏，还支持会员订阅和商品售卖。

国内类似的平台：爱发电 面包多，但是必须要在他们平台上发布内容。 海外 Newsletter 平台如 Quaily| 为创作者提供现代人工智慧新闻通讯服务 可以支持付费订阅和博客搭建。

3.监控：Vercel Analysis

Vercel 自带数据监控工具，并且提供集成方案。可以监测网站的流量数据，付费版还支持监控自定义用户行为埋点。

4.数据：Supabase

数据存储在 Supabase 数据库中，通过 API 调取数据并展示。

5.接入可视化组件

Echarts

接入 Echarts 基础 K 线图组件 Examples - Apache ECharts，后调整 K 线图样式，使其符合网站整体风格。

由于没找到合适的股票 API，因此通过 Supabase 曲线救国接入 K 线数据。从 Investing 保存近 1 年上证指数的 K 线图数据，上传至 Supabase 的数据库中，然后通过 API 调用并在前端呈现。

Mermaid

Mermaid 是一种基于文本的图表和流程图绘制工具，使用简单的语法即可在 Markdown、文档或代码中快速生成可视化图表。也是大模型用来生成图表、流程图的首选格式。

• 基于文本：只需简单的文本语法，不需要拖拽操作。
• 轻量集成：可以在 Markdown（如 Obsidian、Typora、Notion）、GitHub、GitLab、Jira 等工具中直接使用。
• 开源免费：社区活跃，支持持续更新。

Three.js

Three.js 是一个用于在 网页中创建和展示 3D 图形 的 JavaScript 库，它建立在 WebGL 之上，极大地简化了 WebGL 的使用，使开发者可以更轻松地构建复杂的 3D 场景。

Three.js 的应用场景：

• 游戏开发（3D 浏览器游戏）
• 数据可视化（3D 图表）
• 虚拟展厅、数字孪生
• 3D 地球/地图（如使用 Three.js + Mapbox）
• 电商产品展示（360° 旋转展示）
• 教育演示（如结构、解剖、物理模拟）