bubucuo- 全栈低代码项目

低代码平台这两年从招聘需求变成了不少团队的基础设施，但真正动手做过的人不多。这套资料围绕一个可运行的全栈低代码项目展开，从画布编辑器一路做到服务端，适合想搞清楚「拖拽生成页面」背后到底怎么实现的前端开发者。它不是教你用某个现成平台，而是带你把平台本身造一遍。

它解决的是什么问题

日常业务里反复出现中后台表单、活动页、配置面板，手写一遍费时且难维护。低代码的思路是把页面结构抽象成数据，用编辑器产出配置，再由生成器渲染成真实页面。这套资料覆盖的正是这条链路：编辑器端负责组件拖拽、画布操作、属性配置和状态保存；生成器负责把配置还原成可用的页面；服务端负责项目、页面数据的存取与接口。学完之后，你对「配置驱动 UI」的理解会从概念落到具体实现，而不是停留在调用别人的组件库。

编辑器部分涉及不少细节问题，比如参考线对齐、撤销与回退、画布信息的保存与查询、文本组件内容的编辑、边框与动画属性的调整。这些恰好是自研编辑器时最容易卡住的地方，也是判断一个人有没有真正做过编辑器项目的分水岭。

适合什么基础，先看哪几块

前置要求不算低：需要熟悉前端框架的基本用法、组件通信、状态管理，能看懂接口请求和数据结构设计。完全没写过项目的新手直接上手会比较吃力，建议先做过一到两个完整的前端项目再来。服务端用的是 NestJS，如果之前只接触过 Express 或 Koa，需要额外补一点装饰器和模块化的概念，但不必提前系统学完，跟着项目走也能理解。

建议的进入顺序是先看编辑器端的项目搭建和画布基础操作，把「组件怎么被拖进去、位置信息存在哪」这条主线跑通；再进入撤销回退、参考线、属性编辑这些交互细节；最后看生成器和服务端的对接。不要一上来就啃服务端，脱离前端的数据结构去看接口，很容易失去上下文。

学完能独立做什么，资料怎么配合练习

走完一遍之后，你应该能独立搭出一个具备基本能力的页面编辑器：支持组件拖拽与选中、画布缩放与对齐、操作撤销与重做、组件属性修改、画布数据持久化，并能把保存的配置渲染成实际页面。这套能力可以直接迁移到自研中后台搭建工具、活动页配置系统、报表看板编辑器等场景。

练习方式上，建议不要只看视频。每看完一个功能点，先自己实现一遍再对照资料里的做法，重点比对数据结构的组织方式——编辑器的难点往往不在交互，而在状态怎么存、怎么同步、怎么回滚。可以尝试给编辑器补一两个资料里没展开的组件，或者换一种存储方案重写保存逻辑，这比重复观看更能暴露理解上的空白。服务端部分建议动手跑通接口，理解配置数据从编辑器到数据库再回到渲染层的完整流转。