给组件库加个鸡腿

2019-06-25
阅读 2 分钟
3.7k
为了方便大家使用,已经将这个鸡腿进行了封装(@doddle/doddle-bisheng-theme):使用详见Readme为了工作,也为了长点见识,费心费力捣腾了一个组件库antd-doddle,还是有成长的,总结都写了两篇,收获还是有的,如果你喜欢听故事:

基于EC2,配置一个全栈服务实例(nginx + tomcat + mysql)

2019-06-24
阅读 7 分钟
3.4k
最近世道动荡,在前往高级的路上走出了车到山前必有路,睁眼一看是绝路的感觉。所以就索性瞎折腾一下。领了一个服务器,开启了一个伪全栈的运维之路,各种服务线上部署。

从24M到1M: 一个react+antd后台系统构建打包历程

2019-03-07
阅读 4 分钟
4.7k
虽然在工作中用react+antd写页面写了一年,但从来没自己去认认真真配置一个webpack,去分析去优化自己打出的包。在工程化成熟或者大点的公司,都有自己的打包工具,所以自己工作中很少去琢磨这些。为了试一下写出的组件库(antd-doddle)性能,就尝试自己去写一个webpack构建,真的是吓了自己一跳,流水账(tu)开始。

从dist到es:发一个NPM库,我蜕了一层皮

2019-02-22
阅读 6 分钟
17k
这并不是自己第一次发npm包, 所以这里没有多少入门的知识。在此之前已经有一篇前端脚手架,听起来玄乎,实际呢?,但这一次的npm包和上一次的不是一个概念,前者只是一个脚本工具,而这个npm包是日常开发中方法和组件的集合, 是一个库。在读本文前,假定你已经对npm包有一定概念,熟悉Babel编译和webpack打包的常规用法...

webpack与babel的深奥,渣渣的我只能做个小笔记(持续更新)

2018-12-11
阅读 3 分钟
3.7k
最近公司封装的构建库用多了,感觉自己正在一步一步的变傻,所以趁还没下雪,手脚还没长冻疮,没事还是自己折腾一下吧。本想记笔记,但没想到记笔记没法传图片。所以如果你看到了,就忽略了吧。o(╥﹏╥)o o(╥﹏╥)o o(╥﹏╥)o

React组件常用设计模式之Render Props

2018-12-04
阅读 8 分钟
3.3k
自己在总结最近半年的React开发最佳实践时,提到了Render Props,想好好写写,但感觉篇幅又太长,所以就有了此文。愿你看完,能有所收获,如果有什么不足或错误之处还请指正。文中所提到的所有代码都可以在示例项目中找到,并npm i,npm start跑起来:Github:示例项目

前端脚手架,听起来玄乎,实际呢?

2018-11-06
阅读 6 分钟
25.4k
第一次听说脚手架, 是我刚接触Vue,跟着网上大佬的文章,用Vue-cli从0搭建了一个Vue项目,一步一步配置,然后npm i, npm run dev,打开链接,一个网页就这么写好了,当时对于npm,webpack这些前端工程化一无所知,嘴里不自觉的吐出了两个字:'NB'。一年以后,一位新猿在Segmentfault上发出了这样的提问:

怎样写一个具有异步交互的React组件的单元测试

2018-09-28
阅读 6 分钟
5.3k
关于前端React组件测试(jest,Enzyme),网上有大量的入门文章,可以看看,但如果你确实想了解前端自动化测试,个人更推荐看官方的文档和一些比较官方的测试案列,这里推荐两个:

GraphQL进阶篇: 挥手Redux不是梦

2018-08-05
阅读 8 分钟
4.2k
同学,GraphQL了解一下:基础篇 同学,GraphQL了解一下:实践篇首先,需要澄清,这有点标题党,像Redux, Mobx,Flux这种状态管理库,在日常的开发中的地位还是难以撼动的,但是我们可以试着去了解ApolloClent,它在做本地状态管理所应用的思想,ApolloClient官方有一片文章:The future of state management。如果对Gra...

同学,GraphQL了解一下:基础篇

2018-07-08
阅读 4 分钟
5.3k
GraphQL由Facebook发起,其手机客户端自2012年起,就全面采用了GraphQL查询语言, 2015年, Facebook全面开源了第一份GraphQL规范。到目前为止,在Twitter,Github,Pinterest,Shopify等大型网站也得到了广泛的实践。语言也从最初的js,扩展到java ,python,Go。且Apollo-client也逐渐做全了graphql生态。GraphQL是一种...

同学,GraphQL了解一下:实践篇

2018-07-08
阅读 7 分钟
6.9k
上一篇:GraphQL了解一下:基础篇下一篇:GraphQL进阶篇: 挥手Redux不是梦在基础篇主要讲了GraphQL出现的意义与一些基础语法。如果对GraphQL还不是很了解的同学可以点击上方链接了解一下,再来跟进这一篇的实践。本篇主要讲述实现一个GraphQL Server与在React应用中引入GraphQL,代码不难,推荐跟着手敲一遍。下面文章的...

antd组件使用进阶及踩过的坑

2018-06-10
阅读 8 分钟
55.5k
一晃眼,两个月过去了,自己从一家不大不小的屌丝公司跳到一家被具有纯正互联网血液的公司。从以前的围绕jQuery、Echarts为主技术栈开展工作,到现在以React、Antd为主技术栈开发业务;但不是所有的业务antd都能支持,所以有时得自己动手,在antd上做一层浅封装。文章中提到的示例都可以在codeBox找到:codeBox

css魔幻属性跟进篇

2018-03-27
阅读 8 分钟
2.9k
白话:即上一篇我脑中飘来飘去的css魔幻属性自己的文章推出之后,这是自己写的第四篇CSS相关的文章,文章绝大部分是自己工作总结得来,另一部分是平日sf回答的与面试中向面试官交流学到的,都是一些比较基础,刨根问底的知识分享。

数据可视化,个人经验总结(Echarts相关)

2018-03-06
阅读 6 分钟
14.5k
最近掘金对图片做了域名保护,造成图片无法加载,还是Segmentfault好,实力硬。个人能力分析数据可视化旨在借助于图形化手段,清晰有效地传达与沟通信息(来源于bd).在我们生活中最常见的,就有各种统计数据做成图表、股票k线图、能力雷达图这些(上面那张个人能力分析图,图片数据纯属虚构);而对于前端开发者来说,...

用React写一个数字华容道,你需要知道的秘密

2018-02-13
阅读 6 分钟
9.8k
年末了。哦,不,要过年了。以前只能一路站到公司的我,今早居然是坐着过来的。新的一年,总要学一个新东西来迎接新的未来吧,所以选择了一直未碰的那个据说是全宇宙最牛逼的前端框架-React,在上下班的地铁上看了两天官方教程,so what。光看不练假把式,于是就想着做个什么,偶然看到一个妹妹发了一条关于玩数字华容道...

canvas入门里,你没注意到的那些知识

2017-12-21
阅读 5 分钟
4.1k
与看各种文章相比,我更喜欢数学里的逻辑;与学习各种日新月异的框架相比,我更喜欢基础扎实带给人的那种踏实;与拼凑页面页面来回跳转相比,我更喜欢动画,图形在页面中表现的直观。 也许你和我一样,冲着对H5的好奇,冲着对图形的热爱,学了一下canvas,没有熟练,只是简单入了个门,或许你在入门的门槛上就绊倒了,同...

我脑中飘来飘去的css魔幻属性

2017-12-14
阅读 6 分钟
6.1k
最近看到一篇20 个CSS高级技巧汇总的汇总,感触很深,不过我想,与技巧相比,有些常见css布局难题,有时候更加让我们的日常开发变得踌躇沮丧吧。在写这一篇文章之前,自己还写过一篇:我所不注意的那些CSS冷知识,但却阻止了我做项目的速度,如果你看了,我相信你也会受益的。

JS中动态添加元素并绑定事件,造成程序重复执行

2017-11-24
阅读 5 分钟
4.7k
歇了两周没写点什么了,感觉最近有点知识慌,没啥新知识,分享一下前段时间遇到的bug难题,这个Bug是关于jquery 的on方法绑交互事件,类似于$('#point').on('click','.read-more',function () {})这样的代码造成程序重复执行,很多人在文章里写到了,也说了用off方法来解绑,但他们很少能点出问题的本质,他们忽略了问题...

用好JS 原生API系列之数组

2017-09-07
阅读 6 分钟
1.7k
最近工作做数据交互展示,常和数据打交道,而随之而来的就是遇见后端传来的各种各样的数组,我需要用各式各样的方法来变换这些数据,来最好的展示这些数据;很多东西久了没用就容易忘,自己也是边查边用,这篇文章算是自己这一周学习的知识的总结。当然你也可以打看MSDN查看更标准的叙述

从0开始撸一个支持单轴轮播的雷达图(Ehcarts的单轴显示问题)之头篇

2017-08-25
阅读 6 分钟
4.1k
最近做公司的数据展示项目,用的核心插件是Echarts,但在雷达图的展示案列上,需求上出现了需要单轴轮播标签和数据,在看完github上的issue后,这个Echarts3不支持,看了一下源码,似乎有点复杂,改了改,只实现了多个series的轮播,和需求还是有差距,周末反正无聊,何不自己动手撸一个。

webpack再入门,说一下那些不入流的知识点

2017-08-14
阅读 2 分钟
11.8k
大体上就分三层(当然随着你在生成项目配置的参数不同,项目结构可能会有不同),首先package.json里面的devDependencies属性里,包含了构建这个项目webpack所需要的各种依赖node包和执行项目的快捷指令配置,build文件夹是一些和webpack相关的配置,而config是一些和项目相关的配置,关于这两个文件下每个文件具体是干...

读懂那些火星(正则)表达式:捕获元与非捕获元

2017-08-05
阅读 3 分钟
7.1k
JS学了用了也快一两年了,对象啥的找到了也会用了,继承啥的也入门了,但看别人的框架代码,总是会随时卡壳,有一个重大的原因,就是那看不懂的一串串火星文字(正则表达式),学习吗,就是查缺补漏,不怕你不懂,就怕你觉得自己全懂了。说正事之前,先推荐一款软件:RegexBuddy,无论是做正则的测试还是过程的研究,都是...

cors跨域之简单请求与预检请求(发送请求头带令牌token)

2017-06-29
阅读 8 分钟
71.7k
引子 看前你需要知道: cors跨域的问题解决的根本在于后端,前端只能暂时阻止浏览器禁用跨域行为,或则自己开启代理调试; 前端自己暂时性解决的办法一览: disable-web-security: Mac中命令行加跨域标志打开Chrome,参考文章, 下面的示例是我在mac中使用的: {代码...} webpackServer代理或则开启nginx代理 ,参考文章 ...