前言  说起Custom Element那必然会想起那个相似而又以失败告终的HTML Component.HTML Component是在IE5开始引入的新技术,用于对原生元素作功能"增强",虽然仅仅被IE所支持,虽然IE10也开始放弃它了,虽然掌握了也用不上,但还是不影响我们以研究的心态去了解它的:) 把玩HTML Component  HTML Component简称HTC,它由定义和应用两部分组成.定义部分写在.htc文件中(MIME为text/x-component),由HTC…

前言  通过<WebComponent魔法堂:深究Custom Element 之 面向痛点编程>,我们明白到其实Custom Element并不是什么新东西,我们甚至可以在IE5.5上定义自己的alert元素.但这种简单粗暴的自定义元素并不是我们需要的,我们需要的是具有以下特点的自定义元素: 自定义元素可通过原有的方式实例化(<custom-element></custom-element>,new CustomElement()和document.createEle…

前言  最近加入到新项目组负责前端技术预研和选型,一直偏向于以Polymer为代表的WebComponent技术线,于是查阅各类资料想说服老大向这方面靠,最后得到的结果是:"资料99%是英语无所谓,最重要是UI/UX上符合要求,技术的事你说了算.",于是我只好乖乖地去学UI/UX设计的事,木有设计师撑腰的前端是苦逼的:(嘈吐一地后,还是挤点时间总结一下WebComponent的内容吧,为以后作培训材料作点准备. 浮在水面上的痛 组件噪音太多了!  在使用Bootstrap的Modal组…

WebComponent 前言  最近加入到新项目组负责前端技术预研和选型,一直偏向于以Polymer为代表的WebComponent技术线,于是查阅各类资料想说服老大向这方面靠,最后得到的结果是:"资料99%是英语无所谓,最重要是UI/UX上符合要求,技术的事你说了算.",于是我只好乖乖地去学UI/UX设计的事,木有设计师撑腰的前端是苦逼的:(嘈吐一地后,还是挤点时间总结一下WebComponent的内容吧,为以后作培训材料作点准备. 浮在水面上的痛 组件噪音太多了!  在使用Boo…

组件库的现状 前端目前比较主流的框架有react,vuejs,angular等. 我们通常去搭建组件库的时候都是基于某一种框架去搭建,比如ant-design是基于react搭建的UI组件库,而elementUI则是基于vuejs搭建的组件库. 虽然目前社区有相关工具,提供框架之间的转化服务,比如讲vuejs组件转化为react组件.但是毕竟是不同的框架,有不同的标准.因此框架api发生变动,那么你就需要重写转化逻辑,显然是不灵活的,因此我们暂不讨论这种情况. 作为公司而言,就需要为不同的框架写…

原文: https://medium.com/@jorgecasar/how-to-use-web-components-with-angular-41412f0bced8 ------------------------------------------------------------- I already told you about Web Components and Frameworks and now we have to put it into practice so tha…

十年前,Martin Fowler撰写了 GUI Architectures 一文,至今被奉为经典.本文所谈的所谓架构二字,核心即是对于对于富客户端的 代码组织/职责划分 .纵览这十年内的架构模式变迁,大概可以分为MV*与Unidirectional两大类,而Clean Architecture则是以严格的层次划分独辟蹊径.从笔者的认知来看,从MVC到MVP的变迁完成了对于View与Model的解耦合,改进了职责分配与可测试性.而从MVP到MVVM,添加了View与ViewModel之间的数据绑…

学习是每一个人都要面对的铁一般的事实,不进则退.学习同样讲究途径和方法,面对知识这个巨人,我们永远不会有成年的那一刻,但我们可以让自己毕生尽可能地吸取更多有价值的信息,好让自己人生充满各种“意义”存在的可能性.我在“要点一”已经提到过,越接近本质,越能让自己的视野更加清晰,这就是所谓的高度.这个高度的重点在于“本质”,所以我们应该尽可能的去接近事物的本质. 你可以将它看做是对一个排序规则的描述者 因为我们可以使用它来对我们数组中的对象进行排序操作 假设现在有这样一个需求: 数组里面有十个Pers…

Angular的指令 也就是directive,其实就是一WebComponent,以前端的眼光来看,好象很复杂,但是以后端的眼光来看,还是非常简单的.其实就是一个中等水平的类. var myModule = angular.module(...); myModule.directive('namespaceDirectiveName', function factory(injectables) { var directiveDefinitionObject = { restrict: str…

Metronic 与 VS2013/2015 合作开发  去年购买了一个:METRONIC  (http://www.keenthemes.com/) ,最近下了最新的版本:V3.7 ,解压缩后,目录如下:(没有列出RTL 部分) - _documentation - Contains of admin and frontend themes general documentation files. - _resources - Contains of commercially licensed…