Landing Page
默认 Landing Page 的薄路由、私有 section 组合顺序和扩展规则。
默认 / 是实际 Landing Page,不是营销页占位。路由文件只负责 public SEO 和挂载 HomePage,全部页面表现放在 apps/web/src/pages/_app/homepage/-components。
组合结构
export function HomePage() {
return (
<div className="flex flex-col">
<HeroSection />
<LogoCloudSection />
<StatsSection />
<Features3Section />
<FeaturesSection />
<CallToActionSection />
<Features2Section />
<IntegrationSection />
<Integration2Section />
<PricingSection />
<FaqSection />
<TestimonialsSection />
<NewsletterCard />
</div>
)
}组合器只表达叙事顺序,不持有 section 的文案数据和交互实现。newsletter-card-profile.tsx 根据构建 profile 稳定导出启用态或关闭态组件,关闭模块时不会触达 Newsletter API。
文件职责
| 文件 | 职责 |
|---|---|
hero.tsx | 产品主视觉、价值主张与主次行动 |
logo-cloud.tsx | 使用 LogoLoop 与 Simple Icons 展示技术栈和生态品牌标志 |
stats.tsx | 平台覆盖与默认约束指标 |
features.tsx / features2.tsx / features3.tsx | 三种能力和架构表达 |
calltoaction.tsx | Projects 与账户入口 |
integration.tsx / integration2.tsx | 请求链路与生态集成 |
pricing.tsx | 开源、自托管和扩展路径 |
faqs.tsx | 原生 details/summary FAQ |
testimonials.tsx | 角色反馈 |
newsletter-card*.tsx | Manifest-gated 订阅转化 |
section-heading.tsx | section 标题排版原语 |
公共布局
首页和其他 _app 页面共享 pages/_app/-components/layout/header.tsx 与 footer.tsx。Header 私有的移动菜单、语言切换和主题按钮位于 layout/-components,例如 header-actions-menu.tsx,不与首页 section 混放。
样式约束
- 优先复用 Web 全局 Nova 语义 token,不在 section 内建立第二套颜色系统。
- Web 产品 UI 图标只使用
i-solar-*/i-carbon-*;真实品牌标志可使用本地构建的i-simple-icons-*。 - 文案来自严格 i18n 或
APP_BRAND,不把品牌写死在组件里。 - section 保持全宽 band 或无框布局;卡片只表示真实重复项。
- 新增 section 时同步
home-page.tsxHeader、homepage/-components/.folder.md和本页。
路由和服务端边界见 代码结构。