Vercel

Vercel是一个开发者平台，它提供了一个简单、快速和可靠的方式来构建、部署和扩展前端网站和应用程序。Vercel的主要目标是提供最佳的开发者体验，让开发者能够快速地构建和部署他们的项目。

1.Vercel的主要功能和特点

Serverless Functions: Vercel 提供了无服务器函数（Serverless Functions），这是一种轻量级、易于使用的后端服务，开发者可以使用它来处理 API 请求、执行后端逻辑等。
Instant Cache Invalidation: Vercel 提供了即时缓存失效（Instant Cache Invalidation）功能，这意味着当你的内容更新时，全球的用户都能立即看到最新的内容。
Edge Network: Vercel 的边缘网络（Edge Network）将你的内容分发到全球，确保用户无论身处何处都能快速加载你的应用。
Preview Deployment: Vercel 的预览部署（Preview Deployment）功能允许你在合并代码之前查看和测试更改。每当你提交一个新的拉取请求（Pull Request）时，Vercel 都会自动创建一个新的预览部署。
Performance Analytics: Vercel 提供了性能分析（Performance Analytics）工具，帮助你监控和改进你的应用的性能。
Zero Configuration: Vercel 提供了零配置（Zero Configuration）的部署体验，你只需将你的代码推送到 Vercel，然后 Vercel 会自动为你构建和部署你的应用。
Integration with Git: Vercel 与 Git 集成，支持自动部署，每次提交代码后，Vercel 会自动部署新的版本。
Built-in CDN: Vercel 内置了内容分发网络（CDN），可以将你的应用内容分发到全球，确保快速加载。
Support for Many Frontend Frameworks: Vercel 支持许多前端框架，包括 React、Vue、Angular、Next.js 等。
Environment Variables: Vercel 支持环境变量，你可以为你的应用设置和管理环境变量，以满足不同环境的需求。

这些功能和特点使 Vercel 成为一个强大的前端开发和部署平台，无论你是一个独立开发者还是一个开发团队，Vercel 都能提供你所需要的工具和服务。

2.Vercel的优势

Vercel 的优势：

简化部署流程：Vercel 提供了零配置的部署体验，开发者只需要将代码推送到 Vercel，就可以自动构建和部署应用，极大地简化了部署流程。
优秀的性能：Vercel 的边缘网络将应用内容分发到全球，无论用户在何处，都能快速加载应用。同时，Vercel 的即时缓存失效功能确保用户始终能看到最新的内容。
强大的开发工具：Vercel 提供了一系列强大的开发工具，包括无服务器函数、预览部署和性能分析等，帮助开发者提升开发效率和应用性能。
开发者友好：Vercel 对开发者非常友好，它支持各种主流的前端框架，如 Next.js、Gatsby、Vue.js 等，并且与 GitHub、GitLab 和 Bitbucket 等代码托管平台有着深度的集成。

3.如何安装Vercel

Vercel是一个在线平台，因此你不需要在本地安装。但是，如果你想在本地使用Vercel的命令行工具（Vercel CLI），你可以按照以下步骤进行安装：

首先，你需要确保你的计算机上已经安装了Node.js和npm。如果没有，你可以去Node.js的官方网站下载并安装。

然后，你可以使用npm（Node.js的包管理器）来全局安装Vercel CLI。在命令行中运行以下命令：

npm i -g vercel

这条命令会安装最新版本的Vercel CLI。

安装完成后，你可以通过运行 vercel -v 命令来确认Vercel CLI是否已经成功安装。

最后，你需要使用你的Vercel账户登录。在命令行中运行 vercel login 命令，然后按照提示输入你的Vercel账户的邮箱和密码。

以上就是安装和使用Vercel CLI的基本步骤。

4.如何配置Vercel

配置 Vercel 主要涉及到两个方面：配置你的项目和配置 Vercel CLI。以下是一些基本的配置步骤：

配置你的项目

在你的项目根目录下，你可以创建一个 vercel.json 文件来配置你的项目。这个文件应该是一个有效的 JSON 文件，其中包含一个对象，该对象的属性可以用来配置你的项目。

以下是一个 vercel.json 文件的例子：
```
{
  "version": 2,
  "name": "my-app",
  "builds": [
    { "src": "package.json", "use": "@vercel/node" }
  ],
  "routes": [
    { "src": "/(.*)", "dest": "/index.html" }
  ]
}
```
在这个例子中，version 属性用来指定 Vercel 平台的版本（目前应该是 2），name 属性用来指定项目的名称，builds 属性用来指定构建配置，routes 属性用来指定路由配置。
配置 Vercel CLI

你可以使用 vercel 命令来配置 Vercel CLI。这个命令有很多选项和子命令，你可以使用 vercel --help 命令来查看所有的选项和子命令。

以下是一些常用的 vercel 命令：
- vercel login：登录你的 Vercel 账户。
- vercel logout：登出你的 Vercel 账户。
- vercel whoami：显示当前登录的 Vercel 账户。
- vercel list：列出你的所有项目。
- vercel deploy：部署你的项目。
- vercel inspect：查看你的部署的详细信息。

以上就是配置 Vercel 的基本步骤，具体的配置可能会根据你的项目和需求有所不同。你可以查看 Vercel 的官方文档来获取更详细的信息。

5.如何创建和部署一个项目

在Vercel上创建和部署一个项目的步骤如下：

创建项目

在你的本地系统中创建一个新的项目。你可以使用任何你喜欢的编程语言和框架。只要你的项目可以通过一个命令（如npm start）启动，就可以使用Vercel部署。

例如，如果你使用Node.js，你的项目结构可能会像这样：
```
/my-project
  /index.js
  /package.json
```
在package.json文件中，你需要有一个start脚本来启动你的应用。例如：
```
{
  "name": "my-project",
  "scripts": {
    "start": "node index.js"
  }
}
```
初始化项目

在项目的根目录下运行vercel命令。这将初始化你的项目，并为你的项目创建一个新的Vercel部署。
```
$ cd my-project
$ vercel
```
在这个阶段，Vercel CLI会询问你一些问题来配置你的部署。例如，它会询问你的项目的名称，以及你想要将你的项目部署到哪个Vercel团队或个人账户。

你也可以使用--prod标志立即将你的项目部署到生产环境：
```
$ vercel --prod
```
部署项目

一旦你的项目被初始化，你可以使用vercel命令来部署你的项目。每次你运行这个命令，Vercel CLI都会为你的项目创建一个新的部署，并返回部署的URL。
```
$ vercel
```
查看部署

你可以在浏览器中打开返回的URL来查看你的部署。你也可以使用vercel ls命令来查看你所有的部署。
```
$ vercel ls
```

这就是在Vercel上创建和部署一个项目的基本步骤。

搭建属于自己的ChatGPT Web

01. 开源项目网站

02. 部署过程

Step1: 获取 open-ai-key

访问网址：platform.openai.com/account/api…

注意：该 api key 只在创建时，显示一次，所以要保存好。

在这里插入图片描述

Step2: 开始构建

将 github.com/Yidadaa/Cha…该项目 fork 到自己 GitHub 的 repo 中
访问 Deploy，并使用 GitHub 登录
登录成功后，访问 vercel.com/dashboard，并新建一个项目
导入上述步骤 1 中 fork 过来的项目
配置项目并进行 Deploy

填加的两个环境变量：
- OPENAI_API_KEY：上述 Step1 中生成 API_KEY
- CODE：访问密码，可选，可以使用逗号隔开多个密码。
点击 Deploy 之后，开始进行部署
部署成功，查看访问地址