搭建一个简洁的在线生成封面网站 使用vercel部署

简单介绍 🥰

Mini-Cover 演示网站
Mini-Cover:简洁的在线生成封面网站,专为博客、短视频、社交媒体等生成个性化封面。

1.事前准备

  1. 域名(非必须,你也可以使用免费域名,或使用vercel分配的域名也可以,但分配的这个域名被墙严重,建议设置自定义域名,然后使用我的 vercel CDN 服务进行加速)
  2. GitHub必须,你需要注册一个GitHub帐号)
  3. Vercel必须,你需要注册一个vercel帐号)

2.Vercle部署

  1. 因为这个项目提供了Vercle一键部署,点击自动部署并创建仓库,点击前往 Deploy

  2. Repository Name 设置你项目的名称,我设置为 cover 你可以自定义, Create private Git Repository勾选左下角就是设置为私库不勾选则反之。然后点击Create 创建。

    Vercle部署

  3. 等待部署一分钟左右就好了。
    Vercle部署2

  4. 部署完成
    Vercle部署3

3.自定义域名设置DNS加速

  1. 点击Add Domain设置自定义域名,我设置为 cover.001315.xyz 点击ADD添加(如没有域名的小伙伴忽略此步,点击右上角箭头进入到项目页面在点击Visit就可以看到你部署的Mini-Cover页面了,但是这个域名是vercel分配的域名被墙严重,等下教大家如何加速)
    Vercle部署4
    Vercle部署5

  2. 去你的域名解析商添加自定义域名解析,我是托管在cloudflare的,进入你的域名DNS记录点击添加记录类型CNAME名称 设置为你在vercel设置的域名前缀,我是 cover ,使用vercel CDN进行加速目标填写vercel.001315.xyz小黄云关闭。添加完成后,稍等片刻就可以在vercel的自定义域名页面看到两个对勾符号,这表示解析成功。
    Vercle部署6
    Vercle部署7

  3. 我们测试一下使用vercel分配给我的域名是 https://cover-seven.vercel.appitdog进行测速,基本是全红,没法看。然后我们在看使用vercel CDN进行加速的域名 https://cover.001315.xyz 效果还是不错的。
    测速1
    测速2

  4. 打开你部署的Mini-Cover项目网站,可以看到其中的标题内容是 项目主 的信息。
    Mini-Cover

  5. 你可以在你自己的GitHub项目库里面修改Mini-Cover这个库的 .env文件的配置项即可,你在GitHub修改vercel会同步更新的。
    GitHub项目修改内容
    .env1
    .env2

  6. 在这个项目的主页发现有 项目主 的一个Umami统计代码,我们可以替换成自己的,如果你没有自己的Umami可以去部署一个,可以参考我这个教程0成本搭建一个Umami网站统计服务 使用vercel部署,如果你不想自己部署!可以使用我部署的Umami 演示网站用户名与密码为:zhourf可以体验一下看看。
    统计代码

ps:嗯!这就完事了,喝酒去了 朋友等半天了

在线体验 点击前往

Github 点击前往

Vercel CDN 点击前往