程管理模块包含五个页面，分别是登录页面、课程列表页面、课程注册页面、课程信息修改页面和课程详情页面。这些页面使用了HTML、CSS和JavaScript技术，每个页面的布局和样式都是自定义的。

登录页面包含一个表单，用户可以输入用户名和密码进行登录。课程列表页面展示了所有课程的列表，包括课程名称、教师、人数等信息。课程注册页面可以让用户添加新的课程信息，包括课程名称、简介、教师、人数等。课程信息修改页面可以让用户修改已有的课程信息，而课程详情页面则展示了课程的详细信息，包括课程名称、简介、教师、人数、评论等信息。

每个页面都包含最少5条演示数据，以展示页面的基本功能和样式。这些数据可以是真实的课程信息，也可以是模拟的数据。

求说明

几年前，手上有一些关键数据躺在数据库里面，希望做个简单的增删改查系统。

考虑到需求很简单，就找到手下的一名程序员开发几个页面。结果，一言难尽……

再简单的需求，也需要沟通需求，再完成功能设计、交互设计、代码开发、部署使用等环节。一个环节出问题，结果就难达预期。

需求总结下来：

1、具备增、删、改、查、导入导出等功能，方便管理数据。

2、数据量很小（不超过1万条），不需要考虑并发、性能等问题。

3、需求多但容易变化，期望开发效率要高，最好一个小时内就能搭建好用起来。

4、界面美观度无要求，能够给别人看和用就行。

简而言之，我需要的是一个能快速定制开发「增删改查式数据管理系统」的工具。

如果有这样的工具，我自己就可以搞定，省去需求沟通、过程管理、开发修改等等一系列过程。

一个程序员去找一个合适的admin管理系统，搭建环境，按需改改，也能完成这个工作，但耗时起码1~2天。后面的维护工作量也不小。遇到问题，需要重新熟悉代码，修改调整再发布。

现在流行的一些低代码工具，就能比较好地解决这些麻烦。

功能尝试

各种低代码工具，反复强调功能丰富度、操作易用性、效率高价值等卖点。

大家对功能、场景、效果的描述都比较专业，很多时候看不懂。

很多低代码工具只有实际使用之后，才能理解他们描述的词汇，并判断是否适合自己的需求。

为了满足我的增删改查需要，我使用了这款工具。

除去之前的环境搭建的过程，开发一个功能的流程是5 步：

1、数据库建表

2、创建后端服务

3、创建前端页面

4、调试测试

5、发布到本地的服务器。

为了管理自己每天阅读的微信订阅号文章，我做了实际使用。

第1步，建立数据库表。这步操作和数据库管理工具建表是类似的，定好字段名、类型、描述等信息就可以完成创建。

第2、3步，创建后台服务和前台页面。有增删改查的功能模板，创建后，也可以修改。

需要熟悉一下工具，了解界面功能的具体含义。

如果有简单的业务系统开发经验，知道前后端分离，能够修改SQL语句、JS、HTML、CSS等，这些界面操作就还是非常容易理解的，。

第4步，调试测试。

后台服务，有接口测试工具，简化的postman。

前台页面，有预览功能，Chrome开发者界面。

第5步，发布。一切弄妥之后，发布软件提供的本地服务器。

用浏览器访问本地服务地址，就可以使用刚刚创建的功能了。

过程中可能遇到一些细节问题，有一定编程经验的话盲猜可以解决。

挺好用的。

效率评估

经过几次实践后，最近完成一个“订阅号管理”功能并发布，仅耗时34分钟。

具备功能：

查：支持查询订阅号名称等信息、支持分页查询展示。

增：支持添加“订阅号”信息。

改：支持修改“订阅号”信息。

删：支持删除“订阅号”信息。

导：支持用Excel表格批量导入“订阅号”信息。

效率评估：

在这34分钟内，就完成了数据库建表、后台服务接口创建、前台页面创建、测试、发布等工作。

要知道，熟悉前、后端业务系统开发的程序员，完成这样的功能也需要至少0.5~1天。

如果不熟悉业务系统开发，工作量至少还要增加到1~2天。

附录

文中使用的是Taskbuilder这款低代码工具。

具体功能说明、操作方法，可以自行搜索。官网文档比较详细，对着操作就可以搞定。

有网友把他推荐给我后，我试用了几次，觉得真香。能够比较好地解决我的需求。

撰写本文，以表感谢！

let username = 'Javan';
document.cookie = "name=" + username;

var cookieAll = document.cookie;
console.log(cookieAll);
// 输出后加工处理得到name值

function setCookie(name, value, days) {
 var exp = new Date();
 exp.setTime(exp.getTime() + days*24*60*60*1000);
 document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}

function getCookie(name) {
 var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
 if (arr = document.cookie.match(reg)) {
 return unescape(arr[2]);
 } else {
 return null;
 }
}

// 设置key为user, 值为Javanx
setCookie('user', 'Javanx', 1);
console.log(getCookie('user'));
// print Javanx

function delCookie(name) {
 var exp = new Date();
 exp.setTime(exp.getTime() - 1);
 var cval=getCookie(name);
 if (cval!=null) {
 document.cookie= name + "=" + cval + ";expires=" + exp.toGMTString();
 }
}