魯班H5，一款先後端均開源的H5快速製做工具（可視化搭建系統），能夠理解爲開源版本的易企秀、 人人秀或百度H5

📖中文在線文檔 | 📖English

1. GitHub 地址：https://github.com/ly525/luban-h5
2. Gitee 地址(國內鏡像)：https://gitee.com/ly525/luban-h5

目錄

• 魯班H5是什麼？
• Demo
• Features
• 快速開始
• 更多說明
  • 前端組件說明
  • 技術棧（當前）
• 👨🏻‍💻👩🏻‍💻交流羣

魯班H5是什麼？

魯班H5是基於Vue2.0開發的，經過拖拽的形式，生成頁面的工具，相似易企秀、百度 H5 等工具

Demo

在線訪問地址

更多做品演示圖片，點擊查看

<img src="https://s2.ax1x.com/2019/10/11/u7WzUx.gif" style="margin: 10px;" width="60%" />

快速開始

請參照 魯班H5-在線文檔 的 快速開始 章節

交流羣

釘釘羣	微信公衆號	微信
		請備註：魯班H5交流

更多細節請閱讀在線文檔

Features

1. 編輯器

   • [x] 參考線
   • [x] 吸附線、組件對齊
   • [x] 拖拽改變組件形狀
   • [x] 元素: 複製（畫布）
   • [x] 元素: 刪除（畫布）
   • [x] 元素: 編輯（畫布）
   • [x] 頁面：新增
   • [x] 頁面：複製
   • [x] 頁面：刪除
   • [x] 快速預覽
   • [x] 撤銷、重作

2. 組件系統

   • [x] 文字
   • [x] 普通按鈕
   • [x] 表單按鈕
   • [x] 表單輸入框
   • [x] 普通圖片
   • [x] 背景圖
   • [x] 視頻（Iframe形式）

3. 加強功能

   • [ ] 上傳 PSD，一鍵轉換爲 H5(已經調研，能夠實現)
   • [x] 圖片庫
   • [x] 第三方無版權圖片搜索
   • [ ] 自定義腳本(已經調研，能夠實現)

4. 後端 API

   • [x] 建立、保存、更新做品
   • [x] 表單數據收集
   • [x] 表單數據展現
   • [x] 在線預覽
   • [x] 二維碼預覽

更多說明

前端組件說明

1. lbp- 全稱爲 lu-ban-plugin-, 意思爲 魯班H5的插件，位置：front-end/h5/src/components/plugins

技術棧（當前）

1. 前端：Vue.js
2. 後端：Strapi
3. 存儲：Sqlite