关于前端:Wealth-开源的账本响应式网站系统免费部署

演示网站： https://wealth.willin.wang

前置筹备

首先须要注册一个 Github 账号，Fork 这个开源我的项目： https://github.com/willin/wealth （欢送 Star）

而后应用 Github 账号别离注册 Vercel 和 Planetscale：

• Vercel： https://vercel.com/
• PlanetScale： https://planetscale.com/

Planetscale 创立数据库

应用 Navicat 之类的软件连贯数据库，并创立表，sql 语句位于文件： https://github.com/willin/wealth/blob/main/db/database.sql

// 留神该版本不肯定为最新，只是一个示例// 最新的表构造： https://github.com/willin/wealth/blob/main/db/database.sqlCREATE TABLE `invoices`  (  `id` int UNSIGNED NOT NULL AUTO_INCREMENT,  `type` varchar(16) NOT NULL DEFAULT '',  `date` date NOT NULL,  `category` varchar(32) NOT NULL DEFAULT '',  `amount` decimal(12, 2) NOT NULL DEFAULT 0,  `method` varchar(32) NOT NULL DEFAULT '',  `desc` varchar(64) NOT NULL DEFAULT '',  `note` varchar(255) NOT NULL DEFAULT '',  PRIMARY KEY (`id`),  INDEX(`type`),  INDEX(`date`),  INDEX(`category`),  INDEX(`amount`));

创立 Vercel 我的项目

导入我的项目

连贯本人的 Github 账号，而后 import 刚刚 fork 的我的项目。

在 Settings -> Domains 能够编辑你所用的域名（如果没有本人的域名 Vercel 也提供了收费的，如： https://wealth-demo.vercel.app）

创立 Github 利用

设置好域名之后，回到 Github 创立一个 OAuth 利用。拜访地址为： https://github.com/settings/developers

留神 Authorization callback URL 填入：

https://你的域名/api/auth/callback/github

创立胜利后，记好 Client ID 和 Secret 字段。

回到 Vercel 进行环境变量配置

而后在 Settings -> Enviroment Variables 中创立环境变量：

BASE_URL=https://wealth-demo.vercel.appDATABASE_URL=PlanetScale 连贯字符串GITHUB_ID=上一步的 IDGITHUB_SECRET=上一步的 SecretADMIN_ID= 你的 Github 用户名

保留，重新部署即可。后续批改我的项目的代码配置，会主动部署到 Vercel。

本文视频教程： https://www.bilibili.com/video/BV19X4y1y7eQ/