vercel

485 阅读1分钟

持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第21天,[点击查看活动详情](juejin.cn/post/709970… "juejin.cn/post/709970…

Vercel

Vercel 你可以理解为一个部署工具,支持部署静态网页和Node服务,部署后你还可以访问它自带生成的域名https。

image.png

不仅仅如此,除了他的亲儿子Nextjs之外,它还提供了很多模版支持,譬如:

  • Nuxt.js: Vue的SSR框架
  • Hexo: 快速生成博客网站
  • Remix: 一款边缘原生的全栈 JavaScript 框架
  • 模版多达30种..

image.png

Vercel的核心主要包括开发、预览、部署。通过授权Github给Vercel后,就可以选择我们要部署的项目Github仓库,项目就自动更新部署了。接下来教你一步到位!

1.选择模版

本次演示实践框架,我选用vercel的亲儿子Next.js。他提供了很多🌰案例,这里我选择一个 模版:with-vercel-fetch。来实现一个简单的SSR服务。

image.png

在Vercel创建一个项目,你会发现Vercel跟Github是可以联动的!支持帮你创建一个私有的Github仓库,本质是类似Github Page,但是Github Page的访问速度太慢。这点Vercel直接秒杀了。

image.png

在Vercel帮我们创建的仓库之后,对Demo仓库做一些调整 👇

image.png

然后将服务fetch的API接口改为Apifox前段时间上线的云端Mock的功能,是不是就不用自己再搭建一套后端服务