Vercel 是一个云平台，用于构建、部署和扩展无服务器应用程序和静态网站。由于其易用性、速度和处理大量流量的能力，它在开发人员中越来越受欢迎。

使用 Vercel，您可以使用各种编程语言和框架构建和部署应用程序，并利用自动 SSL、无服务器函数和持续部署等功能。

在本文中，我们将探讨使用 Vercel 的好处，并深入探讨它的一些关键功能。我们还将研究平台的一些限制和注意事项，以便在决定Vercel是否是您下一个项目的正确选择时牢记。

什么是Vercel？

Vercel 是一个面向前端开发人员的云平台，通过它我们可以抽象出部署、预览、CI/CD、API 调用和一大堆其他功能。免费。

2020 年 4 月，Zeit 更名为 Vercel，反映了其对核心产品的关注以及对持续改进的承诺。自成立以来，Vercel在开发和推广Jamstack架构方面发挥了重要作用，该架构强调静态站点生成和无服务器功能，以构建快速安全的Web应用程序。

Vercel 也是流行的 Next.js 框架背后的公司，这是一个基于 React 的框架，用于构建服务器渲染的应用程序。Vercel 和 Next.js 之间的紧密集成使其成为许多基于可组合架构构建的开发人员的首选。

Vercel 特色

部署在Vercel的边缘网络上运行，从而减少了Web应用程序或网站的加载时间，添加了缓存层，甚至通过无服务器功能实现了后端功能。

手动配置服务器、弄乱 Docker 容器、设置 Nginx 和配置 DNS 现在对我来说都是不必要的麻烦。

当我尝试Vercel时，我的第一印象是它“只是工作”，这对开发人员来说是一种美妙的感觉。当你意识到你刚刚节省了大量的时间，并将在未来继续这样做时，这些真的是值得品味的时刻。

然而，对我来说，真正的美丽一直是价格标签。如果进入时存在财务障碍，我永远无法深入研究和欣赏上述功能——即使是很小的障碍。

许多公司会让你体验他们提供的产品，但你很快就会意识到，在现实世界中有效所需要的是在付费墙后面。

例如，我曾经使用过Heroku。当时，有许多开发人员会将他们的爱好项目上传到他们的免费层。我们没有免费获得的是SSL证书或自定义域 - 这两者都是现实世界中的交易破坏者。

💡 使用 Vercel，我可以随意上传项目以进行一次性部署、概念验证应用程序等，并且可以将它们展示给使用开箱即用的 .vercel.app 域的任何人。

那么你到底从Vercel得到了什么？下面是一个概述。

前端代码的零配置无缝部署

Vercel 提供前端代码的无缝部署，无需配置。这意味着开发人员可以专注于构建他们的应用程序，而不是配置服务器、Docker 容器或 Nginx。

实时洞察、分析和性能指标

Vercel 提供实时洞察、分析和性能指标，帮助开发人员了解其应用程序的性能。

“无限”可扩展性

Vercel提供了无限的可扩展性，这意味着应用程序可以处理任何数量的流量，只要人们负担得起。

边缘网络（CDN、缓存、边缘功能）

Vercel使用全球边缘网络，减少Web应用程序的加载时间，添加缓存层，甚至通过无服务器功能实现后端功能。

静态资产托管（图像、媒体）

Vercel为各种图像和媒体提供静态资产托管。

部署预览和 A/B 测试

Vercel允许开发人员通过部署预览和A / B测试来测试新功能。

99.99% uptime

Vercel提供99.99%的正常运行时间，确保应用程序始终可用并运行良好。

持续集成和部署 （CI/CD）

Vercel 提供持续集成和部署，使开发人员能够快速轻松地将更改推送到生产环境。

基于 Git 的工作流

Vercel 使用基于 git 的工作流程，使协作和版本控制变得容易。

免费套餐

Vercel有一个免费套餐，允许开发人员测试和部署他们的应用程序，没有任何财务障碍进入。

支持的框架和静态站点生成器

Vercel支持各种编程语言和框架，使开发人员能够使用他们喜欢的工具构建和部署应用程序。Vercel支持的一些流行框架和语言包括：

1. Next.js: 一个流行的 React 框架，用于构建服务器渲染的应用程序。
2. Gatsby: 一个基于 React 的强大静态站点生成器，非常适合创建快速和优化的网站。
3. Nuxt.js: 一个基于 Vue.js 的框架，用于创建具有服务器端渲染的通用 Vue.js 应用程序。
4. React: 一个流行的JavaScript库，用于构建用户界面，由Facebook开发。
5. Vue.js: 一个用于构建用户界面的渐进式JavaScript框架。
6. Angular: 一个用于构建Web应用程序的平台，由Google开发。
7. Svelte: 一个更新、轻量级、快速的JavaScript框架，用于构建用户界面。
8. Ember.js: 用于创建雄心勃勃的Web应用程序的框架，重点是开发人员的生产力。
9. Eleventy: 一个更简单的静态站点生成器，适用于多种模板语言。
10. Hugo: 一个用Go构建的快速灵活的静态站点生成器。

请记住，虽然Vercel内置了对这些流行的元框架和静态站点生成器的支持，但它也可以与其他工具和技术一起使用，因为它是部署Web应用程序和静态站点的多功能平台。

它的灵活性允许开发人员使用他们喜欢的工具，使其成为各种项目的便捷选择。

安全

安全性是任何云平台的关键方面，Vercel实施了多种安全功能和实践来保护用户数据和应用程序。Vercel提供的一些关键安全功能包括：

• 自动 SSL: Vercel为自定义域提供免费的SSL证书，确保客户端和部署的应用程序之间的加密连接。SSL证书会自动颁发和续订，从而减少了手动管理SSL证书的麻烦。
• 安全默认设置: V Vercel确保应用程序配置安全的默认设置，从而降低由于配置错误而导致漏洞的风险。
• DDoS 保护: Vercel的边缘网络提供内置的DDoS保护，保护应用程序免受各种类型的DDoS攻击。
• 不可变部署: Vercel上的每个部署都是不可变的，这意味着一旦部署，就无法更改。这种做法降低了未经授权修改的风险，并确保对应用程序的任何更改都必须经过正确的部署过程。
• 无服务器功能的隔离: Vercel的无服务器功能在隔离的环境中运行，限制了安全漏洞的潜在爆炸半径。
• 访问控制: Vercel 允许通过角色分配对团队成员权限进行精细控制，有助于实施最小特权原则。
• 定期安全审计: Vercel定期进行第三方安全审计，以确保平台保持高水平的安全性。
• GDPR 和隐私合规性: Vercel 遵守 GDPR 准则，并实施以隐私为中心的实践来保护用户数据。

开始使用 Vercel

开始使用 Vercel 的最佳方法是插入您的 git 存储库。我发现这个工作流程非常直观，如果你在 2023 年不使用 git，好吧…请学习 git。

我觉得每个开发人员都应该采用的技术并不多，但 git 就是其中之一。

接下来，您注册一个Vercel帐户，使用Vercel仪表板中直观且易于遵循的步骤连接到Github / Gitlab / Bitbucket，Vercel将负责其余的工作。它可以识别您的代码是在哪个框架中编写的（它知道大约 35 个框架，如果您的代码使用一个框架，则会自动配置）并自动部署。

您也可以使用控制台添加环境变量 - 您绝对应该这样做（永远不要将敏感数据添加到git存储库，甚至是私有存储库） - 然后应用程序将自动构建和部署自己。

启动应用后，可以免费添加自定义域，颁发 SSL/TLS 证书（并自动续订），并且应用已准备好从边缘网络提供服务。使用免费套餐也不会对性能造成影响;您的免费应用是生产级的，可以依赖它进行业务关键型操作。

那里，Vercel有一个独特的产品 - 实时分析。

我喜欢谷歌浏览器的 Lighthouse，在那里我可以深入了解我的应用的性能，但这只是一个模拟——我的应用的用户可能出于各种原因而获得完全不同的体验。

👓 Vercel有一个真实的体验分数，取自真实用户的设备。这些分析可以更深入地了解实际发生的事情，这些都是可操作的业务见解，同时不会超越隐私。

Vercel 用例

Vercel是一个多功能平台，可用于各种用例。以下是Vercel的一些最常见的用例：

• Web 应用程序: 如果您希望构建和启动快速响应的Web应用程序，Vercel是必经之路！它针对性能进行了优化，将帮助您提供一流的用户体验。
• 静态网站: Vercel也非常适合托管和部署静态网站。无论您的用户身在何处，它们都能快速加载并无缝工作。
• 无服务器函数: 想要为应用程序构建后端逻辑，而无需使用专用服务器？Vercel为您提供了对无服务器功能的支持。
• 渐进式 Web 应用程序: Vercel 还可以轻松构建和部署跨多个设备和平台工作的 PWA。
• 电子商务网站: 如果您正在构建一个可组合的商业店面，Vercel 是一个绝佳的选择。它针对这些网站进行了优化，并支持流行的电子商务框架，如 Shopify 和 Magento.
• 开发人员作品集: 最后，如果您是希望展示您的作品的开发人员，Vercel 是构建和部署您的作品集的绝佳选择。它们支持流行的前端框架，如 React 和 Next.js，因此您可以真正制作自己的框架。

结语

从传统的服务器架构切换到无服务器 Jamstack 方法，使前端开发人员社区的生产力得到了前所未有的提升。

Vercel 是一个简化、直观且经济高效的平台，可让您的 Web 应用程序走出大脑并进入世界。

没有进入壁垒，老实说，我觉得 2023 年不使用它的前端开发人员主要由那些不了解它的人组成。

未来已经到来。上船吧。