每天都會去 ProductHunt 看看，這是一個發(fā)掘有意思產(chǎn)品的國外平臺。

這個平臺現(xiàn)在已經(jīng)成為了用戶發(fā)現(xiàn)新產(chǎn)品、創(chuàng)業(yè)者們獲得靈感、投資人們尋找新機(jī)會，以及創(chuàng)始人對自己的產(chǎn)品進(jìn)行推廣的最佳去處。

最近一段時間，ProductHunt 平臺誕生了很多受歡迎的新產(chǎn)品，這些新產(chǎn)品大都有一個標(biāo)簽：low code。

低代碼是通過可視化方式創(chuàng)建應(yīng)用的一種概念，特點是代碼量比傳統(tǒng)開發(fā)少得多，甚至無代碼，能顯著提升開發(fā)效率。而如今，低代碼不僅僅局限于軟件應(yīng)用的研發(fā)，只要是通過可視化的交互來幫助使用者完成一個作品都屬于低代碼的范疇。

如果你還不明白低代碼是什么概念，可以看一下本文章提及的開源項目。這篇文章盤點了 10 款 GitHub 和碼云上最受歡迎的低代碼開源項目，記得收藏。

01. 快速搭建 H5 頁面

魯班 H5 生成器

魯班 H5 是基于 Vue2.0 開發(fā)的快速生成頁面的平臺，通過簡單的拖拽交互方式即可迅速的完成一個頁面的制作，類似 易企秀、Maka、百度 H5 等平臺。

左側(cè)是常用的組件，右側(cè)是組件的屬性調(diào)節(jié)界面，中間區(qū)域就是編輯和預(yù)覽區(qū)域。魯班 H5 包含了豐富的組件可以選擇，其中包括：

• 雷達(dá)圖、折線圖、柱狀圖、餅狀圖、漏斗圖
• 圖片、評分、表單、文字、地圖、視頻等

圖標(biāo)和地圖組件

折線圖組件

個人作品低代碼平臺

這個項目基于 Vue.js 技術(shù)棧，平臺主頁面分為四個部分，分別是工具欄、組件列表、畫布、屬性區(qū)域。將組件拖至畫布區(qū)域。

用戶可以將組件列表的組件拖到畫布，對畫布上的元素進(jìn)行編輯。這僅僅是一個 Demo，其余更豐富的組件可以二次開發(fā)。

構(gòu)建頁面可視化編輯器

還有一個頁面可視化的 Demo，基于 next.js 構(gòu)建頁面可視化編輯器。整個編輯器的研發(fā)邏輯為前端開發(fā)組件庫，編輯器讀取組件完成頁面搭建，將頁面數(shù)據(jù)發(fā)送至服務(wù)端保存。訪問頁面，從服務(wù)端拉取頁面數(shù)據(jù)，前端渲染頁面即可。

隨心秀 react 版 H5 微場景編輯器

編輯器功能：拖拽、縮放、旋轉(zhuǎn)、動畫、撤銷、重做、組合元素

組件：物料、文本、圖片、QQ語言通話、背景、地圖、音效、模板、視頻、藝術(shù)字

H5-factory

H5 專題頁面可視化編輯工具，拖拽編輯，靈活切換，一鍵生成 HTML 文件。關(guān)于這個開源項目的系統(tǒng)架構(gòu)設(shè)計和組件拆分原則可閱讀文章：

https://juejin.cn/post/6844903858401968136

H5 移動端低代碼平臺

vue3.x vite2.x vant element-plus H5 移動端低代碼平臺 lowcode 可視化拖拽 可視化編輯器 visual editor 類似易企秀的H5制作、建站工具、可視化搭建工具

02. 一個海報生成器

海報編輯器最左側(cè)是組件列表?？梢栽谧钭髠?cè)選擇組件，比如文本、二維碼、圖片等添加到最中間的畫布區(qū)域，通過右側(cè)的屬性調(diào)節(jié)面板調(diào)節(jié)添加組件的樣式。

快速：三步完成海報開發(fā)工作：啟動服務(wù) > 編輯海報 > 生成代碼

簡單：組件豐富、支持拖拽、復(fù)制、所見即所得、下載等功能。

動態(tài)：無需更改代碼，直接在編輯器修改海報即可獲得最新的海報。

上傳頭像

進(jìn)行預(yù)覽

獲取代碼：點擊 代碼，可以查看相關(guān)的接?調(diào)?代碼。

03. JEECG BOOT 低代碼開發(fā)平臺

JeecgBoot 是一款基于代碼生成器的低代碼平臺！前后端分離架構(gòu) SpringBoot2.x，SpringCloud，Ant Design&Vue，Mybatis-plus，Shiro，JWT，支持微服務(wù)。強(qiáng)大的代碼生成器讓前后端代碼一鍵生成，實現(xiàn)低代碼開發(fā)!

Online表單開發(fā)、Online報表、報表配置能力、在線圖表設(shè)計、大屏設(shè)計、移動配置能力、表單設(shè)計器、在線設(shè)計流程、流程自動化配置、插件能力（可插拔）等等！

04. amis 低代碼工具

作者認(rèn)為：對于大部分常用頁面，應(yīng)該使用最簡單的方法來實現(xiàn)，甚至不需要學(xué)習(xí)前端框架和工具。

amix 就是這么一款低代碼工具。它通過 JSON 配置就能生成各種后臺頁面，極大減少開發(fā)成本，甚至可以不需要了解前端。它的獨特好處是：

• 不需要懂前端也能能做出專業(yè)且復(fù)雜的后臺界面，這是所有其他前端 UI 庫都無法做到的；
• 不受前端技術(shù)更新的影響；
• 可以完全使用可視化頁面編輯器來制作頁面；

05. Seezoon Stack

Seezoon Stack 是一款基于當(dāng)前最前沿的前端和后臺實現(xiàn)的低代碼開發(fā)平臺。前端技術(shù)?；?Vue3 Vite Antdv，后端技術(shù)?；?Spring boot。

它以快速開發(fā)為目的，在開發(fā)速度和代碼結(jié)構(gòu)上做出一定取舍，無論如何，你將看到非常地道的 Java 常用開發(fā)框架使用。該項目采用主流開發(fā)框架，無論打包、編譯、部署都按著大公司的標(biāo)準(zhǔn)完成并不斷逐步完善。