Files
frontend-starter-skill/src/generated/docs.ts

2003 lines
47 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
// Generated by build script
export const readme = `# Showcase CMS
展示网站模板集合 - 快速构建专业的静态展示网站或高交互动态网站。
## opencode 使用插件skill
\`\`\`json
{
"plugin"
}
\`\`\`
---
## 模板类型对比
| 特性 | 展示型模板(astro) | 互动型模板(next.js) |
|------|-----------|-----------|
| **核心定位** | 信息展示为主 | 用户交互为主 |
| **渲染模式** | 静态生成 (SSG) | 混合渲染 (SSR/SSG/ISR) |
| **内容管理** | Markdown/MDX 文件 | Headless CMS + API |
| **用户系统** | 无 | 多用户 + 权限管理 |
| **交互程度** | 低(浏览为主) | 高(登录、评论、购买) |
| **性能表现** | 极致轻量、快速加载 | 高并发、动态内容 |
| **适用场景** | 企业官网、作品集、博客、文档 | 电商、门户、社区、后台系统 |
| **学习曲线** | 简单 | 中等 |
| **部署难度** | 简单 | 中等 |
| **SEO** | 优秀 | 优秀 |
---
## 展示型模板 (Astro)
适用于以信息展示为主的网站强调性能、SEO和内容管理便捷性。
### 适用场景
- 企业官网(纯信息展示)
- 个人作品集、摄影集、设计展示
- 技术博客、文档站点、知识库
- 活动页面、 Landing Page
- 新闻资讯、媒体发布
### 核心特点
1. **极简架构**
- 纯静态生成,零运行时依赖
- 支持 Markdown/MDX 内容创作
- 文件即路由,目录结构清晰
2. **高性能**
- 首屏加载 < 100ms
- 自动图片优化
- 按需加载 JavaScript
- 支持边缘部署 (Vercel Edge, Cloudflare Pages)
3. **开箱即用**
- 内置语法高亮
- 主题切换 (亮色/暗色)
- 响应式图片
- SEO 元标签自动生成
### 功能模块
| 模块 | 功能点 |
|------|--------|
| 首页 | Hero区域、核心数据、客户Logo、订阅 |
| 关于我们 | 公司简介、发展历程、团队介绍、资质认证 |
| 产品/服务 | 产品分类、详情介绍、规格参数 |
| 成功案例 | 案例展示、客户评价、Logo墙 |
| 新闻动态 | 新闻列表、分类、RSS订阅 |
| 人才招聘 | 职位列表、福利介绍、简历投递 |
| 联系我们 | 联系信息、表单、地图 |
| 博客/文章 | 文章列表、标签分类、阅读时间 |
| 双语支持 | i18n路由、翻译文件管理 |
### 技术栈
\`\`\`yaml
框架: Astro 4.x
UI 库: 原生 CSS / TailwindCSS (可选)
内容: Markdown / MDX
搜索: Pagefind (本地搜索)
部署: Vercel / Netlify / Cloudflare Pages
\`\`\`
### 目录结构
\`\`\`
astro-website/
├── src/
│ ├── components/ # 可复用组件
│ ├── layouts/ # 页面布局
│ ├── pages/ # 页面路由
│ ├── content/ # Markdown/MDX 内容
│ ├── styles/ # 全局样式
│ └── utils/ # 工具函数
├── public/ # 静态资源
├── astro.config.mjs # 配置文件
└── package.json
\`\`\`
---
## 互动型模板 (Next.js)
适用于:以用户交互为主的网站,需要登录、动态内容、在线交易等功能。
### 适用场景
- 电商平台、B2B商城
- 门户网站、内容社区
- 会员制网站、SaaS产品
- 在线教育、培训平台
- 需要后台管理的各类网站
### 核心特点
1. **企业级架构**
- App Router 路由系统
- Server Components
- 完整的后台管理系统集成
- 多语言 i18n 支持
2. **完整业务支持**
- 用户注册/登录
- 产品目录管理
- 新闻发布系统
- 在线询盘/表单
- 会员中心
3. **灵活扩展**
- 支持多种 CMS (Strapi, Contentful, Sanity)
- API 路由自动生成
- 组件库按需引入
- 微前端集成能力
### 功能模块
| 模块 | 功能点 |
|------|--------|
| 首页 | Hero、核心数据、客户Logo、订阅 |
| 关于我们 | 公司历程、团队介绍、资质认证、办公环境 |
| 产品中心 | 产品分类、详情、对比、规格参数、购物车 |
| 解决方案 | 行业方案、定制服务、成功案例 |
| 新闻动态 | 新闻列表、分类、RSS订阅、媒体资源 |
| 成功案例 | 案例详情、客户评价、Logo墙 |
| 服务支持 | 知识库、FAQ、下载中心、在线客服 |
| 人才招聘 | 职位列表、简历投递、校园招聘 |
| 联系我们 | 表单、地图、客服系统、多分支机构 |
| 合作伙伴 | 合作伙伴门户、渠道政策、专属登录 |
| 会员中心 | 账户管理、订单历史、收藏、消息通知 |
| 在线商城 | 商品管理、支付集成、物流查询、退换货 |
| 投资者关系 | 公告、财报、治理结构(上市公司) |
| 用户系统 | 注册登录、权限管理、OAuth认证 |
| CMS后台 | 内容管理、产品管理、媒体管理、统计分析 |
| 双语支持 | 语言切换、翻译管理、SEO本地化 |
### 技术栈
\`\`\`yaml
框架: Next.js 14+ (App Router)
UI 库: React / TailwindCSS / Shadcn UI
状态管理: Zustand / React Query
表单: React Hook Form + Zod
认证: NextAuth.js / Clerk
CMS: Strapi / Contentful / Sanity (可选)
数据库: PostgreSQL / MySQL (可选)
部署: Vercel / AWS / Docker
\`\`\`
### 目录结构
\`\`\`
nextjs-website/
├── src/
│ ├── app/ # App Router 页面
│ ├── components/ # 可复用组件
│ ├── lib/ # 工具函数和配置
│ ├── hooks/ # 自定义 Hooks
│ ├── types/ # TypeScript 类型
│ ├── services/ # API 服务层
│ └── store/ # 状态管理
├── public/ # 静态资源
├── next.config.js # 配置文件
└── package.json
\`\`\`
---
## 共享组件库 (待开发)
两个模板共享同一套组件库,保证视觉一致性:
\`\`\`
packages/ui/
├── Button/ # 按钮组件
├── Card/ # 卡片组件
├── Modal/ # 弹窗组件
├── Form/ # 表单组件
├── Navigation/ # 导航组件
├── Footer/ # 页脚组件
├── Input/ # 输入框组件
├── Select/ # 选择器组件
├── Table/ # 表格组件
├── Pagination/ # 分页组件
├── Carousel/ # 轮播组件
├── Dropdown/ # 下拉菜单
├── Toast/ # 提示组件
└── Skeleton/ # 骨架屏组件
\`\`\`
---
## 如何选择
\`\`\`
需要选择展示型还是互动型?
├── 内容是否主要是静态信息展示?
│ ├── 是 → 选择 Astro 展示型模板
│ └── 否 → 继续
├── 是否需要用户登录注册?
│ ├── 是 → 选择 Next.js 互动型模板
│ └── 否 → 继续
├── 是否需要在线交易/支付?
│ ├── 是 → 选择 Next.js 互动型模板
│ └── 否 → 可能只需要展示型
└── 是否需要复杂的动态交互功能?
├── 是 → 选择 Next.js 互动型模板
└── 否 → 选择 Astro 展示型模板
\`\`\`
---
## 快速开始
### 展示型模板 (Astro)
\`\`\`bash
# 克隆模板
git clone https://github.com/your-org/showcase-cms
cd showcase-cms/templates/astro-website
# 安装依赖
npm install
# 启动开发服务器
npm run dev
# 构建生产版本
npm run build
\`\`\`
### 互动型模板 (Next.js)
\`\`\`bash
# 克隆模板
git clone https://github.com/your-org/showcase-cms
cd showcase-cms/templates/nextjs-website
# 安装依赖
npm install
# 启动开发服务器
npm run dev
# 构建生产版本
npm run build
\`\`\`
---
## 文档链接
- [展示型模板功能拆分](docs/website-features-breakdown.md)
- [互动型模板功能拆分](docs/enterprise-website-features.md)
---
## 贡献指南
欢迎贡献代码或提出建议。请先阅读贡献指南。
---
## 许可证
MIT License
`;
export const website_features_breakdown = `# 个人展示网站功能拆分文档
## 概述
本文档梳理建立个人展示网站或者作品集的具体功能需求,按章节进行拆分和记录。
---
## 第一章:首页 (Home)
### 1.1 Hero 区域
- 大标题(个人姓名/品牌标识)
- 副标题(职业/角色定位)
- 简介文字(一句话概括)
- CTA按钮查看作品、联系我
- 背景视觉元素(图片/渐变/动画)
### 1.2 快速概览
- 个人照片/头像
- 核心技能标签
- 社交媒体链接
---
## 第二章:关于我 (About Me)
### 2.1 个人介绍
- 详细个人简介
- 教育背景
- 工作经历
- 个人故事/理念
### 2.2 技能展示
- 技术栈列表
- 熟练程度可视化
- 工具使用
### 2.3 兴趣爱好
- 个人爱好展示
- 其他技能
---
## 第三章:项目展示 (Portfolio/Projects)
### 3.1 项目列表
- 项目缩略图
- 项目标题
- 项目描述
- 技术栈标签
- 链接按钮(查看详情、演示、源码)
### 3.2 项目分类
- 按类型分类
- 按技术栈筛选
- 按时间排序
### 3.3 项目详情页
- 项目背景
- 功能特性
- 技术实现
- 截图/视频
- 面临的挑战与解决方案
- 项目链接
---
## 第四章:博客/文章 (Blog)
### 4.1 文章列表
- 文章标题
- 发表日期
- 阅读时间
- 摘要
- 分类标签
### 4.2 文章详情
- 文章正文
- 目录导航
- 代码高亮
- 相关文章推荐
### 4.3 分类系统
- 按主题分类
- 按技术分类
---
## 第五章:联系信息 (Contact)
### 5.1 联系表单
- 姓名输入
- 邮箱输入
- 主题选择
- 消息内容
- 提交按钮
### 5.2 联系信息
- 邮箱地址
- 社交媒体链接
- 地理位置
- 可用时间
---
## 第六章:导航系统
### 6.1 主导航
- 首页
- 关于我
- 项目展示
- 博客
- 联系
### 6.2 辅助导航
- 返回顶部按钮
- 面包屑导航
- 页脚导航
---
## 第七章:页脚 (Footer)
### 7.1 版权信息
- 年份
- 姓名/品牌
### 7.2 社交链接
- GitHub
- LinkedIn
- Twitter
- 其他平台
### 7.3 快速链接
- 隐私政策
- 网站地图
---
## 第八章:通用组件
### 8.1 按钮
- 主要按钮
- 次要按钮
- 图标按钮
### 8.2 卡片
- 项目卡片
- 技能卡片
- 文章卡片
### 8.3 模态框
- 图片预览
- 视频播放
- 联系表单
---
## 第九章:响应式设计
### 9.1 桌面端 (Desktop)
- 1920px+
- 1440px
- 1280px
### 9.2 平板端 (Tablet)
- 1024px
- 768px
### 9.3 移动端 (Mobile)
- 480px
- 375px
---
## 第十章:交互效果
### 10.1 页面过渡
- 加载动画
- 页面切换效果
### 10.2 悬停效果
- 按钮悬停
- 卡片悬停
- 图片缩放
### 10.3 滚动效果
- 滚动触发动画
- 视差效果
- 固定导航
---
## 第十一章SEO与性能
### 11.1 SEO优化
- Meta标签
- Open Graph
- Sitemap
- Robots.txt
### 11.2 性能优化
- 图片懒加载
- 代码分割
- 缓存策略
---
## 第十二章:无障碍访问
### 12.1 键盘导航
- Tab键导航
- 快捷键支持
### 12.2 屏幕阅读器
- ARIA标签
- 替代文本
---
## 第十三章:主题与定制
### 13.1 亮色主题
- 配色方案
- 字体选择
### 13.2 暗色主题
- 配色方案
- 字体选择
### 13.3 主题切换
- 自动切换
- 手动切换
---
## 第十四章:双语支持 (Bilingual Support)
### 14.1 语言切换
- 语言切换按钮/开关
- 语言状态持久化(保存用户选择)
- 当前语言指示器
### 14.2 国际化架构
- 国际化配置文件JSON/YAML
- 文本内容管理
- 日期/时间格式化
- 数字格式化
- 复数形式处理
### 14.3 翻译内容
- 静态文本翻译
- 动态内容翻译
- SEO翻译meta、og:title、og:description
- 图片ALT文本翻译
### 14.4 路由配置
- 语言前缀URL如 /en/, /zh/
- 默认语言设置
- 语言切换时URL更新
### 14.5 语言检测
- 浏览器语言偏好检测
- 首次访问自动跳转
- 手动覆盖选项
### 14.6 内容管理
- CMS多语言支持
- 文章/博客双语版本管理
- 项目描述双语支持
### 14.7 字体与排版
- 中文字体配置
- 英文字体配置
- 多语言混排优化
---
## 总结
本文档涵盖了建立个人展示网站的所有核心功能模块。后续可根据实际需求进行调整和扩展。
`;
export const enterprise_website_features = `# 企业展示网站功能拆分文档
## 概述
本文档梳理建立企业展示网站的具体功能需求,按章节进行拆分和记录。
---
## 第一章:首页 (Home)
### 1.1 头部区域
- 企业Logo
- 主导航菜单
- 搜索功能
- 语言切换
- 登录/注册入口
### 1.2 Hero 区域
- 核心价值主张 (Value Proposition)
- 企业标语 (Tagline)
- 主要行动按钮 (CTA)
- 背景视频/轮播图
- 客户信任标识Logo展示
### 1.3 核心数据展示
- 公司成立年份
- 服务客户数量
- 成功案例数
- 团队规模
### 1.4 服务概览
- 核心业务展示
- 服务特点
- 快速链接卡片
### 1.5 客户评价
- 客户Logo
- 简短评价
- 客户姓名/职位
### 1.6 最新动态
- 最新新闻
- 公司动态
- 行业资讯
### 1.7 订阅区域
- 邮件订阅表单
- 社交媒体链接
---
## 第二章:关于我们 (About Us)
### 2.1 公司简介
- 公司发展历程
- 使命与愿景
- 核心价值观
- 发展里程碑
### 2.2 企业文化
- 企业精神
- 工作氛围
- 团队活动展示
### 2.3 发展历程
- 时间线展示
- 重大事件
- 成长数据
### 2.4 团队介绍
- 管理团队
- 核心成员
- 团队照片墙
- 招聘入口
### 2.5 资质认证
- 营业执照
- 行业资质
- 荣誉证书
- 专利技术
### 2.6 办公环境
- 办公环境照片
- 视频展示
- 360度全景
---
## 第三章:产品与解决方案 (Products & Solutions)
### 3.1 产品分类
- 产品类别导航
- 产品列表
- 产品对比功能
### 3.2 产品详情页
- 产品介绍
- 功能特性
- 规格参数
- 价格信息
- 购买/咨询按钮
### 3.3 解决方案
- 行业解决方案
- 定制化方案
- 成功案例展示
- 方案优势
### 3.4 产品演示
- 视频演示
- 在线试用
- 下载中心(手册、白皮书)
### 3.5 定价方案
- 套餐对比
- 价格表
- FAQ
- 咨询销售
---
## 第四章:成功案例 (Case Studies)
### 4.1 案例列表
- 案例分类筛选
- 案例卡片展示
- 搜索功能
### 4.2 案例详情
- 客户背景
- 面临挑战
- 解决方案
- 实施过程
- 项目成果
- 客户评价
- 相关截图/视频
### 4.3 客户Logo墙
- 行业分类
- Logo展示
- 客户评价引用
### 4.4 客户评价
- 视频评价
- 文字评价
- 评价管理后台
---
## 第五章:服务支持 (Service & Support)
### 5.1 服务类型
- 咨询服务
- 实施服务
- 培训服务
- 运维服务
- 定制开发
### 5.2 售后服务
- 保修政策
- 退换货政策
- 维修服务
- 技术支持
### 5.3 知识库
- 使用手册
- 常见问题 (FAQ)
- 操作视频
- 技术文档
### 5.4 下载中心
- 产品手册
- 软件更新
- 驱动程序
- 技术白皮书
---
## 第六章:新闻与动态 (News & Press)
### 6.1 新闻列表
- 新闻分类(公司动态、行业新闻、产品更新)
- 时间线展示
- 搜索功能
### 6.2 新闻详情
- 正文内容
- 配图/视频
- 分享功能
- 相关文章推荐
### 6.3 新闻订阅
- RSS订阅
- 邮件订阅
- 通知设置
### 6.4 媒体资源
- 新闻稿下载
- 媒体联系
- Logo/素材下载
---
## 第七章:人才招聘 (Careers)
### 7.1 招聘职位
- 职位列表
- 部门分类
- 地点筛选
- 搜索功能
### 7.2 职位详情
- 职位描述
- 任职要求
- 薪资范围
- 工作地点
- 申请按钮
### 7.3 福利待遇
- 薪酬体系
- 员工福利
- 培训发展
- 团建活动
### 7.4 申请流程
- 在线投递
- 简历上传
- 状态追踪
### 7.5 校园招聘
- 招聘行程
- 宣讲会信息
- 实习生项目
---
## 第八章:联系我们 (Contact Us)
### 8.1 联系信息
- 公司地址
- 联系电话
- 客服热线
- 邮箱地址
- 传真号码
### 8.2 在线表单
- 咨询类型选择
- 姓名/公司
- 邮箱/电话
- 消息内容
- 文件上传
- 验证码
### 8.3 地图集成
- 公司位置地图
- 分支机构地图
- 路线规划
### 8.4 分支机构
- 各地办公室列表
- 联系方式
- 地图展示
### 8.5 客服系统
- 在线客服聊天
- 智能客服机器人
- 服务时间显示
### 8.6 社交媒体
- 微信公众号
- 微博
- 抖音
- LinkedIn
---
## 第九章:合作伙伴 (Partners)
### 9.1 合作伙伴类型
- 技术合作伙伴
- 渠道合作伙伴
- 战略合作伙伴
- 供应商
### 9.2 合作计划
- 合作伙伴等级
- 权益说明
- 申请流程
### 9.3 合作伙伴登录
- 专属门户
- 资源下载
- 培训资料
- 业绩查询
### 9.4 渠道政策
- 代理政策
- 分成比例
- 激励计划
---
## 第十章:投资者关系 (Investor Relations)
### 10.1 公司公告
- 重大事项
- 公告发布
- 归档查询
### 10.2 财务信息
- 季度财报
- 年度报告
- 财务数据
### 10.3 投资者服务
- 股票信息
- 投资者日历
- 股东大会
### 10.4 公司治理
- 董事会
- 管理团队
- 规章制度
---
## 第十一章:在线商城/电子商务 (E-commerce)
### 11.1 产品展示
- 商品分类
- 商品列表
- 商品详情
- 库存状态
### 11.2 购物功能
- 购物车
- 订单管理
- 支付集成
- 物流查询
### 11.3 会员系统
- 用户注册/登录
- 会员等级
- 积分系统
- 优惠券
### 11.4 订单管理
- 订单历史
- 订单跟踪
- 退换货
---
## 第十二章:会员中心 (User Center)
### 12.1 账户管理
- 个人资料
- 密码修改
- 账号绑定
### 12.2 消息中心
- 系统通知
- 订单通知
- 消息设置
### 12.3 收藏管理
- 收藏商品
- 收藏文章
### 12.4 订单历史
- 全部订单
- 订单状态
- 订单详情
### 12.5 发票管理
- 发票申请
- 发票历史
---
## 第十三章:导航系统
### 13.1 主导航
- 一级菜单
- 二级下拉菜单
- Mega Menu大导航菜单
### 13.2 面包屑导航
- 层级显示
- 返回功能
### 13.3 页内导航
- 锚点导航
- 目录跳转
### 13.4 搜索功能
- 全站搜索
- 智能提示
- 搜索结果页
### 13.5 快捷入口
- 收藏夹
- 历史记录
- 快速链接
---
## 第十四章:页脚 (Footer)
### 14.1 链接区域
- 产品服务
- 解决方案
- 关于我们
- 支持中心
### 14.2 联系信息
- 地址电话
- 服务时间
- 在线客服入口
### 14.3 社交媒体
- 图标链接
- 二维码展示
- 公众号
### 14.4 订阅区域
- 邮件订阅
- 隐私政策
- 使用条款
### 14.5 版权信息
- 版权声明
- ICP备案
- 公安备案
---
## 第十五章:通用组件
### 15.1 按钮
- 主要按钮
- 次要按钮
- 危险按钮
- 禁用状态
- 加载状态
### 15.2 卡片
- 信息卡片
- 产品卡片
- 新闻卡片
- 团队卡片
### 15.3 表单
- 输入框
- 下拉选择
- 复选框
- 文件上传
- 表单验证
### 15.4 弹窗
- 提示弹窗
- 确认弹窗
- 模态框
- 侧边栏
### 15.5 分页
- 页码导航
- 加载更多
- 无限滚动
### 15.6 轮播
- 图片轮播
- 文字轮播
- 卡片轮播
---
## 第十六章:内容管理系统 (CMS)
### 16.1 文章管理
- 新增/编辑/删除
- 分类管理
- 标签管理
- 草稿/发布
- 定时发布
### 16.2 产品管理
- 产品CRUD
- 分类管理
- 属性管理
- 库存管理
- SKU管理
### 16.3 页面管理
- 首页管理
- 自定义页面
- 模板管理
### 16.4 媒体管理
- 图片上传
- 视频管理
- 文件管理
- 图库
### 16.5 用户管理
- 用户列表
- 角色管理
- 权限管理
- 操作日志
### 16.6 数据统计
- 访问统计
- 用户统计
- 内容统计
- 报表导出
---
## 第十七章:响应式设计
### 17.1 断点定义
- 超大屏 (≥1920px)
- 大屏 (≥1440px)
- 中屏 (≥1024px)
- 小屏 (≥768px)
- 超小屏 (<768px)
### 17.2 布局适配
- 栅格系统
- Flex布局
- 百分比布局
### 17.3 组件适配
- 导航菜单(汉堡菜单)
- 表格(横向滚动/折叠)
- 图片(响应式图片)
- 视频(自适应)
---
## 第十八章:交互效果
### 18.1 页面过渡
- 加载动画
- 页面切换
- 骨架屏
### 18.2 悬停效果
- 按钮状态
- 卡片浮起
- 图片缩放
- 颜色变化
### 18.3 滚动效果
- 视差滚动
- 滚动动画
- 导航栏固定
- 返回顶部
### 18.4 交互动效
- 弹跳效果
- 渐变效果
- 旋转效果
- 过渡动画
---
## 第十九章SEO与性能
### 19.1 SEO优化
- Meta标签
- Open Graph
- JSON-LD结构化数据
- Sitemap
- Robots.txt
- Canonical标签
### 19.2 性能优化
- 图片压缩
- 懒加载
- 代码分割
- Tree Shaking
- Gzip/Brotli压缩
- CDN加速
### 19.3 缓存策略
- 浏览器缓存
- Service Worker
- 缓存策略配置
---
## 第二十章:双语支持 (Bilingual Support)
### 20.1 语言切换
- 语言切换器
- 状态持久化
- 当前语言指示
### 20.2 国际化架构
- 翻译文件管理
- 日期/时间格式化
- 数字/货币格式化
### 20.3 路由配置
- 语言前缀URL
- 默认语言设置
- 域名绑定(可选)
### 20.4 内容管理
- CMS多语言
- 翻译工作流
- 翻译审核
### 20.5 SEO本地化
- 多语言meta
- hreflang标签
- 站点地图多语言
---
## 第二十一章:无障碍访问
### 21.1 键盘导航
- Tab顺序
- 快捷键
- 焦点指示
### 21.2 屏幕阅读器
- ARIA标签
- 替代文本
- 语义化HTML
### 21.3 视觉无障碍
- 颜色对比度
- 可调节字体
- 不依赖颜色传递信息
### 21.4 认知无障碍
- 清晰导航
- 简单语言
- 错误提示
---
## 第二十二章:安全特性
### 22.1 身份认证
- 登录/注册
- 忘记密码
- 双重验证
- OAuth登录
### 22.2 数据安全
- HTTPS
- 数据加密
- CSRF防护
- XSS防护
- SQL注入防护
### 22.3 访问控制
- 角色权限
- 访问日志
- IP限制
### 22.4 业务安全
- 验证码
- 频率限制
- 敏感操作确认
---
## 第二十三章:第三方集成
### 23.1 分析统计
- Google Analytics
- 百度统计
- 其他分析工具
### 23.2 客服系统
- 智齿客服
- Udesk
### 23.3 社交分享
- 分享组件
- 登录组件
- 点赞组件
### 23.4 支付集成
- 支付宝
- 微信支付
- 银联支付
- PayPal
- Stripe
### 23.5 地图服务
- 高德地图
- 百度地图
- Google Maps
### 23.6 邮件服务
- SendCloud
- 阿里云邮件
- 邮件模板
---
## 第二十四章:监控与运维
### 24.1 监控告警
- 服务器监控
- 应用监控
- 日志收集
- 告警通知
### 24.2 日志管理
- 访问日志
- 错误日志
- 操作日志
### 24.3 备份恢复
- 数据库备份
- 文件备份
- 灾难恢复
### 24.4 部署发布
- CI/CD流程
- 版本管理
- 回滚机制
---
## 总结
本文档涵盖了建立企业展示网站的所有核心功能模块。企业网站相比个人网站,更强调:
- 品牌专业性展示
- 多层级产品/服务展示
- 客户信任背书
- 商业转化(询盘、订单)
- 多用户系统
- 内容管理便捷性
- SEO与营销支持
后续可根据具体行业和企业规模进行调整和扩展。
`;
export const index = `---
# https://vitepress.dev/reference/default-theme-home-page
layout: home
hero:
name: "Showcase CMS"
text: "展示网站模板集合"
tagline: 快速构建专业的静态展示网站或高交互动态网站
actions:
- theme: brand
text: 展示型模板 (Astro)
link: /website-features-breakdown
- theme: alt
text: 互动型模板 (Next.js)
link: /enterprise-website-features
features:
- title: 展示型模板 (Astro)
details: 以信息展示为主,极致轻量、快速加载,适用于企业官网、作品集、博客、文档站点
- title: 互动型模板 (Next.js)
details: 以用户交互为主,支持登录注册、在线交易、后台管理,适用于电商、门户、社区系统
- title: 共享组件库
details: 两套模板共享同一套组件库保证视觉一致性和开发效率shadcn/ui
---
`;
export const link = `# 相关链接
## 开源jeepay支付
地址 https://github.com/jeequan/jeepay
## 开源gopay支付
地址 https://github.com/go-pay/gopay
## 开源Yansongda支付
地址 https://pay.yansongda.cn/`;
export const pay_summary = `# 国内国外支付方式大合集
[Github](https://github.com/chengxuyuanchuhai/chuhai-tools-all-in-one)
本指南由[程序员出海社群](https://chengxuyuanchuhai.com/)创建,版权所有。
## 国内市场,除了微信支付、支付宝,还有哪些可选支付方式
考虑到中国用户的支付习惯和便利性,同时避开微信支付和支付宝的限制,我们可以考虑以下几种替代方案:
1. 银联在线支付:
- 优点:覆盖面广,支持大多数中国发行的银行卡。
- 缺点可能需要一些时间和effort来完成商户入驻。
2. PayPal:
- 优点:国际认可度高,支持跨境支付。
- 缺点:在中国的使用率相对较低,用户可能需要额外步骤开通。
3. 数字人民币e-CNY
- 优点:是中国官方推出的数字货币,未来发展潜力大。
- 缺点:目前还在试点阶段,覆盖面可能不够广。
4. 虚拟卡支付(如 Visa/Mastercard 虚拟卡):
- 优点:国际通用,支持跨境交易。
- 缺点:在中国的普及率不如银联卡高。
5. 第三方支付聚合平台:
- 例如Stripe、Adyen 等
- 优点:可以集成多种支付方式,一次对接多种渠道。
- 缺点:可能需要额外的费用,某些平台在中国的支持可能有限。
6. 国内第三方支付平台:
- 例如:易宝支付、汇付天下等
- 优点:专注于中国市场,合规性较好。
- 缺点:国际化程度可能不如大型跨国支付平台。
考虑到中国市场的特点,可优先考虑以下方案:
1. 银联在线支付:这是最直接和广泛接受的替代方案。几乎所有的中国用户都有银联卡,使用门槛低。
2. 考虑使用支持多种支付方式的第三方支付聚合平台,如 Stripe 或 Adyen。这样可以给用户提供多种选择包括银联、信用卡等。
3. 如果您希望专注于中国市场,可以考虑国内的第三方支付平台,如易宝支付或汇付天下。这些平台通常更了解中国市场的需求和监管环境。
## Stripe、Adyen 申请需要什么资质或条件?
Stripe 和 Adyen 都是国际知名的支付处理平台,它们对商户的要求略有不同。以下是它们各自的主要申请条件和资质要求:
Stripe:
1. 公司注册:
- 需要一个合法注册的公司实体。
- 在某些国家,也接受个人账户。
2. 银行账户:
- 需要一个与公司名称相匹配的银行账户。
3. 身份验证:
- 公司法人代表或主要负责人的身份证明。
- 可能需要提供地址证明。
4. 业务描述:
- 详细说明您的业务模式和销售的产品或服务。
5. 网站要求:
- 需要一个功能完善的网站,包含清晰的产品/服务描述、价格、联系方式和条款与条件页面。
6. 合规性:
- 需要遵守Stripe的使用条款和适用的法律法规。
7. 行业限制:
- 某些高风险行业可能不被接受或需要额外审核。
Adyen:
1. 公司注册:
- 必须是合法注册的公司实体。
2. 财务要求:
- 通常需要一定的年营业额(具体金额因地区而异)。
- 可能需要提供财务报表。
3. 身份验证:
- 公司董事和主要股东的身份证明。
- 公司注册文件。
4. 业务计划:
- 详细的业务计划,包括预期交易量和平均交易金额。
5. 网站要求:
- 功能完善的网站,包含完整的商业信息。
- 清晰的退款和隐私政策。
6. 合规性:
- 需要符合PCI DSS支付卡行业数据安全标准
- 遵守反洗钱AML和了解你的客户KYC规定。
7. 技术集成能力:
- 能够集成Adyen的API和支付系统。
8. 行业评估:
- 某些行业可能需要额外的审核或可能不被接受。
总的来说Adyen 的要求通常比 Stripe 更严格特别是在财务实力和业务规模方面。Stripe 相对更适合中小型企业和初创公司。
如果公司规模不大或者是新创企业Stripe 可能是更容易入门的选择。但如果您的业务已经有一定规模并且能够满足更严格的财务要求Adyen 可能提供更全面的服务。
## 还有其它聚合支付平台吗?
除了 Stripe 和 Adyen还有许多其他的聚合支付平台可以考虑。
1. PayPal:
- 优点:全球知名度高,支持多种货币,包括人民币。
- 缺点:在中国的使用可能受限,费用相对较高。
2. 2Checkout (现在是 Verifone):
- 优点支持全球200多个国家的支付包括中国。
- 缺点:费用可能较高,对某些高风险行业有限制。
3. Worldpay:
- 优点:支持多种支付方式,包括银联卡。
- 缺点:可能更适合大型企业,小企业可能难以满足要求。
4. BlueSnap:
- 优点支持全球100多种支付方式包括一些中国本地支付方式。
- 缺点:可能不如其他平台在中国市场知名。
5. Ping++(现已更名为 Chargebee):
- 优点:专注于亚太地区市场,支持多种中国本地支付方式。
- 缺点:国际支付选项可能相对有限。
6. Airwallex空中云汇:
- 优点:总部在澳大利亚,但在中国有很强的业务,支持跨境支付和多种货币。
- 缺点:主要面向企业客户,可能不太适合小型商户。
7. PingPong:
- 优点:专注于跨境电商支付,支持多种货币结算到中国银行账户。
- 缺点:主要面向跨境电商卖家,可能不适合所有类型的业务。
8. Payoneer:
- 优点:支持全球支付和收款,在中国市场有一定知名度。
- 缺点:主要用于跨境支付,国内支付功能可能有限。
9. LianLian Pay连连支付:
- 优点:中国本土支付公司,专注于跨境支付,了解中国市场。
- 缺点:国际支付选项可能不如一些全球性平台丰富。
10. Braintree (PayPal 旗下):
- 优点:提供全面的支付解决方案,包括移动支付。
- 缺点:在中国的使用可能受限,与 PayPal 类似。
选择支付平台时,需要考虑以下因素:
1. 地理覆盖:确保平台支持您的目标市场。
2. 支付方式:检查是否支持您需要的支付方式(如银联、信用卡等)。
3. 费用结构:比较不同平台的交易费用、月费等。
4. 技术集成:评估集成难度和可用的开发资源。
5. 安全性和合规性:确保平台符合 PCI DSS 等安全标准。
6. 客户支持:考虑时区和语言支持。
7. 结算周期和货币:检查资金结算到您账户的速度和支持的货币。
8. 额外功能如反欺诈工具、订阅billing等。
如果考虑中国市场,可以重点考虑 Ping++Chargebee、LianLian Pay 或 Airwallex 这类更了解中国市场的平台。这些平台通常能更好地处理中国的支付环境和法规要求。
## Paddle 怎么样
Paddle 确实是一个很好的选择,尤其是对于数字产品和软件服务。让我们详细分析一下 Paddle 的优缺点,以及它是否适合您的需求:
Paddle 的优点:
1. 全方位解决方案Paddle 不仅提供支付处理,还包括税务管理、发票生成、订阅管理等功能。
2. 全球支付支持多种货币和支付方式包括信用卡、PayPal 等。
3. 税务合规:自动处理全球销售税和增值税,这对跨境销售非常有利。
4. 简化的商户模式Paddle 作为商户记录Merchant of Record可以简化很多法律和税务复杂性。
5. 适合数字产品:特别适合销售软件、在线课程等数字产品。
6. 反欺诈保护:提供内置的反欺诈工具。
7. 订阅管理强大的订阅billing和管理功能。
8. 开发者友好提供良好的API和文档。
对于中国市场的考虑:
1. 支付方式Paddle 支持信用卡支付,这对于拥有国际信用卡的中国用户来说是可行的。
2. 银联支持截至我最后更新的信息Paddle 并不直接支持银联卡支付,这可能会限制一部分中国用户的使用。
3. 本地支付方式Paddle 不支持微信支付或支付宝,这可能会影响部分用户的支付体验。
4. 跨境支付Paddle 擅长处理跨境交易,这对于面向国际市场的中国企业很有优势。
5. 语言支持Paddle 的界面主要是英文,这可能对一些中国用户造成使用障碍。
总的来说Paddle 是一个强大的平台,特别适合销售数字产品和服务。但对于主要面向中国市场的业务来说,可能需要权衡其便利性和可能失去的一部分无法使用国际支付方式的用户。如果您的目标用户群主要是能够使用国际信用卡的群体,那么 Paddle 会是一个很好的选择。
## 请帮我比较下 Paddle 和 Paypal
当然,我很乐意为您比较 Paddle 和 PayPal 这两个支付平台。这两个平台都很受欢迎,但它们在功能和适用场景上有一些显著的差异。让我们从几个关键方面进行比较:
1. 主要功能和目标市场:
Paddle:
- 主要面向数字产品和软件服务销售
- 提供全面的电子商务解决方案,包括支付处理、税务管理、发票生成等
- 特别适合SaaS公司、应用开发者和数字内容创作者
PayPal:
- 通用型支付平台,适用于各种类型的在线和线下交易
- 主要提供支付处理服务
- 适合各种规模的企业和个人用户
2. 支付方式:
Paddle:
- 支持信用卡、借记卡和PayPal
- 不直接支持中国本地支付方式(如银联、支付宝、微信支付)
PayPal:
- 支持信用卡、借记卡、银行转账
- 在某些市场支持本地支付方式
- 在中国的使用可能受限
3. 全球化和本地化:
Paddle:
- 强大的全球税务管理功能
- 支持多种货币
- 自动处理国际销售税和增值税
PayPal:
- 在全球范围内广泛使用和认可
- 支持更多国家和地区
- 提供多语言支持
4. 费用结构:
Paddle:
- 通常采用统一费率例如5%+固定费用)
- 费用包含了支付处理、税务管理等所有服务
PayPal:
- 费率根据交易类型、销售额和国家/地区而变化
- 基本费率通常为每笔交易的2.9%+固定费用
- 跨境支付可能有额外费用
5. 附加功能:
Paddle:
- 提供订阅管理、软件许可管理
- 作为商户记录(Merchant of Record),简化法律和税务复杂性
- 内置的反欺诈工具
PayPal:
- 提供发票生成、大量支付处理等功能
- 与众多电子商务平台集成
- 提供PayPal Working Capital等融资选项
6. 开发者支持:
Paddle:
- 提供全面的API和开发者工具
- 文档和集成指南针对软件和数字产品优化
PayPal:
- 提供广泛的API和开发者资源
- 支持多种编程语言和平台
7. 客户支持:
Paddle:
- 提供个性化支持
- 可能更适合处理数字产品相关的特定问题
PayPal:
- 提供全球范围的客户支持
- 支持多种语言
8. 适合个人使用:
Paddle:
- 允许个人开发者使用,但主要面向商业用途
- 可能更适合有稳定数字产品收入的个人
PayPal:
- 非常适合个人用户,包括临时或小规模收款
- 提供简单的个人账户选项
9. 中国市场考虑:
Paddle:
- 在中国的使用可能受限,主要因为缺乏本地支付方式支持
- 可能更适合面向国际市场的中国开发者
PayPal:
- 在中国的使用同样受限,但品牌认知度较高
- 对于接收国际支付可能更为普遍
总结:
- 如果您主要销售数字产品或软件服务特别是面向国际市场Paddle可能更适合您。它提供了全面的解决方案包括税务管理和订阅处理。
- 如果您需要一个通用的支付解决方案或者主要面向个人用户和小额交易PayPal可能是更好的选择。它的使用更为广泛对个人用户更友好。
## Chargebee 和 Airwallex 的申请需要什么资质吗
Chargebee 和 Airwallex 都是提供支付和财务服务的平台,但它们的重点略有不同。让我们来看看它们各自的申请条件:
Chargebee:
1. 业务类型:
- 主要面向 SaaS 和订阅制业务,但也支持其他类型的在线业务。
2. 公司注册:
- 通常需要一个合法注册的公司实体。
- 在某些情况下可能接受个人申请,但这取决于具体情况。
3. 业务规模:
- 没有严格的最低收入要求。
- 适合从初创企业到大型公司的各种规模。
4. 文档要求:
- 公司注册证明
- 法定代表人身份证明
- 银行账户信息
5. 合规性:
- 需要遵守 PCI DSS支付卡行业数据安全标准
- 可能需要提供隐私政策和服务条款。
6. 技术要求:
- 需要有能力集成 Chargebee 的 API。
7. 地理位置:
- 支持多个国家和地区,但可能对某些高风险地区有限制。
Airwallex:
1. 业务类型:
- 主要面向需要处理跨境支付和外汇的企业。
- 适合电子商务、数字服务和国际贸易公司。
2. 公司注册:
- 要求申请者必须是合法注册的公司实体。
- 通常不接受个人申请。
3. 业务规模:
- 可能有最低月交易量或年收入要求。
- 更适合中型到大型企业,或快速增长的初创公司。
4. 文档要求:
- 公司注册证明
- 董事和主要股东的身份证明
- 近期财务报表
- 银行对账单
5. 合规性:
- 严格的 KYC了解你的客户和 AML反洗钱审核。
- 需要详细说明业务模式和资金流向。
6. 行业限制:
- 可能对某些高风险行业有限制或额外审核要求。
7. 地理位置:
- 虽然支持多个国家,但服务可用性可能因地区而异。
- 对中国市场有较好的支持。
8. 技术集成:
- 需要有能力集成 Airwallex 的 API 和系统。
9. 财务稳定性:
- 可能会评估公司的财务健康状况和增长潜力。
申请建议:
1. 直接联系:两家公司都建议潜在客户直接联系他们的销售团队,以获取最新和最准确的申请信息。
2. 准备商业计划:详细说明您的业务模式、预期交易量和增长计划。
3. 技术评估:评估您的技术团队是否能够集成这些平台的 API。
4. 合规准备:确保您的业务符合所有必要的合规要求,特别是在数据保护和金融法规方面。
5. 比较选项:考虑您的具体需求(如跨境支付、订阅管理等),选择最适合的平台。
6. 试用或演示:如果可能,请求产品演示或试用,以更好地了解平台功能。
总的来说Chargebee 可能更适合需要强大订阅管理功能的企业,而 Airwallex 则更适合有大量跨境交易需求的公司。对于中国市场Airwallex 可能提供更直接的支持,但这两个平台都需要仔细评估它们是否符合您的具体业务需求和中国相关法规。
## BlueSnap 容易申请吗?支持个人申请吗?
BlueSnap 是一个全球支付平台,提供多种支付解决方案。让我们详细了解一下 BlueSnap 的申请流程和对个人申请的政策:
BlueSnap 申请流程:
1. 申请难度:
- BlueSnap 的申请过程相对简单,但要求可能比一些面向个人的平台(如 PayPal更严格。
- 申请难度主要取决于您的业务类型、规模和所在地区。
2. 个人申请政策:
- BlueSnap 主要面向企业客户,但在某些情况下也接受个人申请。
- 个人申请通常针对独立开发者、自由职业者或小型在线业务。
3. 申请要求:
对于企业:
- 有效的商业登记证明
- 公司法定代表人身份证明
- 银行账户信息
- 业务描述和网站 URL
- 预期月交易量
对于个人(如果接受):
- 有效的身份证明
- 地址证明
- 银行账户信息
- 业务描述或销售产品/服务的详细信息
- 个人网站或在线商店 URL如果有
4. 行业限制:
- BlueSnap 可能对某些高风险行业有限制或额外的审核要求。
5. 地理限制:
- 支持多个国家和地区,但服务可用性和具体要求可能因地区而异。
6. 合规要求:
- 需要遵守 PCI DSS 标准。
- 可能需要提供隐私政策和服务条款。
7. 技术要求:
- 需要有能力集成 BlueSnap 的 API 或使用其支付页面。
对于中国用户的特别考虑:
1. 跨境支付BlueSnap 支持跨境支付,这对面向国际市场的中国卖家有利。
2. 本地支付方式:了解 BlueSnap 是否支持对中国买家友好的支付方式。
3. 合规性:确保使用 BlueSnap 符合中国关于跨境支付和外汇管理的相关法规。
4. 语言支持BlueSnap 的主要界面和支持可能是英语,这可能需要考虑。
总结:
BlueSnap 的申请过程对个人来说可能比一些专门面向个人的平台更复杂,但仍然可能接受个人申请,特别是对于有稳定在线业务的个人。申请难度和成功率将取决于您的具体情况、业务类型和所在地区。建议直接联系 BlueSnap 的销售团队,他们可以根据您的具体情况提供最准确的信息和指导。
## 2Checkout 的申请呢?
2Checkout现在是 Verifone 的一部分)是一个广泛使用的全球支付平台。让我们来看看 2Checkout 的申请流程和要求:
2Checkout 申请流程:
1. 申请难度:
- 相对较为简单,但仍需要满足一定的要求。
- 对于小型企业和个人来说,通常比一些企业级支付解决方案更容易申请。
2. 个人申请政策:
- 2Checkout 接受个人申请,这使其成为独立开发者、自由职业者和小型在线业务的良好选择。
3. 申请要求:
对于企业:
- 有效的商业登记证明
- 公司法定代表人身份证明
- 公司银行账户信息
- 网站 URL 和详细的业务描述
对于个人:
- 有效的政府颁发的身份证明
- 地址证明(如水电费账单)
- 个人银行账户信息
- 网站 URL 或详细的产品/服务描述
4. 网站要求:
- 功能完善的网站,包含清晰的产品/服务描述
- 明确的定价信息
- 隐私政策和服务条款
- 联系信息
5. 产品/服务审核:
- 2Checkout 会审核您计划销售的产品或服务,确保符合其使用政策。
6. 行业限制:
- 对某些高风险行业可能有额外的审核要求或限制。
7. 地理覆盖:
- 支持全球多个国家和地区的商户。
8. 合规要求:
- 需要遵守 PCI DSS 标准。
- 可能需要提供额外的合规文档,取决于您的业务性质。
9. 技术集成:
- 提供多种集成选项,包括简单的结账页面和更高级的 API 集成。
申请步骤:
1. 访问 2Checkout 官网,点击 "Sign Up" 或 "Get Started"。
2. 选择账户类型(个人或企业)。
3. 填写基本信息,包括联系方式和网站 URL。
4. 提供详细的业务信息,包括您计划销售的产品或服务。
5. 上传必要的文档,如身份证明和地址证明。
6. 等待 2Checkout 团队审核您的申请。
申请建议:
1. 准备完整的文档:确保所有必要的文档齐全且有效。
2. 网站优化:确保您的网站专业、信息完整,符合 2Checkout 的要求。
3. 详细描述:提供清晰、详细的业务或产品/服务描述。
4. 合规性:确保您的业务模式和产品/服务符合 2Checkout 的政策。
5. 响应及时:如果 2Checkout 团队有任何问题或需要额外信息,请及时回复。
对中国用户的特别考虑:
1. 跨境支付2Checkout 支持跨境交易,这对面向国际市场的中国卖家有利。
2. 本地支付方式:了解 2Checkout 是否支持对中国买家友好的支付方式。
3. 汇款和结算:了解资金如何转入中国银行账户,以及是否有任何限制。
4. 法规遵从:确保使用 2Checkout 符合中国关于跨境电子商务和支付的相关法规。
总结:
2Checkout 对个人申请相对友好,申请过程相对简单。它适合各种规模的在线业务,包括个人开发者和小型企业。对于中国用户来说,它提供了一个进入全球市场的好机会,但同时也需要注意跨境支付相关的法规遵从问题。
## 2Checkout 对中国用户的支持怎么样
2Checkout 对中国用户的支持有一些优势,但也存在一些限制。让我们详细分析一下:
优势:
1. 跨境支付支持:
- 2Checkout 支持全球支付,对于想要面向国际市场的中国卖家来说是个好选择。
2. 多种支付方式:
- 支持信用卡、PayPal 等国际支付方式,有利于接受来自全球客户的付款。
3. 多币种支持:
- 支持多种货币交易,包括美元、欧元等主要货币。
4. 税务处理:
- 提供国际税务管理功能,可以帮助处理跨境销售的税务问题。
5. 防欺诈系统:
- 内置的防欺诈工具可以保护卖家免受潜在的欺诈交易。
6. 开发者友好:
- 提供 API 和各种集成选项,适合技术型卖家。
限制和挑战:
1. 本地支付方式有限:
- 不直接支持支付宝、微信支付等中国主流支付方式。
- 这可能会影响面向国内市场的销售。
2. 语言支持:
- 主要界面和支持是英语,可能对不熟悉英语的中国用户造成使用障碍。
3. 客户支持时差:
- 客户支持可能不在中国时区,可能影响及时获得帮助。
4. 银行对接:
- 资金转入中国银行账户可能需要额外的步骤或时间。
5. 合规性问题:
- 使用国际支付平台需要遵守中国的跨境电商和外汇管理规定。
- 卖家需要确保自己的业务符合这些规定。
6. 费用结构:
- 国际交易的费用可能比国内支付平台高。
- 汇率转换可能产生额外成本。
7. 实名认证:
- 可能需要提供更多的身份证明文件,以满足国际支付平台的要求。
8. 市场认知度:
- 在中国市场2Checkout 的品牌认知度可能不如一些本地或更大的国际支付平台。
建议:
1. 目标市场评估:
- 如果主要面向国际市场2Checkout 是一个不错的选择。
- 如果主要面向中国国内市场,可能需要考虑其他更适合的支付解决方案。
2. 合规性检查:
- 咨询法律或财务顾问,确保使用 2Checkout 符合中国的相关法规。
3. 银行咨询:
- 与您的银行讨论接收国际支付的流程和可能的限制。
4. 双平台策略:
- 考虑同时使用 2Checkout 和一个本地支付平台,以覆盖更广泛的客户群。
5. 技术评估:
- 评估您的技术团队是否能够有效集成和管理 2Checkout 的系统。
6. 试用期:
- 如果可能,请求一个试用期来评估平台的实际表现和适用性。
总结:
2Checkout 对于想要开拓国际市场的中国卖家来说是一个有价值的选择,特别是在处理国际支付和跨境交易方面。然而,对于主要面向中国国内市场的企业,它可能不是最佳选择。在做决定之前,仔细评估您的业务需求、目标市场和技术能力是非常重要的。同时,确保充分了解并遵守相关的跨境电商和支付法规。
本指南由[程序员出海社群](https://chengxuyuanchuhai.com/)创建,版权所有。`;