SelfHostSelfHost

ToolJet：让小白也能5分钟搭出专业后台的低代码神器

a year ago

什么是ToolJet？

简单来说，ToolJet 是一个开源低代码框架，用于构建和部署自定义内部工具。想象一下，你不用写代码，就像搭积木一样拖拖拽拽，就能做出一个功能完整的后台管理系统。

关键是它还支持连接各种数据库和API，比如：

  • 数据库：PostgreSQL、MongoDB、MySQL等
  • 云服务：AWS S3、Google Cloud等
  • 第三方工具：Google Sheets、Stripe、Slack等

https://appstore.lazycat.cloud/#/shop/detail/cloud.lazycat.app.tooljet

如何使用

应用安装后，打开首页，点击set up

image.png

注册一个用户

image.png

随便填一个公司名称

image.png

创建个工作区间

image.png

这一步引导付费，选No thanks

image.png

进入主页面

image.png

下面我分享一个具体的使用案例，教你怎么快速搭建一个订单管理后台。

连接数据源

点击左侧菜单的"Data Sources"

image.png 选择你的数据库类型（比如SQLServer）

image.png 填入连接信息：主机、端口、用户名、密码

image.png 点击"Test Connection"确认连接成功

创建应用

  1. 点击"Create an app"
  2. 给应用起个名字，比如"订单管理系统"
  3. 进入可视化编辑器

image.png

image.png

设计界面

添加表格组件： 从右侧组件库拖一个"Table"到画布上

image.png 在右侧属性面板配置表格列

image.png 设置数据源为刚才创建的数据库查询

image.png

添加搜索功能：

  1. 拖一个"Text Input"作为搜索框
  2. 拖一个"Button"作为搜索按钮
  3. 在按钮的事件中配置查询逻辑

image.png 添加操作按钮：

  1. 在表格中添加操作列
  2. 放入"编辑"、"删除"按钮
  3. 配置对应的弹窗和API调用

添加交互逻辑

这里用JavaScript来写一些简单的逻辑：

  • 点击搜索按钮时执行搜索查询
  • 点击编辑按钮时打开编辑弹窗
  • 保存时调用更新API

image.png

发布应用

点击右上角的"Release"按钮，你的应用就可以正式使用了！

image.png

官方版本是英文的，对国内用户不太友好。推荐使用汉化中文版，在GitHub上搜索"tooljet_cn"就能找到。

总结

ToolJet 特别适合需要快速搭建内部系统的场景。无需懂任何前端技术就能做出专业的管理后台，这对很多后端开发者或者非技术人员来说是福音。

如果你也有类似的需求，强烈建议试一试。

作者
天天