推荐一款低代码开源项目,YYDS!!

2022-12-07 15:30:41 浏览数 (1)

大家好,我是爱撸代码的开源大叔!

什么是低代码?

在维基百科给出了这样的定义:

低代码开发平台(LCDP:Low-code development platform)A low-code development platform (LCDP) is software that provides an environment programmers use to create application software through graphical user interfaces and configuration instead of traditional computer programming.

从上面的定义可以看出,低代码平台是一种可视化的应用开发方法,用较少的代码、以较快的速度来交付应用程序,将程序员不想开发的代码做到自动化。

今天给大家推荐一个基于 vue 开发可视化商城搭建平台,支持生成H5、小程序多端商城项目 -- Mall-Cook。

功能简介

  • 拖拽式生成页面
  • 可生成 H5、小程序多端商城应用
  • 生成商城支持屏幕适配
  • 实时预览页面
  • 包含多领域模板,可以手机预览模板
  • 支持多种模块,魔方、倒计时、广告轮播、商品、新闻公告,搜锁功能等
  • 自定义底部菜单

平台截图

自定义页面

支持多种页面元素:魔方、倒计时、商品、图片、公告、搜索、广告轮播等等。

商品物料

支持多种商品展示形式,顶部菜单和左侧菜单。各种样式、文本根据需求进行调整。

底部菜单

可配置 1 至 4 个导航,菜单图标和跳转页面都可以修改。

配置商品

自定义商品分组,目前支持两级分组。

配置商品

可以配置商品标题、商品封面、价格、商品详情等属性。

看下最终效果

项目使用

在 clone 项目源码之后先安装对应依赖,在对应工程目录里执行下载依赖

项目结构

代码语言:javascript复制
mall-cook                             // 项目仓库  (必须下载依赖)
├─ packages
│  ├─ mall-cook-platform              // 搭建平台  (必须下载依赖)
│  ├─ mall-cook-template              // 渲染引擎  (必须下载依赖)
│  ├─ mall-cook-document              // 文档      (如需使用需下载依赖)
│  ├─ mall-cook-service               // 后端服务  (如需使用需下载依赖)
├─ scripts
└─ package.json

项目仓库安装依赖

代码语言:javascript复制
npm install

单独项目安装依赖

代码语言:javascript复制
cd 进对应项目目录

npm install

修改配置文件

packages/mall-cook-platform/src/config/global.js

代码语言:javascript复制
export default {
  baseApi: 'https://127.0.0.1:3000/node/',  // 后端接口地址
  viewUrl: 'http://127.0.0.1:9000/#/'// iframe嵌套的H5地址,本地开发可改为本地启动的H5地址
}

运行项目

代码语言:javascript复制
npm run dev

node服务,启动之前要修改 mogodb 地址。

代码语言:javascript复制
config = {
  appid: 'xxx', // 小程序appId
  secret: 'xxx', // 小程序secret
  serviceApi: 'http://127.0.0.1:3000', // 服务器地址
  mongodbUrl: 'mongodb://localhost:27017/mall-cook' // mongodb数据库地址 格式:mongodb://username:password@host:port/name
}

module.exports = config

总结

Mall-Cook 通过拖拽的方式,即可构建一个应用,能够实现业务应用的快速交付,能够降低业务应用的开发成本。

0 人点赞