20200329 前端开发周报-前端开发博客

【JS启示记】—闭包之争可休矣；提升你react和js编码的5个技巧；Vuejs响应式流程；如何实现一个React水印组件；从 Event Loop 到 Promise (常见问题分析)；Emitter | 每天读一点Vue源码；一名合格前端人员必须知道的 this 用法和陷阱（JS系列之三）；2020前端面试，你准备好了吗？

【JS启示记】—闭包之争可休矣 “闭包”，可以排进JavaScript最难理解概念的前三，连那些正在从事“前端”职业的人，可能都没懂。这么说不是吓唬人，它并不难，但它的名字本身有点不友好，“闭”什么？“包”什么？“闭什么包”？（此处自行脑补马某梅~）技术圈儿里从不缺少这类一部分人很懂，一部分人很不懂的晦涩概念。所以，在此先把名字的意思重塑一…
提升你react和js编码的5个技巧原文地址： dev.to/adancarrasc… 原文作者：Adán Carrasco 译者：花花小仙女为了保证可读性，本文采用意译而非直译。另外，本文版权归原作者所有，翻译仅用于学习。转载请联系作者。两周前，我开始做一个新项目，有些代码已经写好了。然而，没有最佳实践可遵循。当你开始做一个新项目时，重要的是一起…
Vuejs响应式流程前记：今天重温vuejs的响应式，发现在看源码（2.5.17-beta.0版本）的时候会被某些流程绕晕，特此记下今日所得。
如何实现一个React水印组件前阵子通过前端水印生成方案(网页水印+图片水印) 这篇文章学习了一下水印的生成方案，对其中使用 Canvas 实现网页水印的方案十分感兴趣，于是对相关代码加以修改，实现了一个 React 水印组件并发布到 :point_right: npm 。该组件是通过 Canvas 生成水印，并使用 MutationObserve （可以监听DOM结构变化的接口）监…
从 Event Loop 到 Promise (常见问题分析) 一、同步和异步二、单线程和多线程三、evet loop 四、实战，promise 题目分析 Promise 什么是 promise？我们先明确：Promise 对象用于表示一个异步操作的最终完成 (或失败), 及其结果值. 什么是 async 和 await async/await 使得异步代码看起来像 ·同步…
Emitter | 每天读一点Vue源码面试的时候经常被问一些Vue源码相关的问题，通常情况下，我会在面试前恶补掘金上的面筋来对付面试，什么双向绑定的原理呀，什么虚拟dom树呀，实际上我压根儿就没仔细研究过，其一是自己真的比较菜，其二工作上也用不上，别自己给自己添堵。但后面想一下，很多事情，为之则易，不为则难，给自己设立困难（负重）才能进步…
一名合格前端人员必须知道的 this 用法和陷阱（JS系列之三） this 关键字是 JavaScript 中最复杂的机制之一。它是一个很特别的关键字，被自动定义在所有函数的作用域中。作为一名前端攻城狮对它再熟悉不过了，然而正是因为熟悉它所以很容易忽略它，以至于用它时踩了不少的坑，甚至在面试时还因为它挂了。所以学习和掌握 this 的用法和一些陷阱对于进阶成名一名合格前端攻城狮很有必…
2020前端面试，你准备好了吗？求职季又到了，最近也面试了不少web开发同学，本文也希望对正在找工作的同学有所帮助吧。请大家见谅哈。后面会持续更新，欢迎点赞~~~
关于 Babel 你必须知道的基础知识前言我第一次打开搜索引擎查询关于 Babel 的资料时，出现的竟然是关于 Babel 的传说。后来我花了小一天的时间去了解这个传说（来自《旧约圣经》）。 Babel Tower 是全人类联手建造的一个建筑，人们决心合力修建一座通天高塔。因为人们心里少了对上帝的敬畏，多了为自己歌功颂德的功利。上帝不希…
写给女朋友的中级前端面试秘籍（含详细答案，15k级别）什么是BFC？什么条件下会触发？应用场景有哪些？关于bfc，可以看看三元大佬总结的文章这篇文章里，顺便也把外边距重叠的问题讲了一下。 JS基础篇讲讲JS的数据类型？最新的 ECMAScript 标准定义了 8种数据类型: 7 种原始类型 Boolean Null Undefined Number BigInt Strin…
如何自己实现 JavaScript 的 new 操作符？new 大家肯定都不陌生，单身没有对象的时候就 new 一个，很方便。那么它在创建实例的时候，具体做了哪些操作呢？今天我们就来一起分析一下。
小白也能听懂的前端工程化前端工程化最近也是被很多公司或者企业都用起来了，变成了一个很火的名词，所以我就好奇一下中间的前因后果是怎么样的
Vue高级指南-02 Vue.js源码深入解析目前社区有很多 Vue.js 的源码解析文章，很多大牛写的都非常详细，但说到底。光看文章自己不去研究源码和总结笔记，终究不会深入了解和记忆。本篇文章将自己研究 Vue.js源码的一些内容做成笔记并且记录下来。加深印象和理解，俗话说读书百遍不如手写一遍。理解什么是MVVM模式？ MVC 模式是指用户操作会请求服务…
# React 实践揭秘之旅，中高级前端必备(下)上一篇文章我们主要实现了 JSX 在 WebGL 上的渲染与更新，对虚拟DOM 和 Diff 有了更深的了解，但相比于我们使用的 React，还缺乏了之中很重要的一环 — 组件模式。
手写JS系列:手写一个REACT SSR框架(未完结) 在介绍SSR之前，我们可以先了解CSR。那什么是CSR呢？CSR即Client Side Render在我们传统的REACT/VUE项目中采取的是单页(SPA)方式，即只有一个html,结构大致如下: <html> <head> <title>传统spa应用</title> </head> <body> <script src="bundle.js"></script…
Vue Router原理我们能在同一个网址上访问不同的页面正是用到了路由功能，这个路由地址能通过 window.location.hash 得到，以Vue官网为例，打开一个页面查询此属性可以得到 window.location.hash "#router-start-replaced" 复制代码这个值是自带一个 # 号的那么我们如何监听到route的变化呢，有一个api， hashcha…
面试专题总结：Vue 知识总结希望读者依此构建自己的知识树（思维导图）偷懒一下：可参考我自己总结思维导图 : 点这里附带：高频面试题积累文档。来自于（学长、牛客网等平台）自己开发的博客地址： zxinc520.com github地址: 点击此篇 js – 【vue 知识总结】知识点：全部弄懂了，面试很容易。我的博客【MVVM 和 vue】参…
如何在不同项目中共用前端资源，从此不加班随着公司前端项目的增多, 大家会发现各个项目中很多资源都是是大同小异的，这就引发了一个话题，如何跨项目共用前端资源, 这里的资源泛指前端涉及到的所有静态资源, 常见的有 HTML/CSS/JS/图片等等. 所谓共用前端资源, 就是将公共的前端资源提取出来, 例如公共样式/公共逻辑/公共组件/公共图片资源等等, 让多个项目来…
[推荐] 前端首屏耗时测量方法前端时空前端网红集结号，传递一线全栈技术，带你穿越前端时空。 ❝ 在进行前端优化的时候，我们需要关注各种性能相关的指标，了解这些指标代表的含义才能更好地进行性能优化。 ❞ 重点需要关注的指标 DOMContentLoaded 指标：DOM 解析完毕…
Vue+element实现图片的上传与显示业务逻辑：某个模块新增时新增图片，详情显示也有图片字段，编辑也能对图片进行编辑。 1.图片上传自己写了一个图片上传的组件，在父组件中引入即可，图片上传组件返回一个图片id的数组，然后在父组件的上传函数中把图片id传给对应的字段即可。父组件： <template> <div> <el-form-item label…
[前端开发]Vue组件化的思想组件化的思想将一个页面中的处理逻辑放在一起，处理起来就会很复杂，不利于后续管理和扩展。如果将页面拆分成一个个小的功能块，每个功能块实现自己的内容，之后对页面的管理和维护就变得很容易了。注册组件的基本步骤 1.创建组件构造器 2.注册组件 3.使用组件 //创建组件构造器对象 const c…
这个锅，运维来背？忘记续期 HTTPS 证书，网易邮箱大量用户无法使用 2020年3月20日晚间，许多苹果用户看到系统不断地弹窗无法验证服务器身份，包括iOS、iPadOS以及 macOS系统全部如此。在弹窗中苹果标注不能验证「appleimap.163.com」的身份，简单来说就是这个域名的 HTTPS 证书无法被信任。至于不能被信任的原因倒是非常简单：由于网易邮箱忘记给服务器更换新证…
《吐血整理》系列大厂前端组件库工具集合（PC端、移动端、JS、CSS等）前言 Coding 应当是一生的事业，而不仅仅是 30 岁的青春:rice: 本文已收录 Github https://github.com/ponkans/F2E ，欢迎 Star，持续更新:droplet: 上一篇《吐血整理》系列大厂前端必备工具集合（抓包、调试、Mock 数据等等）发布之后，很多小伙伴问怪怪有没有大厂前端开发工具组件库的集合，今天，它来了…
[推荐] 前端高级进阶：网站的缓存控制策略最佳实践及注意事项对于一个网站来讲，性能关乎用户体验，你在更短的时间内打开网站，你将会留住更多的用户。如果你的页面十秒才能打开，那再好的用户交互也是徒然。缓存控制是网站性能优化中至为常见及重要的一环，好的缓存控制，除了使网站在性能方面有所提升，在财务方面也有重要提升: 更好的缓存策略意味着更少的请求，更…
Vue源码之nextTick 今天我们开始讲一下 Vue 的 nextTick 方法的实现，无论是源码还是开发的过程中，经常需要使用到 nextTick ， Vue 在更新 DOM 时是异步执行的，只要侦听到数据变化， Vue 将开启一个队列，并缓冲在同一事件循环中发生的所有数据变更。如果同一个 watcher 被多次触发，只会被推入到队列中一次。这种在缓冲时去除重…
Vue + Node + WebRTC 构建一个高逼格的视频应用 ☝点击上方蓝字，关注我们！本文经授权转载自公众号前端之巅。作者 | Adrián García Diéguez译者 | 王强编辑 | Yonie、张之栋现在市面上有很多提供聊天和视频会议功能的免费应用，只需轻点几下鼠标，我们就能与世界各地的小伙伴愉快地交流。那么，你是否有兴趣构建一个属于自己的视频应用呢？让我们一起…
HTML5（五）Geolocation HTML5 Geolocation 定位用户的位置 HTML5 Geolocation API 用于获得用户的地理位置。鉴于该特性可能侵犯用户的隐私，除非用户同意，否则用户位置信息是不可用的。注意:Geolocation（地理定位）对于拥有 GPS 的设备，比如 iPhone，地理定位更加精确。 geography 地理； location 位置; Geo+location 地理…
【面试题解析✨】Vue 的数据是如何渲染到页面的？面试的时候，面试官经常会问 Vue 双向绑定的原理是什么？我猜大部分人会跟我一样，不假思索的回答利用 Object.defineProperty 实现的。其实这个回答很笼统，而且也没回答完整？Vue 中 Object.defineProperty 只是对数据做了劫持，具体的如何渲染到页面上，并没有考虑到。接下来从初始化开始，看看 Vue 都做了什么…
vue 中4个级别的作用域点赞再看，养成习惯本文 GitHub [链接] 上已经收录，更多往期高赞文章的分类，也整理了很多我的文档，和教程资料。欢迎Star和完善，大家面试可以参照考点复习，希望我们一起有点东西。
JS异步编程有哪些方案？为什么会出现这些方案？关于 JS 单线程、EventLoop 以及异步 I/O 这些底层的特性，我们之前做过了详细的拆解，不在赘述。在探究了底层机制之后，我们还需要对代码的组织方式有所理解，这是离我们最日常开发最接近的部分，异步代码的组织方式直接决定了开发和维护的效率，其重要性也不可小觑。尽管底层机制没变，但异步代码的组织方式却随着 ES …
纯手动搭建 React 项目创建项目目录初始化 npm 项目 npm init -y 复制代码初始化 git 项目 # 初始化项目 git init # 添加 .gitignore echo "/node_modulesn/build" >> .gitignore # 关联远程仓库 git remote add origin <url> 复制代码二、 Webpack 配置 2.1 基础配置设置创建文件 /src/in…
把 GitHub 放入口袋，“开箱” 官方客户端 GitHub 2019 开发者大会说要出的客户端，今天（2020.3.18）终于放出了下载。之前如果登记过的小伙伴应该也和我一样收到了下面样子的邮件：好了，那么接下来我们就来“开箱”吧！一、安装邮件中给出了 iOS 和 Android 客户端的下载地址，但是国内的网络有些特殊，有些网站访问不了。有的安…
从零开始使用 Koa2+Vue-SSR 开发博客前台(附上成品) 开始之前先附上我的成品项目地址（喜欢的话点个小星星）： github.com/1912820899/… 开始教程之前需要先说明一下，由于博客前台之前使用SPA写的，现在拿来重构，所有本教程将不会借助vue-cli 和 nuxt.js来进行开发vue-ssr。一.前置知识储备 1.webpack安装配置打包，还不懂的请先最少要看一遍官方文档，手动跟着…
[推荐] 前端科普（二）：Node.js 换个角度看世界【前端科普系列】往期精彩内容：《前端科普系列（1）：前端简史》主要介绍 web 前端发展的历史、大事件。本文为系列文章（2），主要介绍 Node.js 的前世今生、核心科技以及背后的故事。一、关于 Node.js 1.Node.js 是什么 No…
以一个梳理Vue 更新流程 Vue 如日中天，几乎每一个Web 开发者都知道Vue 是通过 Object.defineProperty 对数据劫持以达到响应式处理，通过发布订阅模式进行事件处理，通过key 确保元素状态复用… 针对这些知识点，通过一个例子进行梳理。俗话说，“光练不说傻把式”，那么进行一次自我检阅。（以下内容结合 vue v2.6.11 阅读） <div i…
让HTTP请求来的更优雅些吧四个文件一篇文，一个工具一框架工具：axios框架：vue为例四个文件 {代码…} api.js 存放所有的接口请求 axios.js 请求拦截处理 fetch.js 对axios请求的二次封装 request.js 管理请求方式get post put delete…..
HTML meta 标签看这篇就够了<meta> 元素提供有关页面的元信息，放在文档的头部，不包含内容，属性定义了与文档相关的键值对，不会显示在页面上，但对于机器是可读的。
一份来自亚马逊工程师的 Google 面试指南：GitHub 10w+ Star，中文版晓查发自凹非寺量子位报道 | 公众号 QbitAI 一位从1997年就入行的Web工程师，立志要成为Google软件工程师，3年前写下了一篇超完整学习和面试教程，以此作为自己的奋斗计划。这位名叫John Washam的工程师，换了好几份工作，最后却阴差阳错在2017年成为了亚马逊AWS的技术专家。 …
阿里前端也切图？不，人工智能帮你做作为负责阿里云大官网和营销中台团队中的一员，我们的日常工作是横向支撑各类运营同学的需求，建设线上运营场和营销能力，帮助他们实现用户和收入的增长。在以前我们常常会听到这样的声音：
前端通信那些事儿在近两年996模式下的近乎疯狂的迭代需求打磨平台的锻炼下，积累了一些前端通信方面的一些实践经验，在这里做一个汇总。一来对自己做一个总结，二来也是给小伙伴们提供一些吸收。由于作者使用的是vue.js，所有主要对vue.js的组件通信做总结。而且是.vue单文件组件的形式。用react.js的小伙伴不要失望，文章中有很多通…
渐进增强的 Promise最近这段时间由于疫情的原因，在家实在闷得慌，所以看了下 js 的一些基础知识，从前不是很了解的 Promise 突然豁然开朗了不少，于是就赶紧趁热打铁写下来（这就是温故而知新的感觉吗，哈哈哈）。
GitHub Pages 背后的 Jekyll Jekyll 项目结构网页模板中的变量 page: Markdown 的元信息 site: 网站元信息与数据文件使用现成的 Jekyll 主题本地使用 Jekyll 其它资源 References 在代码仓库 settings 中开…
vueSsr快速采坑因为最近写了一个小工具放在自己网站上，发现网速较慢的时候，空白显示时间比较长，虽然在初始的时候放置了 loading 效果，不过还是打算优化一下。经过搜索发现用 ssr 同构来优化这一点比较好可以解决 seo 的问题；可以更快看到网页内容，优化首屏打开时间，因为无需通过加载 js 来渲染整个 dom 结构了下…
最佳Vue的细节操作webapck配置文件 vue.config.js {代码…} index.html {代码…} 命令行命令vue inspect webapck的所有配置 vue inspect –rules 查看webapck中的rules规则模块 vue inspect –rule vue 查看单个模块中的规则 vue…
你还认为在Angular中进行变化检测一定要依靠NgZone(zone.js)吗？这篇文章解释了Angular如何基于zone.js库来实现NgZone服务，以及它为何要这样做。读者通过本文可以了解到在没有zone.js时Angular框架如何运作以及它的自动变化检测何时会失效。之前我读到的大部分文章都将Zone(zone.js)以及NgZone同Angular中的变化检测紧密联系在一起。虽说它们确实有关联，但是从技术角度来看，它们…
前端响应式你了解多少？前端网红集结号，传递一线全栈技术，带你穿越前端时空。 ❝ 一两年以前，我发现，很多人都被响应式搞得很迷茫。现在，我依旧发现还有很多人不知道响应式到底是什么。所以，我感到很奇怪。到底是哪里有问题，让这么多前端的小伙伴对于这个响应式很捉急？我想，平时总是会百度「响应式」这个关键词吧，数…
总结javascript处理异步的方法 javascript语言的执行环境是单线程（single thread），就是指一次只能完成一件任务。如果有多个任务，就必须排队，前面一个任务完成，再执行后面一个任务，以此类推。这种模式的好处是实现起来比较简单，执行环境相对单纯；但是只要耗时比较多，假如有一个任务耗时很长，后面的任务都必须排队等着，会拖延整个程序…
首发地址： https://github.com/jeuino/Blo… 前言在每个执行上下文中，都包括三个重要的属性：变量对象（Variable Object，VO）作用域链（Scope Chain） this指向在前面几篇文章中，关于执行上下文的三个重要属性都已经介绍过了，传送门：《JavaScript 之作用域与作用域链》 …
JavaScript 之变量对象在上一篇《JavaScript 之内存空间》中，简单介绍了下 JavaScript 中的变量是如何存储的。本篇文章将总结一下变量和函数在运行时是如何查找并引用的。
重读 vue 文档 — keep-alive keep-alive 是 vue 内置的抽象组件 ,可以用于包裹需要缓存的组件。保存组件状态，避免重新渲染，增强性能。 Props keep-alive 组件接收三个参数，分别为 include 、 exclude 、 max include – 数组、字符串或正则表达式。只有名称匹配的组件会被缓存。 exclude – 数组、字符串或正则表达式。任何名称匹…
JavaScript——类还有对象 JavaScript面向对象，注意啦在这其实面向对象是一种编程的方式，它的思想是通用的，因此我强烈的建议你去查看我在python，面向对象编程中做的笔记。面向对象与面向过程这里还是相对比较容易理解的，这是两种截然不同的编程方式。面向过程面向对象优点性能比面…
Javascript协程与迭代器协程概念最早起源于如何解决COBOL语言编译器OnePass编译的问题，其后即使在结构化编程思想一统天下的时代，GOTO的支持也是在取舍之间。其本质就是控制流主动让出和恢复机制，让控制流更加流畅，而相对于抢占式的调度方式来说，往往还需要CPU底层支持，当然目前抢占式仍然是主流。协程、线程区别和联系 …
一步步带你搞一个微前端框架–基于single-spa 原文地址微前端是我参加工作不久，一个同事大佬在公司尝试推行的，本人有幸参与其中。在微前端的概念出现之前，微服务就已经出现并且大火，而微前端就是借鉴了微服务的架构而产生的，他们很相似，我们可以对比着理解。微服务微前端一个微服务就是由一组接口构成…
vscode 配置vue+vetur+eslint+prettier自动格式化功能该配置用于vue开发，最终效果是保存时自动根据eslint对js、html和css代码进行格式化。 vscode Vetur插件 Vetur插件用于识别vue文件，原本vetur自带格式化功能，但是和eslint会有冲突，所以没用上。 vscode ESlint插件 Eslint插件用于根据工程目录的.eslintrc.js配置文件在编辑器中显示一些错误提示，…
Electron-vue 创建 Electron + Vue 项目 Electron 是由 GitHub 开发的一个开源框架。它允许使用 Node.js（作为后端）和 Chromium（作为前端）完成桌面GUI应用程序的开发。我们所常用的 Visual Studio Code 和 Atom 都是基于 Electron 框架。去年由于业务需求，有考虑将产品迁移至 Electron 来解决 Web 端的部分短板。当时主要考虑的几点因素： …
前端常见面试-请求篇对于前端来说，请求是前端日常工作必备的，通过请求才能与后端进行数据交互，尤其在现在前后端分离的开发模式下，请求显得就更加重要。因此，对于前端开发者来说，掌握请求就很重要。下面将从http请求和常见的几…
Nginx + PHP-FPM: “Primary script unknown” 问题排查前几天在笔记本上开发PHP项目的时候，想调试接口，浏览器上却无情的出现了 “File not found” 的空白页面。笔记本上的开发环境是早就配置好了的，而且一直都是正常在用的，当时又是急着调试，却出现这种情况，顿时脑瓜子嗡嗡的。简单排查了一下访问url是否正确,hosts文件是否正常,nginx root路径是否正确，并没有找到…
webpack 从基础到进阶 2 依赖图的入口是 entry 对于非代码比如：图片、字体依赖也会不断的加入到依赖图中 Entry 的用法单入口： entry是一个字符串 module.exports = { entry: ‘./path/to/my/entry/file.js’ } 复制代码多入口： entry 是一个对象 module.exports = { entry: { app: ‘./src/app.js’, …
前端使用FileReader 读取本地文件和校验文件唯一昨天下午被问到一个问题：oss 对象存储里边由于有些图片被共享，导致上传了很多的重复的图片或者文件，有没有办法在上传之前判断一下这个文件是否被上传过，如果上传过直接去后端拿存储的地址行不行。
100多行代码实现js或者jquery版的类似juejin的预览图片功能预览图片是一个很常用的业务功能，比如掘金的预览图片功能，下面我们就来模拟实现一个类似掘金的简单预览图片功能（PS:最终实现动画效果不如掘金，可自行扩展，还有就是嵌套的元素与掘金的方式也有区别）。
手写源码系列：原生js实现call方法 thiaArg 必选的。在 func 函数运行时使用的 this 值。请注意，this可能不是该方法看到的实际值：如果这个函数处于非严格模式下，则指定为 null 或 undefined 时会自动替换为指向全局对象，原始值会被包装。 arg1, arg2, … 指定的参数列表。返回值 func函数的返回值，如果func没有返回值，则…
前端工程化建设随着浏览器和前端技术的发展，现在的前端项目越来越大、业务也越来越复杂，前端工程化已经成为一件势在必行的事情。
如何取消 Fetch 请求JavaScript 的 promise一直是该语言的一大胜利——它们引发了异步编程的革命，极大地改善了 Web 性能。原生 promise 的一个缺点是，到目前为止，还没有可以取消 fetch 的真正方法。 JavaScript 规范中添加了新的 Ab…
Dan(React 核心开发，Redux 作者) <Just Javascript>(不就是js) | 01.思维模型阅读以下代码： let a = 10; let b = a; a = 0; 复制代码在进一步阅读之前，请先弄清楚运行后a和b的值是什么？如果你已经写有JavaScript的基础，你可能会反问：“这段代码比我每天编写的代码简单得多。重点是什么？” 假设你已经熟悉它们，这段代码的目的不是要向你介绍变量，而是让你注意到并反思你的心理模型…
request停止维护：用node.js实现http网页爬虫抓取，模拟ajaxpost请求,大文件上传下载最近 node.js 一个比较出名的 http request 模块停止维护了。其实这个模块已经变得非常臃肿，模块依赖过多，体积过大，接口不统一。其实现在node.js的http模块已经非常完善，几行代码就能自己写一个，比如： Node.js网页抓取：一个最简单的http请求客户端示例(request client) 不过上面的示例并不支持post和…
学习JavaScript数据结构与算法（一）— 数组本人是一个刚入行的菜鸡前端程序员，写这个文章的目的只是为了记录自己学习的笔记与成果，如有不足请大家多多指点。数组数组是最简单的内存数据解构，数组存储一系列同一种数据类型的值。虽然在JavaScript里，也可以在数组中保存不同类型的值，但多数时候我们还是遵守最佳实践，要避免这么做。创建和初始化数组 …
对比Webpack，使用Babel+Node实现一个100行的小型打包工具 Webpack很强大，作为前端开发人员我们必须熟练掌握。但它的原理其实并不难理解，甚至很简单。毕竟所有复杂的事物都是由简单的事物组合形成的。不光是Webpack，像Vue，React这样成熟的前端框架亦是如此。读完本文，你会认识到： Webpack打包本质还是使用fs模块读写文件，加以组合。 Babel真的很强大，方便我…
封装一个基于Vue的评论留言编辑器组件现在市面上有非常多的基于 Vue 的组件库，但是看了好多都没有发现有关留言评论的组件，这对于想做一些文章信息展示类的项目可就显得棘手了，因为有太多的页面需要这个功能了，难道我们需要重复的去写（复制粘贴）这些代码吗？对于现在模块化体系逐渐完善的前端工程项目来说，一次性封装一个通用功能的组件式非常有必要的…
聊聊 OkHttp 实现 WebSocket 细节，包括鉴权和长连接保活及其原理一、序 OkHttp 应该算是 Android 中使用最广泛的网络库了，我们通常会利用它来实现 HTTP 请求，但是实际上它还可以支持 WebSocket，并且使用起来还非常的便捷。那本文就来聊聊，利用 OkHttp 实现 WebSocket 的一些细节，包括对 WebSocket 的介绍，以及在传输前如何做到鉴权、长连接保活及其原理。 …
Gitlab 中 CI/CD 自动化部署与使用今天给大家介绍一下Gitlab中CI/CD的自动化部署安装与使用。 1. docker方式安装安装文档：[链接] {代码…} 1.1 设置信息 {代码…} 2. 非docker方式安装 2.1 安装GitLab Runner 安装环境：Linux 其他环境参考：[…
从 boundle.js 源码学习 Webpack 作者/Youhe(前端时空) 文章已同步发表于微信公众号「前端时空」用逆向思维解决问题一道典型的场景面试题。一共有140g盐，如何用一个天平和两个2g，7g的砝码分三次成90g、50g。这道题用常规思路想可能会很麻烦，但是如果用逆向思维就容易的多了。首先如果要凑成50g，最后一步一定是拿两份25g的盐,25g又…
前后端分开部署时，需要单独为前端启动一个服务，如果使用gulp-connect的话，那么代理需要额外的插件来配置。首先说下为什么需要代理，gulp-connect是静态web的server（就是只能访问静态页面），如果需要向另外一个或几个服务器请求数据那么就需要代理。除非前后端一起部署，不然由于浏览器的限制是没办法跨域请求数据的…
聊聊 WebSocket，还有 HTTP还记得曾经风靡一时的 QQ 秀聊天室吗？那时，还在上初、高中的我们，QQ 是最常用的聊天交友工具；而 QQ 秀聊天室的出现打破了只能按条件查找好友的局限性，大家可以随意进入聊天室房间，进行在线聊天。怀念那个穿…
短短几行代码搞懂 vuex 的核心我们都知道在用 vue 的时候，简单的父子通信和 EventBus 已经不能满足我们的要求了，嵌套层级过多和难以追踪改变是两个较为主要的问题:dizzy_face:，这个时候可以用 vuex 来解决，想必大家都用过，所以今天跟大家分享的是 vuex 的简单实现，真的是超简单，就几行代码（文章结尾有链接），带你领略 vuex 的精髓，并且在最…

关注github前端日报订阅精彩文章

前端日报栏目数据来自码农头条，每日分享互联网上热门的前端开发、移动开发、设计、资源和资讯等，为开发者提供动力，如果觉得内容对你有用，记得分享给你的小伙伴。进入码农头条查看更多

关注我

我的微信公众号：前端开发博客，在后台回复以下关键字可以获取资源。

回复「小抄」，领取Vue、JavaScript 和 WebComponent 小抄 PDF
回复「Vue脑图」获取 Vue 相关脑图
回复「思维图」获取 JavaScript 相关思维图
回复「简历」获取简历制作建议
回复「简历模板」获取精选的简历模板
回复「加群」进入500人前端精英群
回复「电子书」下载我整理的大量前端资源，含面试、Vue实战项目、CSS和JavaScript电子书等。
回复「知识点」下载高清JavaScript知识点图谱

每日分享有用的前端开发知识，加我微信:caibaojian89 交流