快速开始

快速开始

感谢选择 ShipAny，这是一个 NextJS 开发脚手架，用于快速开发 AI SaaS 项目。

获取 ShipAny 代码

  1. 在 ShipAny 官网下单购买

https://shipany.ai/#pricing

  1. 支付完成后，进入订单中心

https://shipany.ai/my-orders

选择订单进行激活。

  1. 绑定你的 Github Username 进行激活

activate

  1. 激活成功后，你将在 Github 通知中心收到邀请，点击加入 ShipAny 代码仓库

拉取项目代码

  1. 进入 ShipAny 代码仓库（如果未加入仓库，打开会是 404）

https://github.com/shipanyai/shipany-template-one

  1. 选择 git clone 的方式，或者直接下载源代码到你的本地电脑

ssh-clone-project

Terminal
git clone [email protected]:shipanyai/shipany-template-one.git my-shipany-project

安装项目

  1. 进入项目根目录
Terminal
cd my-shipany-project
  1. 安装项目依赖
Terminal
pnpm install

开发调试

  1. 复制环境变量配置文件
Terminal
cp .env.example .env.development
  1. 启动开发服务器
Terminal
pnpm dev

pnpm-dev

  1. 本地预览

在浏览器打开 http://localhost:3000 ，即可预览你的项目

preview

定制化修改

修改网页配色

  1. 选择一个 shadcn 主题调试器
  1. 为你的项目调制一套主题配色：

theme-generator

  1. 复制主题样式，粘贴到项目文件：app/theme.css

theme-css

  1. 重新进入项目预览页面，即可看到你定制的主题

theme-preview

修改落地页内容

  1. 打开落地页内容文件，AI 辅助生成新的落地页内容
Prompt
I want to build a landing page for my product named "Flux AI Image Generator", please update the landing page json file, content reference @Web @https://www.flux.ai/

update-landing

  1. 应用 AI 生成的新落地页内容，人工稍加调整，重新预览新的落地页

new-landing

  1. 继续调整 i18n/pages/landing 下的其他 json 文件，使网页显示的内容跟你的项目相符。

修改多语言文案

在 i18n/messages 目录下，通过 [locale].json 文件配置页面内容，默认支持中文和英文，在 i18n/messages/ 目录下，可以看到 en.json 和 zh.json 两个文件，在项目发布之前，修改成跟你项目相符合的文案即可。

可以让 AI 辅助生成内容：

Prompt
update content of this file, for my new project "Flux AI", which is an AI Image Generator, with keywords "flux ai, ai image generator"

i18n-message

修改网站协议

在网站正式上线之前，请根据你网站提供的服务，更新 app/(legal) 目录下的网站协议。

  1. 更新隐私政策

在 Cursor 中，通过提示词生成新的隐私政策内容。

Prompt
update privacy-policy according to landing page content @en.json
with brand name "ShipAny", domain "shipany.ai", contact email is "[email protected]"

替换 app/(legal)/privacy-policy/page.mdx 文件中的内容，更新隐私政策。

update-privacy

  1. 更新服务条款

在 Cursor 中，通过提示词生成新的服务条款内容。

Prompt
update terms-of-service according to landing page content @en.json
with brand name "ShipAny", domain "shipany.ai", contact email is "[email protected]"

替换 app/(legal)/terms-of-service/page.mdx 文件中的内容，更新服务条款。

update-terms

修改环境变量

根据实际需求，修改环境变量，开启数据存储 / 登录 / 数据统计 / 支付等功能

Terminal
# -----------------------------------------------------------------------------
# Web Information
# -----------------------------------------------------------------------------
NEXT_PUBLIC_WEB_URL = "http://localhost:3000"
NEXT_PUBLIC_PROJECT_NAME = "ShipAny"
 
# -----------------------------------------------------------------------------
# Database with Supabase
# -----------------------------------------------------------------------------
# https://supabase.com/docs/guides/getting-started/quickstarts/nextjs
# Set your Supabase URL and Anon Key
SUPABASE_URL = ""
SUPABASE_ANON_KEY = ""
 
# -----------------------------------------------------------------------------
# Auth with next-auth
# https://authjs.dev/getting-started/installation?framework=Next.js
# Set your Auth URL and Secret
# Secret can be generated with `openssl rand -base64 32`
# -----------------------------------------------------------------------------
AUTH_SECRET = ""
 
# Google Auth
# https://authjs.dev/getting-started/providers/google
AUTH_GOOGLE_ID = ""
AUTH_GOOGLE_SECRET = ""
NEXT_PUBLIC_AUTH_GOOGLE_ENABLED = "false"
NEXT_PUBLIC_AUTH_GOOGLE_ONE_TAP_ENABLED = "false"
 
# Github Auth
# https://authjs.dev/getting-started/providers/github
AUTH_GITHUB_ID = ""
AUTH_GITHUB_SECRET = ""
NEXT_PUBLIC_AUTH_GITHUB_ENABLED = "false"
 
# -----------------------------------------------------------------------------
# Analytics with Google Analytics
# https://analytics.google.com
# -----------------------------------------------------------------------------
NEXT_PUBLIC_GOOGLE_ANALYTICS_ID = ""
 
# -----------------------------------------------------------------------------
# Analytics with OpenPanel
# https://openpanel.dev
# -----------------------------------------------------------------------------
NEXT_PUBLIC_OPENPANEL_CLIENT_ID = ""
 
# -----------------------------------------------------------------------------
# Payment with Stripe
# https://docs.stripe.com/keys
# -----------------------------------------------------------------------------
STRIPE_PUBLIC_KEY = ""
STRIPE_PRIVATE_KEY = ""
 
NEXT_PUBLIC_PAY_SUCCESS_URL = "http://localhost:3000/my-orders"
NEXT_PUBLIC_PAY_CANCEL_URL = "http://localhost:3000/#pricing"

发布上线

  1. 创建 Github 仓库

请务必选择私有仓库，不要公开发布 ShipAny 的代码，拒绝盗版。

create-project

  1. 将修改后的项目代码，提交到项目 Github 仓库
Terminal
git remote set-url origin https://github.com/your-username/your-project-name.git
git add .
git commit -m "update landing page"
git push origin main

git-commit

  1. 在 Vercel 控制台创建新项目，导入代码仓库，一键部署

vercel-new-project

  1. 等构建完成，即可在 Vercel 控制台看到你的项目

vercel-console

  1. 打开域名，即可访问你的项目

vercel-preview

前置说明更新日志