YolkPie

前言搭建博客其实很简单，但要注意很多细节问题，之前本人也搭建过博客，那时也踩过一些坑，但是现在重新搭建博客，感觉自己又把之前踩过的坑又踩了一遍。所以为了避免以后搭建博客采坑，所以在此记录一下搭建博客的全流程以及一些注意事项。本文搭建的博客基于Hexo，主题选用Butterfly，使用Travis CI自动部署到Github Pages和Coding Pages上，并在腾讯云上申请个人域名与博客进行绑定。 安装Hexo安装Hexo并初始化博客，这个没啥好说的，按照Hexo官网指示安装初始化即可。 12345$ npm install hexo-cli -g # 全局安装hexo-cli脚手架，如果不想全局安装，那就使用npx安装$ hexo init blog # 初始化博客$ cd blog # 进入博客根目录$ npm install # 安装依赖$ hexo s # 本地预览 使用主题本文的博客使用Butterfly，个人觉得这个主题 ...

1.核心概念 state：应用的状态，树形结构，可以囊括很多子state。 action：想要更改state中的数据，需要发起（dispatch）一个action。action是一个简单对象，描述了state的变化。按照约定，action具有type属性来描述它的类型。 action creator：一个创建action的函数，是一个创建action的工厂。 reducer：根据action的描述来生成新的state。 dispatch：发起action的函数，其内部会调用reducer来生成新的state。 store：维持应用所有state树的一个对象，改变store内state的唯一途径是对它dispatch一个action。一个应用有且仅有一个store。 store creator：一个创建store的函数。 store enhancer：一个组合store creator的高阶函数，返回一个强化班的store creator，通过复合函数改变store的接口。 2.核心API2.1 storestore是一个对象，拥有四个方法属性。通过createStore函数创建sto ...

大前端应用对比现今的前端应用实现方案已经不仅仅只有H5这种形式了，各端小程序、RN、Flutter等相继都在各自领域散发着不同的光芒。本文将各种方案做一个简单的整理，便于方案选型是使用，大概内容如下： 平台 优势 劣势 适用场景 难易程度 H5 1.跨平台2.开发成本低3.维护迭代方便4.推广成本低 1.联网要求高2.性能不够理想3.调用硬件困难4.复杂交互性能低 1.需要跨平台能力2.展示内容丰富3.互动性没有特别高4.性价比要求高 简单 微信小程序 1.即用即走2.跨平台3.使用微信提供原生能力4.倚靠微信流量/微信生态赋能 1.留存问题2.受控于微信3.适用性：只能微信端使用 1.只在微信环境使用2.使用系统硬件能力3.使用微信赋能 中等 京东小程序 1.倚靠京东APP流量2.京东APP赋能 1.只能在京东APP运行(京东系后续可能会支持)2.兴起时间较短，不完全成熟 1.只在京东APP内使用2.需要京东APP赋能的场景 中等 ReactNative 1.用户体验更好2.布局简便3.拓展性较强(调用原生)4.原生能力支持(动画、收拾等) 1.扩展性稍弱2. ...

为什么要进行单元测试测试是开发工作的一个重要环节，但是往往由于编写和维护测试代码的成本问题，编写测试代码这个环节往往是被忽略的。首先说说前端单元测试为什么是重要的。 仔细想一下，在我们的工作中是否经常遇到过下面的问题： 修改某个模块的功能，引起了其他模块的问题； 代码难以维护，新增需求时难以评估在整个项目的影响范围； 多人开发的代码难以维护，往往是新增加一份代码来替代原有功能； 由于测试资源和测试对项目熟悉程度的问题，代码无法重构； 代码质量差，每次更新都像在打补丁； 项目需要频繁更改上线，但因为某些模块的复杂扭曲的逻辑，实在快不起来； 等等等等。。。 如果你对这些问题感同身受，那么就有必要考虑是不是要使用单元测试了。增加自动化测试后，可以达到下面的目的： 为核心功能编写测试后，可以保障项目的可靠性； 强迫开发者编写更容易被测试的代码，提高代码质量； 编写的测试有文档的作用，方便维护。 总的来说，如果你想保证代码质量，那么你需要写单元测试；如果你想随时整理重构代码，那么你需要写单元测试；如果你想有自动化的测试套件来帮你快速验证提交的完整性，那么你需要写单元测试。当然，如果你 ...

京东小程序上手官网：https://mp.jd.com 简介： 京东小程序 是一种全新的开放模式，可以被便捷地获取和传播。它令终端用户获取更好的使用体验，为商家实现线上线下的交易闭环，给开发者提供一种快速开发方式。 京东小程序只需一次开发即可运行在京东 APP、京东金融 APP、京麦 APP 三端。京东 APP、京东金融 APP 会开放特定的能力，对优质小程序还会开放多个高流量入口，包含扫码、搜索、消息等多种方式触达。而京麦 APP 小程序主要用于商家工具插件的开发定制。   体验京东小程序京东小程序开发平台为开发者提供快捷API、及组件预览工具，可在项目开始前对京东小程序开发进行了解。 使用京东APP扫描下方小程序码可以预览该 Demo    使用京麦APP扫描下方小程序码可以预览该 Demo    使用京东金融APP扫描下方小程序码可以预览该 Demo    开发者内测申请京东小程序采用京东 pin 登录，初次登录京东小程序平台需要填写邀请码，若无邀请码可点击下方获取邀请码申请。 邀请码 ...

typescript入门基本数据类型基本数据类型包括：boolean、number、string、null、undefined 以及 ES6 中的新类型 Symbol。 12345678910111213141516171819// 布尔值let isShow: boolean = false// 数字let num: number = 6// 字符串let name: string = "bob"// null 和 undefinedlet u: undefined = undefinedlet n: null = null// undefined 和 null 是所有类型的子类型，可以赋值给其他类型let num: number = undefined// void 可以用 void 表示没有任何返回值的函数function alertName(): void { al ...

一、色彩的基础理论1.色彩是什么​ 色彩是人脑识别反射光的强弱和不同波长所产生的差异的感觉，与形状同为最基本的视觉反应之一。物体被光线照射，反射光被人脑接受，形成的色彩。总之，没有光照就不存在色彩，而且我们的日常生活中看到的所有色彩都不是物体本身的颜色。颜色本质上并不是物体本身固有的属性，或者更大胆地说，任何事物都是没有颜色的。我们之所以看到一个苹果是红色的，是因为它反射的光线进入我们眼睛，刺激我们的视觉神经，使我们产生了“红色”的知觉。 ​ 光波是电磁波的一种，电磁波包括X射线、紫外线等很多种，其中人类能够看到的称之为“可见光”。根据可见光的电磁波波长由短到长的顺序，我们可以识别蓝紫色、紫色、青绿色、绿色、黄绿色、黄色、橙色、红色等色彩。光线中包含很多种色彩，但光线本身却是无色的。 ​ 电磁波中人类肉眼可感知的波长范围被称为”可见光”，可见光的波长约为360-400nm，长波长约为760至830nm，如果波长超过可见光的波长范围（更长或者更短），就超出了人眼所能感知的范围了。 2.色彩的三属性色彩有三个属性：色相、明度、纯度。 色相：色相是 ...

动画的多种实现方式与性能对比首先我们来了解一下Web有哪些动画形式 CSS3动画 Transform（变形） Transition（过渡） Animation（动画） JS动画（操作DOM、修改CSS属性值） Canvas动画 SVG动画 以Three.js为首的3D动画 以上各种动画形式都可以制作出一种类型的动画，那就是帧动画，帧动画的实现原理是不断切换视觉内图片内容，利用视觉滞留生理现象来实现连续播放的动画效果 应用场景帧动画一般用来实现稍微复杂一点的动画效果，同时希望动画更细腻，设计师更自由的发挥。他可以定义到每一个时间刻度上的展现内容，我们一般用帧动画来做页面的Loading，小人物，小物体元素的简单动画。我们想象中的帧动画应该有以下几个特点： 1. 可以自由控制播放、暂停和停止 2. 可以控制播放次数，播放速度 3. 可以添加交互，在播放完成后添加事件 4. 浏览器兼容性好 GIF图我们可以将上面制作的帧动画导出成GIF图，GIF图会连续播放，无法暂停，它往往用来实现小细节动画，成本较低、使 ...

React 内置 Hook 如下： 基础 Hook useState useEffect useContext 额外 Hook useReducer useCallback useMemo useRef useImperativeHandle useLayoutEffect useDebugValue useState1const [state, setState] = useState(initialState); 为函数组件添加一个内部 state，在组件重新渲染时保留 state 的值，返回一个数组，第一个值为 state 的值，第二个值为更新 state 值的函数。 useEffect1useEffect(didUpdate, [deps]); 在函数组件的主体内，操作 DOM 、订阅事件、设置定时器、记录日志以及包含其他副作用的操作都是不允许的。该 Hook 接收一个包含副作用操作的函数和一个依赖项数组，在每次渲染到屏幕之后执行副作用函数。可以为副作用函数返回一个清除副作用的函数，在组件卸载之前清除副作用。当依赖项数组是一个空数组时，副作用数组只会在组件首次渲染时 ...

模块机制前言程序员最怕两件事，第一件事是产品改需求，第二件事是接手的代码乱七八糟结果最后发现是自己以前写的。很不幸，我正在经历第二件事。本文旨在让你对模块机制有简单了解以及对require js的核心原理的介绍。 什么是模块模块的实质就是业务逻辑的低耦合高内聚，一个模块独立实现一个功能不依赖其他模块，这就是低耦合高内聚。而不是所有功能代码堆叠在一起，牵一发而动全身。模块最重要的是你使用它时仅导入导出你所需要的绑定。 引入模块和引入脚本是有区别的，模块可以理解为按需加载，后者更多是一次性引入全部不管你有没有用，例如引入JQuery。 模块编程的几种方式原始写法123456function a() { //......}function b() { //......} 这种做法的缺点很明显：”污染”了全局变量，无法保证不与其他模块发生变量名冲突，而且模块成员之间看不出直接关系。 对象写法12345678910 var obj = new Object({ num:0, fn1 : function (){ ...