Beace Lee

Beace Blog

Written by Beace Lee who lives and works in China building useful things. You should follow him on Twitter

GMTC 全球大前端大会总结

24 六月, 2019

Electron 十问十答(2)

13 五月, 2019

如何关联后缀名打开相应应用程序?Electron-build 配置中 配置可以实现关联后缀名。也可以配置为数组,支持多个文件后缀名。如何自定义协议打开 electron在 main 进程中增加如下代码,即可通过 的方式打开。如何针对多页面,多个html…

如何通过 githooks 强制规范 git commit message

18 四月, 2019

git commit 不仅能体现你对工作(编码)内容的概括能力,而且能够在书写完代码后做一个完美的总结。我极力推崇详细的 git commit message 来描述编码内容。这里强调了“详细”二字。之所以做这个强调,是因为大部分人都不太想去写 git commit…

CORS-preflight fetch(request)

18 二月, 2019

跨域预检请求,术语为 CORS-preflight fetch 或 CORS-preflight requst。浏览器默认有不得跨域请求资源的限制,因此服务端往往在 response header 中加入相应的允许跨域请求的请求头,允许前端对 API…

【译文】鲜为人知的JavaScript特性

24 一月, 2019

翻译自:Little known features of JavaScript – Noteworthy - The Journal BlogJavaScript 经常被认为是一门最容易入门却最难精通的语言。我完全同意这样的说法。这是因为,JavaScript…

NodeJS ELK 日志系统搭建入门

18 一月, 2019

背景介绍通常情况下,开发过程中日志会直接在控制台打印方便查看,生产环境下应该保存为文件,以便以后查阅。越来越大的项目规模会导致日志数据累计巨大,想要快速从文件中找到几乎是不可能的。因此,搭建日志系统,通过UI…

有关Electron 在 Windows平台下的自动更新方案

10 一月, 2019

背景使用 electron-builder 打包 Electron 应用程序使用了 electron-simple-updater 协助自动更新问题electron-simple-updater 不支持 NSIS 安装包自动更新。Windows 下无法触发自动更新NSIS…

【译文】如何在 React 中渲染模态框

01 一月, 2019

翻译自: How to render modals in React由于 React 构造 DOM 的方式,模态框可能是一个比较棘手的问题。如果你熟悉 React 基础,你就知道整个 App 通常是一个叫做 的组件,这个组件被当做一个叫 的 装载到(append…

2019 前端学习计划清单

01 一月, 2019

放弃dockerkubernetesgitlab腾讯云/阿里云201…

【译文】理解 JavaScript 中的 for…of 循环

23 十二月, 2018

原文链接: Understanding the For…of Loop In JavaScript在 JavaScript…

圣诞节快到了,你还在网上买圣诞彩灯吗,骚年,WS2812了解一下

21 十二月, 2018

圣诞节快到了,来一起做一个炫酷的灯带装饰你的家。前言想必大家在初识嵌入式开发的时候,第一节课或者说第一个实验,往往都是点亮一个 LED,当初我也是。但是想想那个 LED,没有颜色,亮度不够,并且最多也只是闪烁的效果。如果我想要像下面这样如此炫酷呢。所需硬件设备Arduino…

如何将公司私有项目做得和开源项目一样优秀

16 十二月, 2018

ES6 在数组方面的扩充

13 十二月, 2018

数组可谓是在JavaScript中最常用的数据结构了,下面来盘点一下ES6在数组中新增的功能。Array.of背景在JavaScript中声名一个数组有多种方式,常见的有以下两种第一种往往用的最多,通常直接实例化一个Array,类似于 new Array…

HOC VS Children VS Render Props

25 十一月, 2018

简介HOC(Higher-Order Components) 是react中通过高阶组件来抽象逻辑的用法。它并不是React提供的API,而是一种通过在JavaScript函数传参的形式来减少代码逻辑。Children 是 React 通过 props 向下暴露的 API…

从0到1部署一个eggjs应用

16 十一月, 2018

环境配置假设已经了解以下应用和服务的使用场景准备一个eggjs应用gitlabgithubgit…Node v8.x.xdockerkubernetesegg配置文件configconfig/config.default.js 本地开发环境config/config.test…

electron 10 问 10 答

09 十一月, 2018

如何利用NodeJS 子进程为 electron render 提供 API server,以及维护子进程的状态可以通过NodeJS 内置模块 child_process spawn 文件,并且watch文件的状态。在 main.js 中引入 child…

关于 CI 及测试有关知识工具总结

01 十一月, 2018

JavaScript 测试相关工具和库的对比和总结,以及自动化测试以及持续集成的的相关实践。单元测试assert 断言Assert | Node.js v11.0.0 Documentation是 node.js…

在AntPro 2.0中本地开发开启HTTPS

27 九月, 2018

需求在使用定制化框架Antd-Pro开发前端项目时,在客户端需要与硬件交互的情况下,需要在本地开发开启HTTPS,例如二次验证U2F。问题描述antd-pro 本身就是一个隔离的沙盒,虽然脚手架本身的服务基于webpack-dev-server…

gitlab与 gitlab runner 安装问题

27 六月, 2018

环境阿里云 ECS(2核4G)CentOS 7.xMac问题问题1解决方案并不是给那些提示的文件描述权限,而是给以下目录权限参考链接https://mp.weixin.qq.com/s?__biz=MzI1MTA0OTM0Mw==&mid=2650959269&idx=1&sn…

webpack 处理 css module的一种方式

08 二月, 2018

在实际项目开发中,会经常遇到引入第三方库和开发者自己书写的处理问题。首先我采用了的语法,借助的语法可以实现定义变量、全局css、自动添加浏览器内核的前缀等等,除此之外,借助,采用cssmodule的实现方式在中定义,并且为了防止重复的代码,采用了`namelocal-hash…

解析webpack plugin的生命周期,书写自己的第一个plugin

18 一月, 2018

引子想要了解webpack plugin如何编写,首先要了解其应用场景和作用。可以先浏览这三篇文章how-to-write-a-plugincompiler APIplugins API除此之外,在这里我和进行了简单的对比。plugin & loaderplugin…

消失与重现

01 一月, 2018

关于小程序视频(video)的一些总结

29 十二月, 2017

小程序中使用视频类似视频这种原生组件,位于小程序的最上层,当页面滚动时,很有可能出现一些定位的元素,被视频组件覆盖,如下图为了避免一些层级最高的元素覆盖掉原始样式,可以先隐藏视频,将一gif格式的图片代替,并辅助一播放图标,表示该位置是视频在onLoad…

浅谈CSS盒模型(CSS Box Model)

22 十一月, 2017

概念在一个html文档中,每个元素都被表示为一个矩形的的盒子。这每一个矩形的盒子被描述为盒模型(CSS Box Model)。并且这个模型描述了元素所占空间的内容。组成正常情况一般情况下,一个盒子是由以下部分组成width = content-width + padding…

Cascader Format

10 十月, 2017

功能将无序的类型转化为级联选择(Cascader)的数组数据结构原理通过寻找数组的相同点,构造哈希匹配来实现,减少复杂度和寻址效率。这里之所以这样做,是因为数据的灵活性,既可级联,又可作为长列表。Screenshot

记一次阿里云服务器ECS迁移导致的nginx和node有关问题

23 九月, 2017

阿里云的产品提醒还是很友好的,一快到付费节点,那短信提醒简直比移动联通欠话费还来得勤快。不过重要的消息通知还是很及时。近几天部分服务器迁移,虽迁移顺利,但是由于后台为Node.js起的服务,需要手动重启,下面记录下该过程。以下环境为阿里云ECS, OS: CentOS…

写给弟弟,玄烨

19 九月, 2017

ECMASCRIPT6 -- 碎片化记忆

24 八月, 2017

变量交换交换,值术语模板字符串 (template string)扩展运算符 (…)定义原生方法例如:对象,具有等方法,如果我们想定义一个全局、或者模块化的方法该如何定义呢?Math对象新增的方法Math.trunc…

HTML5 dataset 属性不为人知的地方(命名规则和原理)

18 八月, 2017

HTML5在元素中增加了*data-**,可以允许用户自定义属性。这种可读写的方式极大的方便了 操作元素时的数据存储、状态保留。经常可以在各大主流网站上面看到它的使用,例如淘宝首页。下面记录下一些使用细节。语法在语法上,我们可以在任何DOM…

React+Atom开发者增加效率的7个快捷键

31 七月, 2017

选择一个字符串 快速地选择一个字符串。不仅是atom…

惊梦

27 七月, 2017

你喜欢怎样的面试官

12 七月, 2017

JavaScript Arguments

25 三月, 2017

上一次说到了JavaScript中加引号和不加引号的区别,已经认知到了在大体上还是没有区别的。这里我将深入的了解JavaScript函数中的arguments…

如何科学上网-想要翻墙怎么办

22 三月, 2017

首先通过hosts文件翻墙。具体方法见 https://github.com/racaljk/hosts。这里简述下Mac下的操作。将 https://raw.githubusercontent.com/racaljk/hosts/master/hosts 链接中的hosts…

JavaScript Array-like

21 三月, 2017

Array-like所谓的Array-like,即类数组。其实并不是数组,但是可以像数组一样的进行访问,在这里,仅仅是写法上的一致。其实并不是数组。对象(Object)对象不加引号和加引号的区别,可以参考该链接(http://stackoverflow.com/questions…

JavaScript一些有趣的地方

18 三月, 2017

对象(Object)对象不加引号和加引号的区别特殊情况不可以用点的属性访问

分享一些CSS画图技巧(4)—插头

18 三月, 2017

这个图形其实很少看到,其实在实际生活中,经常会有这样的插头形状,像主机和显示器的相连接的插头。需要两个螺丝钉去固定,以及几个端口去连接。img…

分享一些CSS画图技巧(3)—— 电源插头

18 三月, 2017

分享一些CSS画图技巧(2)——三角形

10 三月, 2017

三角形相对来说比较简单,我们可以通过设置border…

分享一些CSS画图技巧(1)——矩形

10 三月, 2017

首先在这里声明,对于画图来说,大部分的图案的宽度甚至高度都是固定的,就算采用百分比的方式来绘制,也会有最外面的边界限制。尽量在PC端或者响应式要求不太高的场景下进行,当然会有一些比较简单的图案绘制能够适应响应式的方式,可以采用canvas或svg…

ESLint 的使用

27 二月, 2017

ESLint可以作为代码审查的工具,来强制的制定一些代码规则或规范来管理、统一一个团队的代码风格。你可以将它作为一个代码检查的工具,应用它的规则可以检测出代码中某些潜在的问题或者值得优化的代码,并且,你也可以将它作为一个代码规范的标准来养成你的书写习惯。历史ESLint…

EJS在script标签中混合JavaScript代码的问题

23 二月, 2017

背景我在项目中定义了一个全局变量:在的时候传入ejs页面中,传入完成后,在ejs中想要保留在js代码中,结果发现,每次浏览器都报这个错误解决方案最终,在http://stackoverflow.com/questions/11289793/accessing-ejs…

JavaScript-Math.random()

22 二月, 2017

Math.random…

ECMAScript 2015 Features-c04-destructuring

21 二月, 2017

ECMAScript 2015 FeaturesDestructuring…

ECMAScript 2015 Features-c03-string-tpl

21 二月, 2017

ECMAScript 2015 FeaturesTemplate Strings字符串模板是用来构建字符串,并且可以在字符串中添加变量、表达式的语法糖。写法与中的字符串拼接及其相似。特点方便的拼接字符串提供字符串中添加变量、表达式等写法Scala中的字符串拼接

ECMAScript 2015 Features-c09-proxies

21 二月, 2017

ECMAScript 2015 FeaturesProxies代理允许创建具有可用于托管对象的全部行为的对象。可用于拦截,对象虚拟化,日志记录/分析等。

ECMAScript 2015 Features-c06-generators

21 二月, 2017

ECMAScript 2015 FeaturesGenerators可以使用和关键字实现。可以生成迭代的下一个值,并通过返回。写法

ECMAScript 2015 Features-c01-arrow-function

21 二月, 2017

ECMAScript 2015 Featuresarrow && function相同点都表示一个函数(箭头函数可以看做 的语法糖)写法上的不同点(其他不同点参考下文)arrow functionfunctionarrow && this…

ECMAScript 2015 Features-c02-class-suger

21 二月, 2017

ECMAScript 2015 Featuresclass…

ECMAScript 2015 Features-c10-subclassed

21 二月, 2017

ECMAScript 2015 FeaturesSubclassed在ES6中,,,元素都可以被继承子类化。

ECMAScript 2015 Features-c12-promises

21 二月, 2017

ECMAScript 2015 FeaturesPromises异步编程写法

ECMAScript 2015 Features-c13-tail-call

21 二月, 2017

ECMAScript 2015 FeaturesTail Calls(尾递归)尾递归能够使堆栈不溢出,并且防止内存泄漏。写法下面一个例子,为求斐波那契第项

ECMAScript 2015 Features-c08-set-map

21 二月, 2017

ECMAScript 2015 FeaturesSet && Map高效的数据结构。写法SetMap

ECMAScript 2015 Features-c07-modules

21 二月, 2017

ECMAScript 2015 FeaturesModules遵循着两种比较流行的模块加载器——,模式。在未引用该模块之前,该模块不执行,知道被。写法

ECMAScript 2015 Features-c11-number-string-array-object

21 二月, 2017

ECMAScript 2015 FeaturesNumber String Array Ojbect

我为什么离职

19 二月, 2017

div始终位于底部的问题

16 一月, 2017

背景在阅读Flexbox Patterns文章时,发现曾经解决过如下问题。在此作为记录。需求描述对于常见的列表或者卡片布局时,宽度往往统一,高度参差不齐。如果想要实现风格一致的卡片或者列表,如下图所示,当描述文字高度不一致时,最底的价格始终保持在最下面,每两个对齐。实现方式DOM…

Clean Blog by Node && React 5

21 十二月, 2016

前言此篇接上篇Clean Blog by Node && React…

Clean Blog by Node && React 4

17 十二月, 2016

前言此篇接上篇Clean Blog by Node && React 3记录markdown.md的使用记录文章详情API以及提交文章API的书写开始实战markdown…

Clean Blog by Node && React 3

16 十二月, 2016

前言此次记录承接上篇Clean Blog by Node && React…

Clean Blog by Node && React 2

14 十二月, 2016

前言此记录接上次记录 Clean Blog by Node && React主要任务为记录静态页面的构造()clean-blog的应用,在这里放出其地址(https://startbootstrap.com/template-overviews/clean-blog…

Clean Blog by Node && React

12 十二月, 2016

最好用的markdown编辑器汇总

15 十一月, 2016

收集了一下好用的markdown编辑器,都曾经大量使用,都爱不释手。选择恐惧症。。。1. stackedit在线编辑器支持同步google drive,github等stackeditbeta版stackedit-beta2. dillinger在线编辑器支持同步google…

快学Scala+Playframework之增删改查—— 数据库操作(四)

14 十一月, 2016

目标接上一篇快学Scala+Playframework之增删改查—— 数据库操作(三),完成其他(添加、查询、修改、删除)等API的操作知识点数据库操作列表添加、查询、删除、修改 API…

快学Scala+Playframework之增删改查—— 数据库操作(三)

01 十一月, 2016

目标接上一篇快学Scala+Playframework…

JavaScript Not defined or Undefined

31 十月, 2016

JSON-Server and XMLHttpRequest

29 十月, 2016

快学Scala+Playframework之增删改查——路由与静态页面(二)

28 十月, 2016

需求将项目导入IDE(Intellij)理解静态页面与服务器请求发生的原理完成增删改查的静态页面主要知识点项目目录的理解路由配置,请求静态页面的过程页面传参原理静态页面代码书写导入IDE导入时不要选择,选择->,然后选择导入。img导入成功后的项目截图如下:img…

快学Scala+Playframework之增删改查——项目搭建(一)

25 十月, 2016

需求为了更好更快更有趣味地学习这门编程语言,结合在实际开发场景中的运用,目标建立一个简单的用户列表的(read,search,add,delete)系统。特别记录此次学习过程。代码托管效果img更多效果前提必须具有开发环境或IDE…

react中state变化导致的问题

10 十月, 2016

bundle install command not found

10 十月, 2016

背景描述如果想用来生成你的静态站点,并且使用来生成静态模板,但是苦于不懂,对其运行环境的了解很欠缺,根据上的教程来对环境进行搭建时,执行命令:出现 的错误解决方案有极大可能是因为版本的问题导致了。可以通过重装,键入命令:alt安装成功之后,alt执行:alt…

我作为初级前端开发者对潮流的认知

23 九月, 2016

Who am I虽然我接触前端已经有将近两年半的时间,但是我还是不敢自诩为一名合格的前端开发工程师。于是我找了一个名词来形容我自己的状态—初级前端开发者。之所以写这篇文章,是想抒发一下对如日中天的微信的感慨。小白入门 Hello World…

在nginx服务器下配置和安装阿里云购买的SSL证书

18 九月, 2016

阿里云域名解析,Nginx二级域名的配置

12 九月, 2016

开发环境本地环境 OS X ECS CentOS…

Github中passport的应用(github登录接口)

12 九月, 2016

1、点击头像下拉三角形按钮,进入alt2、点击左侧列表按钮中的alt3、左侧默认显示的你曾经用账号登录过的网站,点击,作为开发者应用使用。 4、依次按照表单提示填写内容,最终会生成和 。alt5、在项目中安装两个模块6、在入口文件中(app.js) 引入模块:…

react的缺点(一):react中多个component的问题记录

12 九月, 2016

在使用`react`创建多个component的过程中, 该方法创建的在使用上注意以下几个方面:方法中加入多个的会报错。因此,需要在中最外层加入一个标签,具体代码如下://正确书写如下://错误书写如下:错误原因:官方解释 https://facebook.github.io…

实验室

11 九月, 2016

关于react的另一个博客一些关于react的实践SpongeSpongeBEexpressjs-react-blog-serverexpressjs-react-blogreact-babel-webpack-eslint-boilerplate一些关于scala…

React IndexRoute always active

10 九月, 2016

直接在代码中添加:这时候标签会一直高亮显示,即一直处于状态不回改变,即使切换路由,如下图所示:altx 官方给出的原因时这样的:Now navigate around. Notice anything weird? The link to Home is always…

display:inline-block不对齐问题

10 九月, 2016

需求描述:书写一个导航栏,使用的属性进行布局。 导航栏内容:和构成。 提示:使用最简单的结构,拒绝一切多余嵌套。展现形式,如下图: alt实现方式建立简单的结构如下代码:(忽略其中的,此为实现的).添加相应的css代码如下。展示效果如下。alt…

关于

05 九月, 2016

个人简介Beace Lee, 2016年6月毕业于上海工程技术大学,计算机嵌入式方向。专注领域开发。如今从事及相关技术(栈)开发。交流emailbeaceshimin@gmail.comwechat

React 动态添加一行数据(包括一行表格或者非表格)

01 九月, 2016

React 在中添加不可以直接嵌套多个在中的函数添加表格,代码如下:浏览器会报这样的错误; altreact不会把DOM解析成thead和tbody这样的方式,解决方式为手动添加,完整代码为:但是遇到必须要添加一行的时候如何是好,或者更加奇怪但是很常见到的例子:alt…

Play Framework运行阻塞的问题

05 七月, 2016

问题描述在命令行中运行出现如下信息:程序会一只卡在红色那句话,正确编译的效果应该为:解决方案:在根目录下的文件中,将:改为:

React表格处理

01 七月, 2016

问题描述中在的中直接输入类似以下的代码:解决方案:在渲染的过程当中浏览器不会自动添加和这样的标签,因此需要在手动添加,如下:** 中如果想要合并单元格的功能,需要大写,例如:,示例代码如下:**

React HashHistory url参数问题

27 六月, 2016

问题描述在引用时,浏览器的会自动生成一个,如同:这是为了兼容低版本的浏览器不支持的做法,但是在中会觉得好像或了某个参数。 官方的解释是:The URLs in our app right now are built on a hack: the hash. Its the…

我是如何搭建HyBrid App开发环境的

05 十二月, 2015

用web开发app简直耗尽机器的性能和人的体力、精力。 不过为了满足我的好奇心,经过一番折腾。我还是去做了。简单来记录一下这个复杂又简单的过程。step1我是借助来进行打包和模拟的。因此首先安装,因为基于,必须安装。版本越高越好,但是一定是稳定版,beta…