20180610 前端开发日报-前端开发博客

GitHub 的用法与礼仪；利用 chrome_remote_interface 实现程序化、自动化 Web 安全测试；前端如何进阶全栈开发；JavaScript函数式编程之深入理解纯函数；Vue + TypeScript 尝鲜体验；Next.js 使用指南2－路由与加载；「前端」看懂前端脚手架你需要这篇webpack；结合 SEM 和 BIO 来改进 CSS

GitHub 的用法与礼仪我们该如何参与并回馈这类全球开源社区？听作者谈心得体会，希望能帮你避免再次踩坑。
利用 chrome_remote_interface 实现程序化、自动化 Web 安全测试高考加油！如果要问有哪些抓包神器或者流量分析工具？以下几款工具是必须要提的，burpsuite（跨平台）、fiddler（windows下抓包神器）、wireshark（经典网络抓包工具）、justniffer（与前面几个使用代理获取流量不一样的是，justniffer是基于网卡获取流量）等。以上这几款工具之前我有单独成文介绍过，如有需…
前端如何进阶全栈开发前端进阶之困最近看了不少文章和帖子，如文：前端的焦虑，你想过30岁以后的前端路怎么走吗？前端怎么一步步走向全栈呢？移动端入门Node.js怎么学习? 前端的未来走向在哪里？工作2年多的前端，…
JavaScript函数式编程之深入理解纯函数纯函数是函数式编程的基础，需要重点理解。纯函数的概念：纯函数是这样一种函数，即相同的输入，永远会得到相同的输出，而且没有任何可观察的副作用。在说明纯函数的概念之前，先讲两个其他的概念：可变数据类型和不可变数据类型。我们知道，在JavaScript中
Vue + TypeScript 尝鲜体验适用 Vue.version < 2.5 && Vue.version >= 2.2 其实我个人一开始很讨厌 TypeScript 这个东西，就是因为讨厌 Java 的啰里巴嗦，突然在我眼前出现了 JavaScri
Next.js 使用指南2－路由与加载书接上文 Next.js 使用指南1-基本规则，这节我们将过渡到一些高级的功能。涉及到的内容包含：路由、高阶组件、预加载、动态路由等等，快来开始吧！一、路由拦截 import Router from ‘next/router’ Router.beforePopState(({ url,as, options }) => { // I only want to allow these two routes! if…
「前端」看懂前端脚手架你需要这篇webpack 本文来自尚妆前端团队南洋发表于尚妆博客分割webpack配置文件的多种方法（一）将你的配置信息写到多个分散的文件中去，然后在执行webpack的时候利用–config参数指定要加载的配置文件，配置文件利用moduleimports导出。你可
结合 SEM 和 BIO 来改进 CSS 不知道SEM 和 BIO 是什么？快看本文，学习如何更好的管理你的CSS。
Next.js 使用指南（一）：基本规则提起服务端渲染，大伙肯定并不陌生。不论是前端渲染还是服务端渲染，都是值得我们深入研究的。这节我们来了解一下 React 服务端渲染框架 Next.js。一、服务端渲染服务端渲染，是指页面的渲染和生成由服务器来完成，并将渲染好的页面返回客户端。而客户端渲染是页面的生成和数据的渲染过…
【2018年5月份GitHub上最热门的开源项目】又到了为大家盘点5月份GitHub最热门的开源项目的时候了，本月排行第一的是Node之父的新项目deno，被认为是下一代 Node，不知道接下去会表现如何呢？详见
Vue 与 React 父子组件之间的家长里短 // father.js <template> <div id="father"> 这是父组件： <p>父组件</p> <Child ref="child" :msg="msg" @click="faClick"></Child> </div> </template> <script> import Child from ‘./child’…
Node.js + Nginx 部署 HTTPS 服务今天，经过无数次折腾，向往已久的域名备案终于下来了。于是迫不及待地将个人博客网站进行 HTTPS 部署迁移，中间遇到一些坑，在此做个记录。原因之所以要将网站从 http 迁移到 https，原因有： https 更安全，相对于 http 可以较为有效防止
从零开始React项目架构(二) 配置eslint我需要安装一些依赖包： npm install -D eslint eslint-loader eslint-plugin-react babel-eslint 修改 webpack.config.js 文件 { test:/.(js|jsx)$/, use: , exclude:/node_modules/ } 创建 .eslintrc.js 文件 modu…
使用 Node.js 开发简单的脚手架工具前言像我们熟悉的 vue-cli，react-native-cli 等脚手架，只需要输入简单的命令 vue init webpack project，即可快速帮我们生成一个初始项目。在实际工作中，我们可以定制一个属于自己的脚手架，来提高自己的工作…
JSConf EU 2018 有哪些值得关注的点? “历时两天 JSConf EU 2018 结束，总结了下还是有不少有趣的点，包括错误处理、BigInt、deno、无障碍性访问、事件循环、Node.js 安全、可视化、增强现实、AI & DL、Push 推送等等。”
【前端Talkking】CSS系列——CSS深入理解之line-height1.写在前面两个多周的时间没有写文章了，手好痒好痒，趁着公司在装修，从上周末到本周都在家办公，同时公司的项目并不紧急，于是抽着时间梳理了一下CSS中关于行高line-height的理解，今天发布出来，大家准备好了…
前端娱乐圈大事记前端娱乐圈大事记 Blog Github 前端娱乐圈大事记时间线前端项目 Gooflow 挖矿事件作者 sdlddr 在 WEB 网页端设计流程图的 UI 组件的开源项目 Gooflow 中, 使用 eval 添加挖矿程序, 在使用 MI
以变制变 – 前端动态化代码保护方案探索本文分享了腾讯防水墙团队关于机器对抗的动态化思路，希望能抛砖引玉，给现在正在做人机对抗的团队一些启发，帮助更多中小型公司的业务摆脱机器和爬虫之痛。 0x00 前言浏览器作为当今互联网的一大流量入口，正在变得越来越强大。为了有更好的
【程序员的那些反模式】有鸡汤就有反鸡汤，有模式就有反模式。今天，我们来谈一谈程序员的行为中的那些反模式，涉及程序员的日常工作和学习的各个方面。全文=> 有鸡汤就有反鸡汤，有模式就有反模式。今天，我们来谈一谈程序员的行为中的那些反模式，涉及程序员的日常工作和学习的各个方面。这些反行为模式，并不针对某些特定的个人。如果你不幸中招，千万不要懊恼，因为这实在太正常不过了，很多反模式的坑我也是亲身踩过的^-^ 稍微修改几行代码就调试对所有程…
深入了解 Weex Weex 本文并非是介绍Weex是怎么使用的，如果想要了解怎么使用，不如了解一下 Eros 的解决方案，主要想剖析一下Weex的原理，了解Weex的运行机制。为什么要选择 Weex 首先想聊一聊我们为什么选择Weex。上一篇文章结尾对Weex和ReactNa
【20180609 前端开发日报】手把手教你撸一个简易的 webpack；什么是框架？为什么说 Angular 是框架？；手摸手带你从零实现一个符合Promises/A+规范的promise；处理 IO – NodeJS 事件循环第 4 部分；Deno不是下一代Node.js；关于Ajax和webs…详情→
JavaScript 工作原理之十－使用 MutationObserver 监测 DOM 变化原文请查阅这里，略有删减，本文采用知识共享署名 4.0 国际许可协议共享，BY Troland 。本系列持续更新中，Github 地址请查阅这里。这是 JavaScript 工作原理的第十章。网络应用在客户端日益复杂，这是由很多因素的造成的，比如需要更加丰富的界面交互以提供更加复杂的应用功能，实时计算等等。网络…
angular脏检查原理及伪代码实现我们经常听到angular的脏检查机制和数据的双向绑定，这两个词似乎已经是它的代名词了。那么从编程层面，这到底是什么鬼？当$scope的一个属性被改变时，界面可能会更新。那么为什么angular里面，修改$scope上的一个属性，可以引起界面的变化呢？这是an
Next.js 使用指南3－高级配置书接上文 Next.js 使用指南2-路由与加载，到这里，恭喜你已经完成了大部分的学习，基本使用已经足够。何不锦上添花，顺势拿下最难啃的部分呢？一、关于组件同 App 组件一样， document 组件也可以被覆写，这时我们需要创建 .pages/_document.js 文件： // _document is only rendered…
各类“服务器推”技术原理与实例（Polling/COMET/SSE/WebSocket）前言服务器推（Server Push）是一类特定技术的总称。一般情况，客户端与服务器的交互方式是：客户端发起请求，服务器收到请求返回响应结果，客户端接收响应结果进行处理。从上述的交互过程中可以看出，客户端想要获取数据，需要自主地向服务端发起请求，获取相关数据
Super-Vuex 状态管理最佳实践 Vuex作为vue中核心的状态管理组件，时常遇到编写繁琐的问题。是否我们可以通过一套方案就可以达到只定义数据结构而不需要写无数的mutation getter 以及action。所以，原则上我们是让vuex变的更加轻量和简单。 Super-Vuex Supe
Angular Ivy的变更检测执行：你准备好了吗？原文链接：Angular Ivy change detection execution: are you prepared? 让我们看看Angular为我们做了什么。声明：这只是我对Angular新渲染器的学习之旅。
【程序员的快乐生活】全文=> 1 两本书的书名似乎阐述了一个真理… 2 一夜学会编程的捷径提问：如何在一夜之间学会编程？最佳回答：冬天来临的时候，带上电脑去北极吧…… 3 代码有error怎么办？我：我的代码有error怎么办？求指导。同事：关掉console窗口。我：关了…
Vue源码的最后一站去年我写了一篇分析Vue源码的博文，不知道有多少人看到过：Vue2.1.7源码学习这篇文章是我所写的博文中被转载最多的一篇文章，在这篇文章的开头我提到了这是系列文章中的第一篇，当时的想法是还会有第二篇、第三篇……，但现实是残酷的(你加班你懂)。不过这