42

可视化编程组件化UI推荐

 6 years ago
source link: http://mp.weixin.qq.com/s/H8QqmXltCrTuFo2OCJm_8w
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

可视化编程组件化UI推荐

Original 许江 whoami 2018-01-15 23:30 Posted on

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

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

Image

上图,我们可以看到,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年,一起学习,共同进步,我会积极回答提问。

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

Image

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

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


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK