近些年低代码方向十分火爆,低代码工具百花齐放,经过多年的摸索和沉淀,前端低代码主流思路已经趋于稳定。本文将从低代码爆发的背景说起,为大家介绍目前低代码的发展情况以及前端低代码技术体系。(本文中的低代码泛指低代码和无代码)

背景和发展情况

近些年低代码发展的线索有两条,一个是企业信息化需求快速增长,OA、ERP、CRM等传统企业软件场景功能早已成熟,低代码可以把众多场景的经验给提供出来,通过配置和简单修改让大量普通企业用到流水线生产的软件,这让很多传统的企业软件公司进入到低代码领域。

同时,消费互联网见顶,互联网企业把注意力投向企业信息化赛道,BAT等大厂先后入局。互联网大厂在企业信息化赛道的布局有哪些呢?最重要的布局就是大家熟悉的——云服务,以AWS为代表,BAT都有自己的云。此外,阿里和腾讯还有杀手锏级别的超级应用——钉钉和企业微信,这是他们近几年在这个方向集中发力的重要原因。用户入口和云服务基础都有了,就差业务系统了,那用什么做业务系统呢?答案正是低代码。于是有了阿里的宜搭、腾讯的微搭和百度的爱速搭。

低代码发展的另一条线索是互联网公司内部研发提效的探索,这方面的代表有百度的Amis、蚂蚁的云凤蝶和淘系的飞冰Appworks等。与第一条线索不同,第二条线索是聚焦在前端的,因为大厂内部的研发方式是前后端分离。经过一段时间的探索,云凤蝶和淘系中后台无代码平台最终走向场景化和自动化,参考附录1和附录2。

互联网大厂站在两条线索的交点上,沉淀了丰富的低代码能力,以今年3月阿里发布低代码引擎为标志,前端低代码正式进入标准化时代。阿里低代码引擎3个月star数7000,社区参与非常活跃,对业界的巨大影响力正在逐渐显现。

低代码技术体系

协议是低代码的产物规范,相当于纯代码开发的代码。阿里低代码引擎的核心是正是协议,协议定义了物料和搭建、渲染之间的互动关系,架构了可视化搭建的生命周期,是第一个低代码体系标准。在此基础上,引擎的上层建筑——物料工具、可视化编辑器和渲染能力等,实现了引擎的主体能力,所做选型也是前端低代码趋于稳定后的主流思路。此外,在可视化编辑器层面还定义了面板插件和设置器生态。这样一个以协议为基础,引擎为骨架,插件生态做拓展的体系是经过沉淀的成熟结构。引擎的详细介绍可以参考附录3。

可视化编辑器是进行低代码开发的的核心工具,而低代码作为一种研发形式,是以纯代码研发方式为基础的,我们可以从现代前端研发的几个要素入手去解构低代码可视化编辑器。

1.视图层的基础——画布。画布的核心是拖拽,调整视图元素的位置关系,主要有容器布局和自由布局两种方式,目前容器布局方式采用较多。
2.组件化时代——属性设置器。现代前端是组件化的时代,使用组件就是设置属性,因此设置器是用户在低代码平台上操作的重点区域。
3.现代前端的核心——数据绑定和更新。我们平时已经习惯了在html标签里面放数据变量进行数据绑定,通过setState等方法进行数据更新,低代码平台一般是通过在组件的属性设置器中声明绑定变量进行数据绑定,通过自定义事件代码调用setState等方法进行更新。这个部分是低代码平台之间差异比较大的地方,特别是全局状态值的设置和事件代码的写法。
4.更多编程要素——事件声明,循环绑定,条件渲染,插槽等,都是必须具备的能力。

下面是用低代码平台开发 todo list 的一个演示。完整视频链接在这里

低代码方向上不只有前端低代码,还有服务端低代码,服务端低代码核心要素有数据模型定义和逻辑可视化,以及一些代表性工具,如流程引擎、系统互联工具和RPA等。目前前端同学主要关注前端低代码,但是打通任督二脉之后的全栈低代码会比单纯前端更高效。

低代码场景和展望

我们还是能听到对低代码的质疑声,但是在不知不觉间,它已经完成了第一波的攻城掠地。对于以下这些情况来说,低代码已经成熟。

1.模式化场景,可以基于模板配置完成。举例:上文提到的企业信息化方面的员工管理、资产管理和目标管理,以及项目管理、客户管理、售后管理、进销存管理,甚至是小程序商城、线上教育平台等。在我们熟悉的前端领域,有B端数据增删改查功能和C端模式化营销活动等。这也是目前低代码的重点应用领域。
2.产研团队有标准前端设计体系。前端设计体系包括design tokens和组件体系。举例:使用Antd或是Vant等通用设计体系的团队和有自研设计体系的团队。这类场景可以充分利用低代码平台的能力,在已有组件和标准的基础上进行属性设置和逻辑控制,有一定的学习成本,但是能够提效,与第一种场景结合使用效果更好。只要低代码平台把退出通道出码能力做好,可维护性方面协议兼容性等问题考虑好,就不需要有太多顾虑。
3.对设计体验要求不高的简单C端系统,比如小型公司的一些小程序应用完全可以用微搭来做。

低代码的另一个优势是云原生,研发流程简单,可以快速响应业务需求。也便于服务端和产品等角色在适当情况下独立完成研发。

在低代码的大背景下我们应该做些什么呢?那就是利用低代码能力打造新的研发设施,紧跟先进生产力。在我所在的后台前端团队,典型的功能正是增删改查类场景,占比大约在70%。我们利用阿里低代码引擎打造了通用的后台功能快速可视化搭建平台,并基于 AntDesign ProComponents 开发了先进的增删改查场景物料,用一个组件满足了后台系统中的大部分功能。目前已经完成了多个功能的上线,实现了开发效率的大幅提升。

低代码和纯代码开发,会在某些场景下解决相同的问题。依托完全不相同的生产工具,运用不同的生产力,产出同样的产品。比如我们有“纯手工艺”也有“自动化生产线”都可以制造产品。未来的软件研发,必定是低代码和纯代码相结合,在不同场景下选择合适的方式。

最后

最近找到一个VUE的文档,它将VUE的各个知识点进行了总结,整理成了《Vue 开发必须知道的36个技巧》。内容比较详实,对各个知识点的讲解也十分到位。



有需要的小伙伴,可以点击下方卡片领取,无偿分享

前端低代码标准化元年,那些你需要了解的相关推荐

  1. Web前端低代码介绍的ppt大纲

    在当今快节奏的数字化时代,许多企业都面临着数字化转型的压力.然而,数字化转型往往需要大量的时间和资源来完成复杂的开发过程,这对于许多企业而言可能是一个巨大的挑战.为了解决这个问题,低代码开发应运而生. ...

  2. amis 视频教程 入门+实战 百度出的前端低代码框架

    Amis 前端低代码框架 百度出品 基础简介(1)_哔哩哔哩_bilibili这是第1个视频建立了一个Amis交流QQ群 感兴趣的可以加下QQ群号:717791727Amis 官方文档https:// ...

  3. 开源推荐 | 携程 Foxpage 前端低代码框架

    作者简介 Jason Wang,携程研发经理,目前主要负责低代码类产品的设计和研发,关注低代码行业的发展及相关解决方案在企业内部的落地. 大厂技术  高级前端  Node进阶 点击上方 程序员成长指北 ...

  4. 开源 | 携程 Foxpage 前端低代码框架

    作者简介 Jason Wang,携程研发经理,目前主要负责低代码类产品的设计和研发,关注低代码行业的发展及相关解决方案在企业内部的落地. 一.背景 随着低代码开发方式被越来越多的人接受和认可,低代码得 ...

  5. Methodot低代码电影票房管理系统实战案例(二):前端低代码搭建系统后台

    本次系统后台实战将使用Methodot应用工厂中的前端低代码组件完成搭建,无需注册域名.购买云服务器.虚拟机等,可在Methodot云端一体化完成开发.交付.访问.运维,3s即可部署至线上 免运维,在 ...

  6. 前端低代码平台腾讯云微搭使用文档

    腾讯云微搭 调研报告 之前作者有写过一个同类低代码平台调研报告 H5-Dooring 点击查看,这次我们去尝试使用腾讯系低代码平台,文中也会增加两者之间的差异对比和使用体验上的区别. 1. 简介 1. ...

  7. 前端低代码工具amis使用文档

    amis使用文档 本文档旨在帮助开发人员快速入门amis低代码开发平台. 简介 amis 是一个百度出品的低代码前端框架,它使用 JSON 配置来生成页面,可以减少页面开发工作量,极大提升效率. 安装 ...

  8. 前端低代码-少写代码实现灵活需求

    低代码开发定义 低代码开发,是一种开发模式,通过图形化用户界面来配置和创建应用软件,而不是用传统模式那样主要依靠手写代码.对应的,提供给开发者的这类低代码开发功能实现的软件,称为低代码开发平台(LCD ...

  9. 前端低代码平台H5-Dooring使用文档

    H5-Dooring 调研报告 1. 产品简介 1.1 简介 H5-Dooring 是一款低代码(LowCode),高可扩展的 H5 可视化页面配置解决方案,致力于提供一套简单方便.专业可靠.无限可能 ...

最新文章

  1. OVS技术介绍(四十一)
  2. python 三维绘图库_Python第三方库matplotlib(2D绘图库)入门与进阶
  3. 解决CentOS遇到Qt编译(error: cannot find -lGL)
  4. poi判断合并行_POI实战2——实战代码
  5. Python加载失败
  6. 使用SQL查询所有数据库名和表名
  7. Spring学习-入门
  8. 浅谈企业生产现场消防安全管理策略分析
  9. python图片表格转excel表格_python提取图片内容并转换成对应表格的markdown代码
  10. CodeRunner激活
  11. Java对pdf文件进行压缩打包并执行下载
  12. 揭秘跨境电商亚马逊店铺最新骗局!!小白做亚马逊店铺如何防止上当受骗?
  13. 聚看点{青龙面板可跑项目之一}保姆教程
  14. 速卖通韩国下载量再次登顶,7500万投资换来回报
  15. SocialFi 何以成就 Web3 去中心化社交未来
  16. 福利分享:1024程序员节,给大家推荐一个极简win10
  17. VMware ESX 4.1版本,浏览器无法访问问题【已解决】
  18. 嵌入式STM32F767BGT6规格STM32F767BIT6引脚图 32Bit MCU+FPU
  19. 嵌入式 ADC使用手册完整版 (188977万字)(附源码详细篇)
  20. 到底什么是用户体验?

热门文章

  1. 太阳能充电调节代码_“中国Kcar” 无需充电的薄膜太阳能动力汽车
  2. 用Raspberry Pi运行你自己的无线电台
  3. Far_planner 代码系列(11)
  4. 我,从程序员蜕变为IT公司老板,妈妈的认知思维,改变了我的一生
  5. 安泰线束测试仪:如何对线束进行耐压测试
  6. 可控硅控制和采集电路
  7. Android开发自学笔记(基于Android Studio1.3.1)—1.环境搭建
  8. 缺货商品实时监控上货提醒
  9. 2023年春招必备Java八股文(通俗易懂)
  10. N76E003 WKT 10K IRC偏差