前端资源整理
一、优秀的Vue库
1、状态管理:
pinia:Github:github.com/vuejs/pinia
Pinia 是最新一代的 Vue 轻量级状态管理库。它适用于 Vue 2.x 和 Vue 3.x。它是 Vue 官方成员在2019年11月重新设计的一个状态存储库,它允许你跨组件/页面共享状态,并且是响应式的,类似于 Vuex。
Vuex:Github:github.com/vuejs/vuex
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。
vuex-persist:Github:github.com/championswi…
vuex-persistedstate 是一个支持 Typescript 的Vuex插件,使你能够将应用程序的状态保存到持久存储中,例如 Cookies 或 localStorage。
2、表单
VeeValidata:Github:github.com/logaretm/ve…
vee-validate 是Vue.js的表单验证库,它允许验证输入并以熟悉的声明式样式或使用组合函数构建更好的表单 UI。
j vue-form-making:Github:github.com/GavinZhuLei…
vue-form-making 是一个基于 vue 和 element-ui 实现的可视化表单设计器,使用了最新的前端技术栈,内置了 i18n 国际化解决方案,可以让表单开发简单而高效。
FormKit:Github:github.com/formkit/for…
3、文档
VitePress:Github:github.com/vuejs/vitep…
VitePress 是 VuePress 的继承者,建立在vite 之上。目前,正处于alpha阶段。它已经适合开箱即用的文档使用,但配置和主题 API 可能仍会在次要版本之间发生变化。
VuePress:Github:github.com/vuepress/vu…
VuePress 是一个基于 Vue 的轻量级静态网站生成器,以及为编写技术文档而优化的默认主题。 它是为了满足 Vue 自己的子项目文档的需求而创建的。
Gridsome:Github:github.com/gridsome/gr…
Gridsome 是一个基于 Vue.js 构建的 Jamstack 框架,它让开发人员可以轻松地构建静态生成的网站和应用程序,这些网站和应用程序天生速度快。
4、测试
Vitest:Github:github.com/vitest-dev/…
Vitest 是一个由 Vite 提供支持的极速单元测试框架。其和 Vite 的配置、转换器、解析器和插件保持一致,具有开箱即用的 TypeScript / JSX 支持。
Jest:Github:github.com/facebook/je…
Jest 是一个全面的 JavaScript 测试解决方案,专注于简洁明快。适用于大多数 JavaScript 项目。
Mocha:Github:github.com/mochajs/moc…
mocha是一个功能丰富的javascript测试框架,运行在node.js和浏览器中,使异步测试变得简单有趣。Mocha测试连续运行,允许灵活和准确的报告,同时将未捕获的异常映射到正确的测试用例。
5、可视化
Vue ChartJS:Github:github.com/apertureles…
vue-chartjs 是一个 Vue 对于 Chart.js 的封装,让用户可以在Vue中轻松使用Chart.js,很简单的创建可复用的图表组件,非常适合需要简单的图表并尽可能快地运行的人。 vue-chartjs抽象了基本逻辑,同时也暴露了Chart.js对象,让用户获得最大的灵活性。它支持 Vue 3 和 Vue 2。
Apache ECharts:GitHub:github.com/apache/echa…
Apache ECharts 是一款基于Javascript的数据可视化图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表。它是用纯 JavaScript 编写的,基于zrender,是一个全新的轻量级画布库。
Vue-ECharts:Github:github.com/ecomfe/vue-…
Vue-ECharts 是 Apache ECharts 的 Vue.js 组件。使用 Apache ECharts 5,同时支持 Vue.js 2/3。
Trois:Github:github.com/troisjs/tro…
Trois 是一个基于 Three.JS 的 Vue 3 可视化库,它是一个流行的 WebGL 库。 Three.JS 对桌面和移动设备都有很好的支持。 该库允许我们使用 VueJS 组件轻松为网站创建 3D 效果。
6、组件
Vue Grid Layout:Github:github.com/jbaysolutio…
vue-grid-layout 是一个网格布局系统,类似于 Gridster,用于 Vue.js。
Vue Draggable:Github:github.com/SortableJS/…
Vue Draggable 是一个基于 Sortable.js 的 Vue 拖拽组件。
Vue Tour:Github:github.com/pulsardev/v…
Vue Tour 是一个轻量级、简单且可定制的导览插件,可与 Vue.js 一起使用。它提供了一种快速简便的方法来指导用户完成你的应用程序。
Swiper.js:Github:github.com/nolimits4we…
Swiper 是一款免费以及轻量级的移动设备触控滑块的框架,使用硬件加速过渡。主要使用与移动端的网站、网页应用程序,以及原生的应用程序。
vue-easytable:Github:github.com/Happy-Codin…
该库提供了一个功能齐全且高度可定制的表格组件/数据网格。它支持许多功能,如虚拟滚动、列固定、标题固定、标题分组、过滤器、排序、单元格省略号、行扩展、行复选框等。
7、UI组件
Element Plus:GitHub:github.com/ElemeFE/ele…
Element Plus,由饿了么大前端团队开源出品的一套为开发者、设计师和产品经理准备的基于 Vue 3.0 的组件库,Element Plus 是基于 Vue3 面向设计师和开发者的组件库,提供了配套设计资源,帮助你的网站快速成型。
Vuetify:GitHub:github.com/vuetifyjs/v…
Vuetify 是一个基于 Vue.js 精心打造 UI 组件库,整套 UI 设计为 Material 风格。能够让没有任何设计技能的开发者创造出时尚的 Material 风格界面。
Vant:Github:github.com/youzan/vant
Vant 是一套轻量、可靠的移动端组件库。通过 Vant,可以快速搭建出风格统一的页面,提升开发效率,支持 Vue 3。
Naive UI:Github:github.com/TuSimple/na…
Naive UI 是一款基于当前比较新的 Vue 3.0/TypeScript 技栈开发的前端 UI 组件库。
8、动画
Animate.css:GitHub:github.com/animate-css…
animate.css 是一个使用CSS3的animation制作的动画效果的CSS集合,里面预设了很多种常用的动画,且使用非常简单。
Greensock:Github:github.com/greensock/G…
GreenSock是一个JavaScript动画库,可轻松对HTML元素进行动画处理。 用于创建高性能,零依赖性,跨浏览器动画,声称在超过 400 万个网站中使用。
Popmotion:Github:github.com/Popmotion/p…
Popmotion 是一个只有12KB的 JavaScript 运动引擎,可以用来实现动画,物理效果和输入跟踪。原生的DOM支持:CSS,SVG,SVG路径和DOM属性的支持,开箱即用。
Vue Kinesis:Github:github.com/Aminerman/v…
Vue Kinesis 支持使用 Vue.js 轻松创建复杂的交互式动画,其支持 Vue 3。
9、图标
IconPark:Github:github.com/bytedance/i…
IconPark 提供超过 2400 个高质量图标,还提供了每个图标的含义和来源的描述,便于开发者使用。除此之外,该网站还可以自定义图标,这是与其他图标网站与众不同的地方。该图标库是字节跳动旗下的技术驱动图标样式的开源图标库。
Font Awesome:Github:github.com/FortAwesome…
Font Awesome 提供了可缩放的矢量图标,可以使用CSS所提供的所有特性对它们进行更改,包括:大小、颜色、阴影或者其它任何支持的效果。
Ionicons:Github:github.com/ionic-team/…
Ionicons 是一个完全开源的图标集,是知名混合开发框架 Ionic Framework 内置的图标库,包含 1300 个设计优雅、风格统一的高质量图标,能满足大多数的业务场景。
10、富文本编辑器
Tiptap:GitHub:github.com/ueberdosis/…
Tiptap 是一个基于 Vue 的无渲染的富文本编辑器,它基于 Prosemirror,完全可扩展且无渲染。可以轻松地将自定义节点添加为Vue组件。使用无渲染组件(函数式组件),几乎完全控制标记和样式。菜单的外观或在DOM中的显示位置。这完全取决于使用者。
Quill.js:GitHub:github.com/quilljs/qui…
Quill.js 是一个具有跨平台和跨浏览器支持的富文本编辑器。凭借其可扩展架构和富有表现力的 API,可以完全自定义它以满足个性化的需求。
TinyMCE:GitHub:github.com/tinymce/tin…
TinyMCE 是一个热门的富文本编辑器。它的目标是帮助其他开发人员构建精美的 Web 内容解决方案。它易于集成,可以部署在基于云的、自托管或混合环境中。该设置使得合并诸如 Angular、React 和 Vue 等框架成为可能。它还可以使用 50 多个插件进行扩展,每个插件都有 100 多个自定义选项。
CKEditor 5:GitHub:github.com/ckeditor/ck…
CKEditor 是一个强大的富文本编辑器框架,具有模块化架构、现代集成和协作编辑等功能。它可以通过基于插件的架构进行扩展,从而可以将必要的内容处理功能引入。它是在 ES6 中从头开始编写的,并且具有出色的 webpack支持。可以使用与Angular、React和Vue.js的原生集成。
11、服务端渲染
SSR:Github:github.com/zhangyuang/…
ssr 框架是为前端框架在服务端渲染的场景下所打造的开箱即用的服务端渲染框架。面向 Serverless,同时支持 React,Vue2,Vue3。
Vue-meta:Github:vue-meta.nuxtjs.org/
Vue-meta 是 Vue.js 的一个插件,它可以帮助你使用 SSR 支持管理 Vue.js 组件中的 HTML 元数据。Vue-meta 使用 Vue 的内置响应性使管理应用程序的元数据变得简单。
Nuxt.js:Github:github.com/nuxt/nuxt.j…
Nuxt.js 是一个基于 Vue.js 的通用应用框架。通过对客户端/服务端基础架构的抽象组织,Nuxt.js 主要关注的是应用的 UI 渲染。它预设了利用 Vue.js 开发服务端渲染的应用所需要的各种配置。
12、数据获取
Axios:Github:github.com/axios/axios
Axios 是一个基于promise 的网络请求库,作用于node.js和浏览器中。
vue-axios:Github:github.com/imcvampire/…
vue-axios 是一个将 axios 集成到 Vuejs 的小型库。
13、构建工具
Vite:Github:github.com/vitejs/vite
Vite 是下一代前端开发与构建工具。 Vite 意在提供开箱即用的配置,同时它的插件 API 和 JavaScript API 带来了高度的可扩展性,并有完整的类型支持。
Webpack:Github:github.com/webpack/web…
webpack 是一个用于现代JavaScript应用程序的静态模块打包工具。当 webpack 处理应用程序时,它会在内部构建一个依赖图(dependency graph),此依赖图对应映射到项目所需的每个模块,并生成一个或多个 bundle。
二、低代码平台
Appsmith:Github:github.com/appsmithorg…
Appsmith 是一款开源低代码框架,主要用于构建管理面板、内部工具和仪表板等,允许拖放 UI 组件来构建页面,通过连接到任何 API、数据库或 GraphQL 源,并使用 JavaScript 语言编写逻辑,可以在短时间内创建内部应用程序。
Amis:github.com/baidu/amis
Amis 是百度开源的一块前端低代码框架,通过 JSON 配置就能生成各种后台页面,极大减少开发成本,甚至可以不需要了解前端。
LowCodeEngine:Github:github.com/alibaba/low…
LowCodeEngine 低代码引擎是一款为低代码平台开发者提供的,具备强大扩展能力的低代码研发框架。由阿里巴巴前端委员会、钉钉宜搭联合出品。使用者只需要基于低代码引擎便可以快速定制符合自己业务需求的低代码平台。
form-generator:Github:github.com/JakHuang/fo…
Element UI表单设计及代码生成器,可将生成的代码直接运行在基于Element的vue项目中;也可导出JSON表单,使用配套的解析器将JSON解析成真实的表单。
H5-Dooring/pc-Dooring:Github(H5):github.com/MrXujiang/h…
Github(PC):github.com/MrXujiang/p…
H5-Dooring是一款功能强大、专业可靠的H5可视化页面配置解决方案,致力于提供一套简单方便、专业可靠、无限可能的H5落地页最佳实践。技术栈以 React 和 TypeScript 为主,后台采用nodejs开发。除了 H5 版,还提供了 PC 版。
YAO:Github:github.com/YaoApp/yao
Yao 是一款支持快速创建 Web 服务和管理后台的开源低代码应用引擎。只需使用 JSON 即可创建数据库模型、编写 API 接口、描述管理后台界面的低代码引擎,使用 Yao 构建的应用可运行在云端或物联网设备上。
Mometa:Github:github.com/imcuttle/mo…
mometa 不是传统主流的低代码平台,而是面向研发的、代码可视设计编辑平台;它更像是 dreamweaver、gui 可视编辑之于程序员。它的定位更多是基于程序员本地开发的模式,新增了可视化编码的能力。
NocoBase:Github:github.com/nocobase/no…
NocoBase 是一个极易扩展的开源无代码开发平台。 无需编程,使用 NocoBase 搭建自己的协作平台、管理系统,只需要几分钟时间。如果你有以下需求,NocoBase 就是为你设计的:
- 开发组织内部管理系统
- 通过无代码开发,满足大部分业务需求
- 无代码开发在操作上足够简单,满足非开发人员;在功能上足够灵活,接近原生开发
- 可以非常方便的进行扩展开发
- 私有部署,掌控全部代码和数据
Sparrow:Github:github.com/sparrow-js/…
sparrow 是一个场景化低代码(LowCode)搭建工作台,它的核心目标仅有一条“提升研发效率”,目前提供基于Vue、Element-UI 组件库中后台项目的实践,实时输出源代码。
vite-vue3-lowcode:Github:github.com/buqiyuan/vi…
vite-vue3-lowcode 是一个基于 Vite2.x + Vue3.x + TypeScript 的 H5 低代码平台。
华炎魔方:Github:github.com/steedos/ste…
华炎魔方是 Salesforce 低代码平台的开源替代方案,使用可视化工具进行模型设计, 页面设计, 流程设计, 报表设计 , 只需点击鼠标,就能快速创建应用程序,实现敏捷开发的新高度。
Awesome Lowcode:Github:github.com/taowen/awes…
Awesome Lowcode 是国内低代码平台从业者交流项目,包含了国内外的一些低代码平台。
本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!
