从零开始一个完整的全栈项目(15)- 把前端React项目部署到云端(Vercel)

93 阅读1分钟

这篇文章好像超级短。不过还是记录下吧。

记录一下自己项目的前端React项目,部署在Vercel上的过程。
项目地址是:github.com/ColinWangDe…

Vercel的操作,挺傻瓜式的,很容易就搞定。

============
第一步:进入Vercel后台,和自己的github连接起来。

第二步:添加“new project”

image.png

第三步:选择你想要引入的前端项目,点击import

image.png

第四步:按照默认的选项,Depoly就好。

image.png

第五步:部署好了之后,可以看到如下界面。同时可以通过这个链接进行访问:
quickstore-frontend.vercel.app/login
后端和数据库还没部署好,所以testuser暂时没有功能。

image.png

界面暂时是这个样子:

image.png

OK,下一篇部署后端。

总的来说,项目的部署网站是这样的:

最快上云(推荐组合)

  • 前端 React:Vercel(开箱即用、最快上线、Git 推送即部署)
  • 后端 Spring Boot:Render(零运维、自动 HTTPS、支持长时间运行)
  • 数据库 Postgres:Neon(免费层、分离存储/计算、快照/分支方便演示)

接下来,一步一步来吧。

下一篇:将后端项目部署到Render上。