# 最新文章

• 无声半年：面试、实习和生活总结
• Koa 源码解读：
  1. 架构设计
  2. 核心库原理
  3. 手动实现玩具版 koa
• VemoJS 源码拆解
• 玩转 NodeJs 命令行
• Jest 实战系列

# 已完成系列

• [x] 设计模式手册
• [x] Webpack4 渐进式教程
• [x] 前端面试手记

# 进行中系列

• [ ] UI 设计
  • [x] css 与 scss
  • [ ] animation
  • [ ] react component

# UI 设计

• CSS 篇
  • border-sizing 属性和应用
  • Flex 上手与实战
  • 你了解 css3 的 nth-child 吗
• Scss 篇
  • 基础：配置和运行
  • 进阶：继承、占位符和混合宏
  • 「译文」逐步替换 Sass

# 前端面试手记

• JavaScript 篇
  • JavaScript 基础知识梳理(上)
  • JavaScript 基础知识梳理(下)
  • 正则表达式
  • 前端面试中常考的源码实现
• ES6 篇
  • ES6 重难点整理
  • 谈谈 promise/async/await 的执行顺序与 V8 引擎的 BUG
• HTML5 篇
  • canvas 学习和滤镜实现 + canvas 离屏技术与放大镜实现
  • websocket 学习和群聊实现
  • ServiceWorker 离线缓存实战
  • 原生拖拽事件

# 设计模式手册

每种设计模式基本都用ES6和Python进行了实现，选取的例子也都是最典型的应用（避免长篇大论）。

1. 单例模式
2. 策略模式
3. 代理模式
4. 迭代器模式
5. 订阅-发布模式
6. 命令模式
7. 组合模式
8. 享元模式
9. 责任链模式
10. 装饰者模式
11. 状态模式
12. 适配器模式
13. 桥接模式
14. 解释器模式
15. 备忘录模式
16. 模板模式
17. 工厂模式
18. 抽象工厂模式

# Webpack4 渐进式教程

配套代码地址：https://github.com/dongyuanxin/webpack-demos

1. webpack4 系列教程: 前言
2. (一): 打包 JS
3. (二): 编译 ES6
4. (三): 多页面解决方案--提取公共代码
5. (四): 单页面解决方案--代码分割和懒加载
6. (五): 处理 CSS
7. (六): 处理 SCSS
8. (七): SCSS 提取和懒加载
9. (八): JS Tree Shaking
10. (九): CSS Tree Shaking
11. (十): 图片处理汇总
12. (十一)：字体文件处理
13. (十二)：处理第三方 JavaScript 库
14. (十三)：自动生成 HTML 文件
15. (十四)：Clean Plugin and Watch Mode
16. (十五)：开发模式与 webpack-dev-server
17. (十六)：开发模式和生产模式·实战