彭加李

摘要： 其他章节请看： 七天接手react项目 系列 react 脚手架创建项目 前面我们一直通过 script 的方式学习 react 基础知识，而真实项目通常是基于脚手架进行开发。 本篇首先通过 react 脚手架创建项目，分析其目录结构，接着编写第一个组件、解决样式覆盖，最后配置代理 proxy 以及 阅读全文

摘要： 七天接手react项目 背景 假如七天后必须接手一个 react 项目（spug - 一个开源运维平台），而笔者只会 vue，之前没有接触过 react，此刻能做的就是立刻展开一个“7天 react 扫盲活动”。 react 活动扫盲方针 以读懂 spug 项目为目标 无需对每个知识点深究 功能优先 阅读全文

摘要： 其他章节请看： 七天接手react项目 系列 生命周期&受控和非受控组件&Dom 元素&Diffing 算法 生命周期 首先回忆一下 vue 中的生命周期： vue 对外提供了生命周期的钩子函数，允许我们在 vue 的各个阶段插入一些我们的逻辑，比如：created、mounted、beforeDe 阅读全文

摘要： 其他章节请看： 七天接手react项目 系列 state&事件处理&ref 在 react 起步 一文中，我们学习了 react 相关知识：jsx、组件、props。本篇将继续研究 state、事件处理和ref。 state State 与 props 类似，但是 state 是私有的，并且完全受控 阅读全文

摘要： 其他章节请看： 七天接手react项目 系列 react 起步 背景 假如七天后必须接手一个 react 项目（spug - 一个开源运维平台），而笔者只会 vue，之前没有接触过 react，此刻能做的就是立刻展开一个“7天 react 扫盲活动”。 react 活动扫盲方针 以读懂 spug 项 阅读全文

摘要： DevOps 前端开发和 Spug 朋友新工作是进行 DevOps 前端开发，涉及 Spug。 DevOps 是什么 DevOps 是一种思想。用于促进开发和运维之间的沟通、协作或整合。 Tip：DevOps 是 Development 和 Operations 的组合词，即开发和运维。运维工程师 阅读全文

摘要： 初步认识 docker 为什么要学习 docker 有同学说他开发工作中有两大神器，一个是 vim 编辑器，另一个就是 Docker。 什么是 docker Docker 是一个开源的应用容器引擎。 容器的发展之路 业务是基于应用运转，而应用通常运行在服务器中，以前每个服务器只能运行单一应用（见 T 阅读全文

摘要： 初步认识微前端 微前端是什么 现在的前端应用，功能、交互日益复杂，若只由一个团队负责，随着时间的推进，会越来越庞大，愈发难以维护。 微前端这个名词，第一次提出是在2016年底。它将微服务（将单一应用程序划分成一组小的服务，服务之间相同配合，为用户提供最终价值）这个应用于服务端的技术扩展到前端领域。 阅读全文

摘要： 其他章节请看： vue 快速入门 系列 Vue 实例的初始化过程 书接上文，每次调用 new Vue() 都会执行 Vue.prototype._init() 方法。倘若你看过 jQuery 的源码，你会发现每次调用 jQuery() 也会执行一个初始化的方法（即 jQuery.fn.init()） 阅读全文

摘要： 其他章节请看： vue 快速入门 系列 实例方法（或 property）和静态方法 在 Vue(自身) 项目结构 一文中，我们研究了 vue 项目自身构建过程，也知晓了 import Vue from 'core/index' 就是引入 vue 的核心代码，该文件的前两行对应着 vue 的实例方法和 阅读全文

摘要： 其他章节请看： vue 快速入门 系列 Vue(自身) 项目结构 前面我们已经陆续研究了 vue 的核心原理：数据侦测、模板和虚拟 DOM，都是偏底层的。本篇将和大家一起来看一下 vue 自身这个项目，了解它的目录结构，以及构建过程。 vue 的目录结构 将 vue 项目 下载到本地 git clo 阅读全文

摘要： 其他章节请看： vue 快速入门 系列 模板 前面提到 vue 中的虚拟 dom 主要做两件事： 提供与真实节点对应的 vNode 新旧 vNode 对比，寻找差异，然后更新视图 ①、vNode 从何而来？ 前面也说了声明式框架只需要我们描述状态与 dom 之间的映射关系。状态到视图的转换，框架会给 阅读全文

摘要： 遮罩层没有消失 我们请求数据时，通常会先开启一个 loading，数据回来后，做一些处理，然后再将 loading 关闭。 但有时也会出现 loading 没有关闭的情况。就像这样： async function request() { console.log('开启遮罩') let json = 阅读全文

摘要： 浮动 以 mdn float 文档 为基础，逐一介绍浮动的本质、浮动的诸多特性、清除浮动以及块格式化上下文（bfc）。 概念 当一个元素浮动之后，它会被移出正常的文档流，然后向左或者向右平移，一直平移直到碰到了所处的容器的边框，或者碰到另外一个浮动的元素。 卡住 如果包含块太窄，无法容纳容纳水平排列 阅读全文

摘要： 知识体系 写了这么多东西，整理一下，与人方便，与己方便； 有意识的形成自己的知识体系。孤木不成林； 把新知识放入到原有的知识体系中，能有效地将其转为自己的经验； Tip：下面的划分会根据博文（知识体系）的变化而调整 css css 快速入门 系列 浮动 javascript es6 快速入门 系列 阅读全文

摘要： 前端学习 数据结构和算法 快速入门 前言 前端为什么要学习数据结构和算法 为了高效的解决常见问题 对于计算机科学，算法是最基础的概念 好的IT公司，算法是面试中的重头戏 数据结构和算法之间地关系 比如需要解决一个问题，可能得首先选一种数据结构来存储数据，而算法就是基于对数据结构地操作，所以解决一个问 阅读全文

摘要： 其他章节请看： 前端学习 数据结构与算法 快速入门 系列 排序和搜索算法 本篇，我们将一起学习最常用的搜索和排序算法，如冒泡排序、选择排序、插入排序、归并排序、快速排序，以及二分搜索、插值搜索。 同时我们得理解，首先得排好序，才能更好的搜索需要的信息。 著名算法的动画演示 https://visua 阅读全文

摘要： ## 谈面试前端工程师 - 打战需要周全的准备，而找一份年薪几十万的工作对于个人来说不亚于一场大战 - 有一天，你若需要招人，则需要在极短的时间内从各方面考核对方是否合适 - 通过面试可以推动自己主动了解行业新技术，尤其是长期呆在一家技术不那么好的公司 - 面试的内容数不胜数（亦或千奇百怪），面试官 阅读全文

摘要： 其他章节请看： 前端学习 数据结构与算法 快速入门 系列 递归 递归的概念 递归是一种解决问题的方法，它从解决问题的各个小部分开始，直到解决最初的大问题。 递归通常涉及调用函数本身，直接调用自身，亦或者间接调用自身，都是递归函数。就像这样： // 直接调用自身 function fn1(){ fn1 阅读全文

摘要： 其他章节请看： 前端学习 数据结构与算法 快速入门 系列 集合、字典和散列表 集合 集合：由一组无序且唯一的项组成。 Tip：集合 是数学中的概念，但应用在计算机科学的数据结构中。 创建集合类 通常集合有如下方法： add(element): 给集合添加新元素 delete(element) 或 r 阅读全文