GitHub和碼云上，七個H5頁面制作工具推薦
一、ymm-tech/gods-pen
star: 1.7k
watch: 270
fork: 557
碼良是一個在線生成H5頁面并提供頁面管理和頁面編輯的平臺，用于快速制作H5頁面。用戶無需掌握復雜的編程技術，通過簡單拖拽、少量配置即可制作精美的頁面，可用于營銷場景下的頁面制作。同時，也為開發者提供了完備的編程接入能力，通過腳本和組件的形式獲得強大的組件行為和交互控制能力。
支持功能
1、編輯器
- 面向不同角色切換工作臺，并可以自行拖拽。
- 組件，以及組合組件。
- 實時預覽的動畫編輯。
- 實時預覽，并可按幀拖動預覽的動畫編輯。
- 腳本功能，靈活的擴展編輯器面板的屬性（非常容易給組件額外添加自定義的屬性和方法，完全自己代碼控制）。
- 樣式編輯，基礎模式，代碼模式。方便開發和運營不同角色使用。
- 在線預覽。
- 二維碼預覽。
- 可導入psd。
- 支持pc端和移動端。
2、組件商城
- 25+組件,也歡迎開發者貢獻自己的組件，查看所有組件。
- 可上傳，下載自己或別人的組件。
- 可出售自己開發的組件。
- 可購買別人的組件。
3、后臺管理與數據
- 可按團隊管理頁面 類似gitlab管理項目。合理的權限管理。
- 表單數據收集，并有數據同居。
- 支持頁面的pv uv以及自定義埋點信息。
- 方便的資源和組件管理。
二、H5-Dooring
github: https://github.com/MrXujiang
star: 7.9k
fork: 1.5k
(H5編輯器)H5-Dooring是一款功能強大，專業可靠的H5可視化頁面配置解決方案，致力于提供一套簡單方便、專業可靠、無限可能的H5落地頁最佳實踐。技術棧以react為主， 后臺采用nodejs開發。
1、編輯器界面：
2、頁面版本管理：
3、后臺：
特點：
1、【編輯器】
- 參考線
- 基礎組件
- 可視化組件
- 媒體組件
- 商品組件
- 拖拽器
- 配置面板
- 表單設計器
- (多)頁面管理(復制,編輯, 刪除, 新建)
- 組件動畫
- 組件交互
- 數據源管理
- 快速預覽
- 真機預覽
- 撤銷、重做
- 微信分享
- 快捷鍵
- 模版庫
- 桌面端軟件Dooring-electron, 支持離線使用
2、【增強功能】
- 上傳 json，一鍵轉換為 H5
- 圖片庫
- 出碼能力(下載源碼, 下載dist包)
3、【后端 API】
- 創建、保存、更新作品
- 用戶管理, 權限管理
- 一鍵智能分析
- 數據看版
- 表單數據收集
- 表單數據展示
- 表單數據分析, 一鍵導出excel, 表單多條件搜索
- 在線預覽
- 二維碼預覽
- 模版管理
- 出碼接口
三、mantou / H5DS
star: 478
watch: 110
fork: 165
H5DS(HTML5 Design software) 這是一款基于WEB的 H5制作工具。讓不會寫代碼的人也能輕松快速上手制作H5頁面。
特點：
【高維護性】： 采用react+mobx模塊化開發，源碼結構清晰，注釋規范，高可維護，方便進行二次開發和迭代升級。
【高擴展性】： 編輯器內核獨立存在，官方提供了插件開發教程以及CLI工具，可獨立開發插件，動態加載插件。
【高性能】：采用mobx統一管理數據，底層proxy數據監聽，做了大量節流和防抖優化，插件按需加載，不占內存。
【多終端支持】：支持手機頁面、PC頁面獨立制作，設計界面可自由切換，采用縮放模式兼容各種屏幕分辨率，PC/Mobile一網打盡。
三、ly525 / luban-h5
star: 1.1k
watch: 187
fork: 403
A mobile page builder/editor, similar with amolink.zh:類似易企秀的H5制作、建站工具，開源可視化搭建系統。
特點：
1、【編輯器】
- 參考線/參考線
- 吸附線
- 通過拖放更改插件形狀
- 編輯元素（畫布）
- 復制元素（畫布）
- 刪除元素（畫布）
- 編輯頁面
- 復制頁面
- 刪除頁面
- 快速預覽
- 撤消、重做
- 插件系統
2、【發短信】
- “正常”按鈕
- “表單”按鈕
- 表單字段
- 圖片
- 背景圖片
- 視頻（內嵌框架格式）
3、【增強功能】
- 將 PSD 文件解析為 HTML 頁面
- 照片庫
- 第三方無版權圖片搜索
4、【后端接口】
- 創建工作
- 保存工作
- 更新工作
- 表單統計
- 在線預覽
- 二維碼預覽
四、猿計劃 / vite-vue3-lowcode
star: 563
watch: 59
fork: 260
vue3.x vite2.x vant element-plus H5移動端低代碼平臺lowcode可視化拖拽 可視化編輯器visual editor類似易企秀的H5制作、建站工具、可視化搭建工具。
功能清單：
- 動態添加頁面。
- 拖拽式生成組件。
- service worker + indexeddb 實現無服務端的前端交互。
- 數據源管理(支持導入 swagger JSON 生成數據模型及接口)。
- 提供預置函數。
- 更多組件的封裝。
五、huangwei9527/quark-h5
star: 345
watch: 48
fork: 134
基于vue2 + koa2的 H5制作工具。讓不會寫代碼的人也能輕松快速上手制作H5頁面。類似易企秀、百度H5等H5制作、建站工具。
技術棧
1、前端：
- vue: 模塊化開發少不了angular，react，vue三選一，這里選擇了vue。
- vuex: 狀態管理。
- sass: css預編譯器。
- element-ui：不造輪子，有現成的優秀的vue組件庫當然要用起來。沒有的自己再封裝一些就可以了。
- loadsh：工具類。
2、服務端：
- koa：后端語言采用nodejs，koa文檔和學習資料也比較多，express原班人馬打造，這個正合適。
- mongodb：一個基于分布式文件存儲的數據庫，比較靈活。
編輯器整體設計
- 一個組件選擇區，提供使用者選擇需要的組件。
- 一個編輯預覽畫板，提供使用者拖拽排序頁面預覽的功能。
- 一個組件屬性編輯，提供給使用者編輯組件內部props、公共樣式和動畫的功能。
六、眾邦科技/CRMEB-H5
star: 316
watch: 44
fork: 278
CRMEBv3.0版微信公眾號和H5前端頁面，采用VUE-CLI框架。
特點：
【獨立部署】：源碼交付獨立部署，數據私有安全可靠。
【二開方便】：代碼開源規范，注釋清晰，二次開發更友好。
【高性可靠】：使用高性能框架開發，系統穩定、支持高并發。
【文檔齊全】：提供完善的安裝、使用文檔、接口文檔、開發文檔。
七、jaycie/makeH5Tools
star: 61
watch: 6
fork: 41
freeH5,open source html5,open source h5,免費html5制作工具,freeH5 APP,h5營銷,h5頁面制作,H5在線制作工具。
運行環境
- 后端 nodejs+mysql
- 前端 seajs
以上便是本次分享的全部內容，希望對你有所幫助^_^。
