可视化编程组件化UI推荐

标签: | 发表时间:2018-01-17 11:28 | 作者:
出处:https://mp.weixin.qq.com

2017年 JavaScript 明星项目正如去年一样,是时候让我们来回顾 2017 年间 JavaScript 领域的变化与发展了。

我们通过对比各项目于过去 12 个月在 GitHub 上新增 Star 数量的方式,来评估其在 2017 年度的受关注程度,进而选出2017 年度 JavaScript 领域崛起的明星项目。

上图,我们可以看到,2017年最火爆的前端开源项目,我们在选择前端框架的时候做为一项重要参考指标。

前端框架:

  • Vue.js蝉联冠军

  • React,亚军,再次!

移动开发:

  • React: React Native

  • Vue:Weex 和 Quasar

  • Angular:Ionic 和 NativeScript

与 2016 年一样,React Native 两年蝉联头名,让我们把 JavaScript 编译成原生的 APP 应用,支持 iOS、安卓或 Windows 系统。
正如这个视频使用 React Native 来跨平台编译APP中的口号:“一次编写,到处运行”可谓名副其实

IDE和编辑器:

在这里我们讨论的是利用开源的 WEB 技术来构建的代码编辑器( Sublime 粉丝们对不住了!)。

2016 年由微软主导的 VS Code 与 GitHub 主导的 Atom 在本类别中齐头并进。
今年他们也依然处于领先地位,不过在互相较量中,VS Code 己领先它的对手一大截。
每个月 VS Code 都会发布新版本,带来更多实用 IDE 功能同时性能上却没有太大的损耗。

即使不安装任何插件,你也有一大堆开箱即用的功能:

  • Git 集成功能;

  • 自动补全: JavaScript 语法,当你想 require 或 import 一个模块时能对本地文件路径进行补全,NPM 包名字…等等;

  • React 语法集成;

此外,你可以在编辑器中添加 Prettier 插件,这样每次保存时它都会自动格式化文件,真是令人愉悦的编程体验。

通过这样一份报告和生态圈详细分析,相信对前端开发技术选型有个参考意义,同时技术发展趋势,不至于选择小众,坑太多小组织填补过来。

更多详情:https://risingstars.js.org/2017/zh/

哈哈,进入今天的正题,推荐一波完整完整UI组件库。

组件化UI

iViewui:

  • 一套基于 Vue.js 的高质量 UI 组件库

  • 访问:https://www.iviewui.com

  • GitHub:https://github.com/iview/iview

Element:

  • Element,一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库

  • 访问:http://element-cn.eleme.io/#/zh-CN

  • GitHub:https://github.com/ElemeFE/element

Ant Design:

  • 一个服务于企业级产品的设计体系。基于『确定』和『自然』的设计价值观,通过模块化的解决方案,让设计者专注于更好的用户体验。

  • 访问:https://ant.design/index-cn

  • GitHub:https://github.com/ant-design/ant-design/

  • 在线预览:https://preview.pro.ant.design

ngx-admin:

  • Admin dashboard template based on Angular 4+, Bootstrap 4 (previously known as ng2-admin)

  • 访问:http://akveo.com

  • GitHub:https://github.com/akveo/ngx-admin

  • 在线预览:http://akveo.com/ngx-admin/#/pages/dashboard

总结

Element、iViewui、Ant Design三者都是国内开发者开源,分别来自饿了么、talkingdata、阿里,选择的技术栈主要是react和vue。

功能最完整的是ngx-admin,目前支持三端融合UI组件,技术栈比较复杂,比如:angular、react native。

UI组件各有特色,都是为了解决中后台admin界面组件化问题,而移动端融合框架,比较突出的是淘宝开源的Weex,目前淘宝已商用、去年底上线的IT内容知识服务App[极客时间]就是用Weex开发,效果挺不错。

三端融合框架:

  • React: React Native

  • Vue:Weex 和 Quasar

  • Angular:Ionic 和 NativeScript

排名:1、React Native 2、Weex 3、Ionic 4、Ionic 5、NativeScript

React Native 两年蝉联头名,让我们把 JavaScript 编译成原生的 APP 应用,支持 iOS、安卓或 Windows 系统。

看来2018年,我得入坑React Native,前端起起落落,无穷变化,2018年学起来吧。

参考:

  • [1] https://risingstars.js.org/2017/zh/

文末,受一些朋友强烈要求,保留问题记录和技术资料,开通[知识星球],欢迎加入,2018年,一起学习,共同进步,我会积极回答提问。

我正在「技术人的日常」和朋友们讨论有趣的话题,你一起来吧?

欢迎关注微信公众号[whoami],阅读更多内容。

原创文章,转载请注明: 转载自Itweet的博客
本博客的文章集合:http://www.itweet.cn/blog/archive

相关 [可视化 编程 ui] 推荐:

可视化编程组件化UI推荐

- -
2017年 JavaScript 明星项目正如去年一样,是时候让我们来回顾 2017 年间 JavaScript 领域的变化与发展了. 我们通过对比各项目于过去 12 个月在 GitHub 上新增 Star 数量的方式,来评估其在 2017 年度的受关注程度,进而选出2017 年度 JavaScript 领域崛起的明星项目.

可视化编程

- - 酷 壳 - CoolShell.cn
本文来自《 Visual Programming Languages – Snapshots》,作者 Eric Hosick收集了一堆关于可视化编程的工具,好多我都听都没听说过,我一股脑的全转过来,给大家看看,算是开开眼界了. 本文也是参考了Wikipedia的  Visual Programming Language 词条.

[转] jQuery ui框架

- - CSDN博客Web前端推荐文章
   jQuery ui框架很多,除了官方提供的 jquery UI(如果你还不知道什么是 jQuery UI,请看 下载了jquery ui后如何使用),还有很多第三方提供的ui框架,因官方提供的jquery ui框架体积较大,所以很多人都不喜欢用,但不论是官方提供还是第三方提供,他们都是基于 jquery核心类库实现的ui框架.

UI框架选型

- - ITeye博客
  最近公司的一个新项目要进行UI框架的选型,我把选型的思路和过程跟大家分享一下.   在选型之前,我们先要定一下选型的标准,就像人生一样,想清楚“自己要的是什么”是最重要的.   选型的标准分为几部分:. 业务是根本,和大部分的技术一样,框架没有好坏之分,只有适合与不适合.         我们项目是一个通讯类的监控项目,用户群是移动、电信等运营商的运维人员,系统的特点是:.

Metro UI 平板概念图

- 冉波 - 爱范儿 · Beats of Bits
在 《从应用启动器的设计来谈谈 Metro UI 的不足》 中,我曾抱怨过 Metro UI ,主要是针对它的主屏幕,因为在手机那样的小屏幕上,主屏似乎更适合摆放图标,而不是动态格窗. 但是如果我们将 Metro UI 放到平板上,情况就会完全不同. iOS 在 iPhone 上表现虽然很好,但是将同样的 UI 放到 iPad 上,总感觉不够大气.

Patrick Baudisch: 德國 UI 之神

- tan - 所有文章 - UCD大社区
我曾經為文撰寫過 “日本 UI 之神 – Takeo Igarashi“, 出自於我個人對於 Takeo 的研究的敬佩以及喜愛. 如今,當我投入了 HCI (Human-Computer-Interaction) 研究之後,有一位超新星大師的研究讓我非常喜愛. 如同 Takeo 也是一個非常帥氣的研究員,然而不同於 Takeo 的圖學以及 GUI 雙跨 (近年來 Takeo 更加神猛了, 變成了圖學, GUI, HRI 三跨了),Patrick 的研究自始自終都在 HCI 領域.

开源Python UI框架:Kivy

- xin - 秀码趣 - ShowMuch.com
Kivy是一个可用以快速创建新颖用户界面应用的开源Python库,比如可以用它来创建多点触摸的应用程序,它具备跨平台特性,目前发行有Windows、MacOS、Linux以及Android版本. 作为一个开源框架,Kivy具备以下特性:A.百分百免费使用;B.基于 LGPL3协议 开源,对商业化应用友好;C.跨平台,支持Windows、MacOS、Linux以及Android;D.允许在不同的平台上运行同一套代码;E.稳定以及有完善的API文档;F.通过OpenGL ES 2.0对硬件进行加速;G.自然支持大部分的输入协议或者输入设备;H.基于Python的简单API……等等.

Metro UI 平板概念图

- 可乐加糖 - 互联网的那点事...
在 《从应用启动器的设计来谈谈 Metro UI 的不足》 中,我曾抱怨过 Metro UI ,主要是针对它的主屏幕,因为在手机那样的小屏幕上,主屏似乎更适合摆放图标,而不是动态格窗. 但是如果我们将 Metro UI 放到平板上,情况就会完全不同. iOS 在 iPhone 上表现虽然很好,但是将同样的 UI 放到 iPad 上,总感觉不够大气.

新工具介绍:AdPlus UI

- - CSDN博客推荐文章
通过一段时间,我开发了一款实用新工具,封装了微软的调试利器Adplus.exe让各位更易于使用它. 张佩(Moore.Zhang) . Adplus UI是对Adplus.exe的封装,后者是微软提供的调试工具,是个利器,但虽为利器却少有人用,原因在于它仅支持命令行的方式运作,而命令又稍嫌复杂. Adplus UI的功德就在于把不友好的命令行变成用户友好的界面形式,用户只需要鼠标点几下就可以完成设置,设置会被保存,以后直接使用即可.

从Web借鉴UI设计

- - 博客园_首页
  用户体验已经成为衡量应用软件质量的重要标准. 在过去我们可能会惊叹于某个Web应用的华丽界面,现在,随着HTML5的强势登场,各类表现层技术及开发框架的发布,Web与窗体应用的界限正在被逐渐模糊. 虽然技术已经焕然一新,但很多开发人员并不是专业的信息架构师,可能还在使用传统的、平凡的UI设计风格.