枫上雾棋的日志

0

你不知道的 React Router 4

枫上雾棋 2 天前发布
收藏

几个月前，React Router 4 发布，我能清晰地感觉到来自 Twitter 大家对新版本中其大量的修改的不同声音。诚然，我在学习 React Router 4 的第一天，也是非常痛苦的，但是，这并不是因为看它的 API，而是反复思...

3

React Web 动画的 5 种创建方式，每一种都不简单

枫上雾棋 6 天前发布
30 收藏

以前一直投入在 React Native 中，写动画的时候不是用 CSS 中的 transitions / animations，就是依赖像 GreenSock 这样的库，最近转向 Web，在 Tweet 得到很多大佬关于 React Web 动画的回应，于是决定分享给大...

28

如何只用 CSS 完成漂亮的加载

枫上雾棋 8月12日发布
278 收藏

为什么要做加载只想说, 本文最重要的是对 CSS, 伪元素, keyframe的分享, 以及读者对这些东西的真正掌握, 我并不是怂恿大家在每一个页面的前面都去加一个酷炫的加载我是如何做的不同的页面, 对加载的设计也就可...

0

CSS 自定义属性 -- 使用 JS 和不使用 JS

枫上雾棋 8月8日发布
1 收藏

你曾想过在页面加载过后去修改 Sass 或 Less 的变量值么? 我曾经尝试过, 但并没有成功, 因为当预处理的代码编译成了 CSS, 它的变量就不再是变量了, 然而, 自定义属性就没有这样的限制. 在该系列的文章中, 我曾提...

0

在 React 16 中使用高阶组件来捕获异常

枫上雾棋 8月7日发布
4 收藏

可能你已经知道, 在 React 16 中, 将会引进一个全新的架构 - React Fiber, 它彻底重写了 React 的协调算法, 并引入了一些新的特性. 这篇文章就是跟大家分享 React 16 中新的生命周期方法 - componentDidCatch, 它...

0

在 React 中使用 collections, 一定不能忘了 key

枫上雾棋 8月5日发布
2 收藏

在 React 中 render collections 的 items 时, Keys 扮演着重要的角色, 它直接决定接下来的 rendered 和 re-rendered. React 不会 render 重复的 keys 为了彻底明白这个, 我们来声明一个这样的数组 {代码...} 现...

1

React 演化史

枫上雾棋 8月3日发布
6 收藏

在 Stack Overflow Trends 中快速搜索 React 的技术趋势, 可以清楚地发现 2014 到 2017 年 React 呈现稳步增长的趋势, 而且在各大社区不难发现, 世界各地的开发人员在最近几年都在积极寻求并获得有关 React 问题...

6

React 组件解耦之道

枫上雾棋 7月5日发布
37 收藏

React 的组件非常的灵活可扩展，不过随着业务复杂度的增加和许多外部工具库的引入，组件往往也会显得浮肿，接下来我们就一起来看看常见的几种，遵循单一职责原则的，组件分割与解耦的方法分割 render 函数当一...

0

微信小程序那些事

枫上雾棋 6月22日发布
1 收藏

微信小程序自1 月发布以来有段时间了，之前给我的印象就是背影很美，估计是个美女，因为听到小程序不需要下载，安装，信息触手可及，用完即走，无需卸载，感觉那可谓是前途无量，然而当时正使用Ubuntu开发的正欢...

6

前端每周清单第 7 期

枫上雾棋 6月21日发布
17 收藏

front-end 19+ 个 JavaScript 简写技巧这对于任何基于 JavaScript 的开发人员来说都是必须的。我已经把这篇文章作为学习我多年来收录的简写 JavaScript 编码技术的重要参考依据。当然，注意原文中的标注，部分...

0

前端每周清单第 6 期

枫上雾棋 6月14日发布
1 收藏

front-end 采用 Flow & TypeScript 本文主要对比了 Flow 与 TypeScript 这两个常用的 JavaScript 静态类型检测工具，首先介绍了在简单项目中如何使用 TypeScript 与 Flow。然后对比了二者在类型覆盖率上的渐...

0

前端每周清单第 5 期

枫上雾棋 6月4日发布
收藏

front-end Web 前端开发的未来用户期望上升，我们构建不再是页面，而是系统，本机和 Web 之间的界限模糊不清，URL仍然是一个杀手锏，CSS 将更加模块化，CSS 预处理将逐渐消失，精通 HTML 和 CSS 仍然至关重要，...

0

Make Code Elegant and Strong

枫上雾棋 6月1日发布
1 收藏

具备基本工程素养的同学都会注重编码规范和持续集成，本工程主要带大家熟悉目前前端流行的代码校验和单元测试工具的使用，代码(相关的配置)详见GitHub 仓库，希望对大家能有所启发．另外，这些技术栈搭配webpack...

0

前端每周清单第 4 期

枫上雾棋 5月31日发布
5 收藏

front-end 从零到一的 React 学习与实践资料索引 React 学习与实践资料索引从属于笔者的 Web 开发基础与工程实践中的阅读学习资料工具集锦系列，本文内容是笔者在学习与实践 React 以及准备每周的前端清单系列时...

0

前端每周清单第 3 期

枫上雾棋 5月20日发布
1 收藏

front-end 适合初学者的箭头函数本片文章从 Shorter Syntax 和 No binding of this 两个方面带你认识 arrow functions, 便于今后更深入的学习 back-end 用一句命令创建 Next.js 应用程序您不需要安装或设置 Web...

0

前端每周清单第 2 期

枫上雾棋 5月12日发布
2 收藏

front-end Headless Chrome 入门 back-end pkg：将 Node 项目打包到可执行文件中想要在没有安装 Node 的系统上运行 Node-powered 应用程序？通过将节点和应用程序全部包装在一起，pkg 可以更轻松地分发应用程序...

0

当你决定使用 Ubuntu 来开发时

枫上雾棋 5月9日发布
1 收藏

安装下载 Ubuntu Kylin 最新 ubuntu-kylin 使用 UltraISO 制作 U 盘启动盘 {代码...} 入门了解目录 /home 用户的主目录 /boot 启动目录，启动相关文件 /sbin 超级用户才能使用的目录 /root 超级用户的主目录 /p...

0

前端开发必备的 atom 插件, 其他编辑器也类似

枫上雾棋 5月3日发布
收藏

Manual installation cd ~/.atom/packages git clone 插件的远程仓库 cd 插件目录 npm install 重启 atom Atom plugins emmet {代码...} file-icons {代码...} autocomplete-paths {代码...} highlight-line {代...

0

前端每周清单第 1 期

枫上雾棋 4月23日发布
2 收藏

front-end What is the difference between web design and web development? 网页设计师的角色是什么？涉及网页设计的工作？网页设计和网页开发是一样的吗？它们是相同的含义吗？答案肯定是否定的。这篇文章...

0

使用 Doxygen 生成源码文档

枫上雾棋 4月19日发布
收藏

Doxygen 是一个开源跨平台的，以类似 JavaDoc 风格编写软件参考文檔的工具 Getting started 创建配置文件 {代码...} 运行 doxygen {代码...} Configuration 项目名称 {代码...} 项目简介 {代码...} 项目 Logo {代...