评论

我的微搭之路-从0到1弄个简易小项目

官方推出了低码平台(微搭WeDa),这篇文章是我个人的一次简易项目搭建尝试,用于熟悉低码平台操作。


前言:什么微搭?

微搭(WeDa),全称是腾讯云微搭低代码开发平台。

微搭将繁琐的底层架构和基础设施抽象化为图形界面,通过行业化模板、拖放式组件和可视化配置快速构建多端应用(小程序、H5应用、Web 应用等),免去了代码编写工作。

可以实现简易项目全程不写代码,拖拽完成。

参见:产品概述 https://cloud.tencent.com/document/product/1301/48874



开整:目标是做一个简易的用户反馈项目


第一步 创建应用


1,注册腾讯云账号

https://cloud.tencent.com/register

2,完成实名认证

https://console.cloud.tencent.com/developer

3,登录微搭控制台

https://console.cloud.tencent.com/lowcode

4,创建应用

位置:应用管理-》创建空白应用

*第一个应用会让你选择应用环境(选择默认或新建),后续会直接使用默认环境。

如图:

这里我们要创建一个简易用户反馈项目,

需要设置应用标识、应用名称、应用描述,然后点击确认按钮。

这样空白项目就创建完毕了。

如图:

接下来,我们先去设置一个用于存储信息的数据源。


第二步 设置数据源

位置:数据源管理-》新建数据源-》自建数据源

新建数据源有2种类型,自建是自己设置数据源结构,外部数据源是通过接口等方式拉取。

这里我们使用自建数据源


1,创建自建数据源

如图:

然后设置数据源名称、数据源标识和描述,点击确定按钮。

这样就新建了一个数据源。

如图:


2,编辑数据源字段

默认数据源中有数据标识、创建时间、更新时间这3个字段,我们点右上角的“编辑”,再添加几个字段。


1)如图:添加用户账号字段

设置字段名称、字段标识,选择数据类型,设置最小最大长度,设置必填,然后点击确定添加。


2)我们还可以设置枚举类型的字段

比如增加一个“涉及APP”的枚举字段。

如图:

可以选择是枚举,然后添加枚举项。

最后再加两个字段:问题描述、登录设备。

如图:

点击确定,数据源就创建完毕了。

接下来,可以去拖拽控件创建页面了。


第三步 拖拽控件


1,打开应用页面编辑页

位置:应用管理-》点击应用-》打开应用详情-》进入应用页面编辑

如图:应用详情页,可以看到应用的基本配置信息,包括小程序、云开发等。

如图:应用页面编辑页

工作台主要分为四个功能区:顶部导航条、页面和组件区、编辑区、属性配置区

参见官方图示:


2,拖拽控件


1)表单容器

将左侧组件区域的“表单容器”拖到编辑区

如图:


2)表单输入框

将左侧组件区域的“表单输入”拖到编辑区的表单容器内。

并在右侧组件编辑区域,设置表单字段的名称、标题。

如图:


3)表单选择框

将左侧组件区域的“表单选择”拖到编辑区的表单容器内。

并在右侧组件编辑区域,设置表单字段的名称、标题。

直接添加单列的列表内容:学生端、教师端、管理后台

如图:


4)按钮

将左侧按钮拖到编辑区的表单容器内。

在右侧设置按钮标题,并选择设置为用于form组件的“提交”。

如果拖到了其他控件内,可以在大纲树选中按钮组件,右键调整层级和顺序。

如图:


5)设置页面状态变量

位置:页面顶部-》变量管理-》首页index-》状态变量+

这步操作我是用来当做表单的数据源对应。

如图:

设置变量标识,变量类别选择是“数据源”。

数据源选我们新建的用户反馈表。

数据类型选“新记录——适用于新建类表单的场景”。

变量更新动作选“创建单条记录-内置(create)”

然后点击提交,创建一个question_list数据源。

如图:

关闭变量管理,选中表单容器。

右侧的表单类型,选择是“新建”。

数据源变量,选择我们刚建的question_list。

到此页面就开发完毕了。


第四步 预览发布

位置:页面顶部-》预览发布

如图:

点击页面顶部的预览发布,打开发布设置窗口。

如图:

部署模式选择是预览时,数据会写入到预览环境的CMS,

预览环境和正式环境分别有不同的CMS自动对应。

部署方式我们选云端,

部署平台是网页H5(因为这个项目我没绑定小程序和云开发),

然后点击预览,转到应用部署步骤。

如图:

等一会后,就可以看到页面有二维码和H5访问地址生成。


第五步 访问测试


1,扫码或复制H5链接,打开刚做的简易项目页面。

如图:

填写一些信息,然后点击提交。

如图:

页面显示“创建成功”


2,数据管理后台查看写入数据

位置:数据源管理-》数据管理后台

如图:

点击“数据管理后台”,会自动跳转打开CMS网站,并能看到系统自动为我们生成的正式环境项目和预览环境项目。

如图:

点击“简易用户反馈-preview”,我们打开看一下刚才页面数据是否录入成功。

如图:

可以看到录入成功了。


总结:虽然我描述的有点啰嗦,但从头到尾操作下来,确实做到了没写任何代码,全程鼠标点击、拖拽,就完成了一个简易项目。

当然低码并不是完全不写代码,一些项目可能还是要写一点代码的,这个后面找机会我再去试试。



感谢阅读!

最后一次编辑于  03-19  
点赞 2
收藏
评论

3 个评论

  • 少年
    少年
    04-11

    请问可以用这个编写上传小程序吗

    04-11
    赞同
    回复 1
  • 社区技术运营专员-娇华
    社区技术运营专员-娇华
    03-24

    棒棒哒(๑•̀ㅂ•́)و✧

    03-24
    赞同
    回复
  • Jasmin
    Jasmin
    03-23

    学习到了!

    03-23
    赞同
    回复 1
登录 后发表内容