# Pinnovate Cloud

Pinnovate Cloud 是一个基于 Next.js + TypeScript + TailwindCSS 搭建的云加速/网络优化服务站点，涵盖产品能力展示、定价、案例、新闻资讯与在线联系等模块，可静态导出或按 SSR 部署。

## 功能概览
- 页面：首页（Hero、优势、流程、CTA、客户推荐）、产品与服务、定价、成功案例、新闻资讯、关于我们、联系我们、登录占位页。
- 内容：content/news/*.md 存放新闻 Markdown，通过 lib/content.ts + gray-matter 解析 frontmatter，marked 渲染详情，构建时静态生成。
- 表单：components/Contact.tsx 集成 Formspree（https://formspree.io/f/xkgvgzal）提交，带表单校验、提交状态与联系方式卡片。
- 组件：导航、页脚、CTA、案例列表、新闻列表、核心优势等复用组件，Tailwind 响应式布局。
- 部署：支持静态导出、SSR、Docker 镜像，内置 Vercel/Netlify 配置、Nginx 示例与 PowerShell 一键部署脚本。

## 技术栈
- Next.js 15 / React 19、TypeScript
- TailwindCSS、Lucide React 图标
- gray-matter + marked 解析 Markdown 内容
- 部署与运维：Dockerfile、docker-compose.yml、nginx.conf、vercel.json、netlify.toml、deploy.ps1

## 目录结构
`
.
├─pages/                 # 路由页（首页、features、pricing、cases、news、about、contact、login 等）
│  └─news/[slug].tsx     # 新闻详情的静态路由
├─components/            # UI 组件（Navbar、Hero、Features、CaseList、NewsList、Contact 等）
├─content/news/          # 新闻 Markdown 数据源
├─lib/content.ts         # 内容读取与 frontmatter 解析
├─public/                # 图片与静态资源
├─styles/                # 全局样式
├─deploy.ps1             # 多平台一键部署脚本
├─Dockerfile / docker-compose.yml / nginx.conf
├─netlify.toml / vercel.json / DEPLOYMENT.md
└─package.json           # 脚本与依赖
`

## 快速开始
- 环境：Node.js 18+，npm
- 安装依赖：
pm install
- 本地开发：
pm run dev，访问 http://localhost:3000
- 生产构建：
pm run build
- 生产启动：
pm run start

## 内容维护（新闻）
- 在 content/news/ 下新增 .md 文件即可被列表与详情读取，示例 frontmatter：
`md
---
title: 标题
date: 2025-09-15
summary: 一句话摘要
tags: [CDN, 性能, 安全]
---

正文内容，支持 Markdown 语法。
`
- 构建时会按照 date 降序生成新闻列表，[slug].tsx 用 marked 渲染正文。

## 常用脚本
- 
pm run dev：本地开发
- 
pm run build / 
pm run start：SSR 构建与生产运行
- 
pm run build:static / 
pm run export：静态导出到 out/
- 
pm run preview：构建后本地预览
- 
pm run type-check、
pm run lint：类型与代码质量检查
- 
pm run docker:build、
pm run docker:run：Docker 构建与运行
- 
pm run deploy:vercel、
pm run deploy:netlify：云平台部署命令占位

## 部署指引
- 静态站点：运行 
pm run build:static，将 out/ 部署到静态托管（Netlify、GitHub Pages 等）。
- SSR：
pm run build && npm run start，或使用 Dockerfile/docker-compose.yml 与 
ginx.conf。
- 一键脚本：PowerShell 执行 ./deploy.ps1 -Platform static|vercel|netlify|github|docker。
- Vercel/Netlify：可直接使用仓库内 ercel.json、
etlify.toml，或通过脚本触发。

## 配置提示
- 联系表单收件端点在 components/Contact.tsx 中可替换。
- Tailwind 主题色在 	ailwind.config.js 中调整，静态资源放置于 public/。