现在是2018年，前端开发中层出不穷的框架和新技术，如何能入门前端开发？
这个专栏就是为了这个问题而产生的，把握住不变的要点，然后去适应这个变化的前端世界。

css中关于background属性的用法，经常会使用到，并且老是记不清，这里做一下总结，方便后面开发查阅。

background是多个属性的简写，因此要了解background中各个属性的用法，才能理解其本身。background是按照以下的顺序进行设置的:
background-clip, background-color, background-image, background-origin, background-position, background-repeat, background-size, 和background-attachment。

这篇文章第一版是在2018年写的，当时写的比较粗糙也没有配图，近期重新翻新并增加一些之前没有提到的功能点，主要作为自己平时的使用指南，如果能帮助到其他人那是更好的。

由于使用NPM在国内的安装速度很慢，找了一些解决方案，因此引出了Yarn + 淘宝源的使用方案，记录一下Yarn使用的方法

1. Yarn简介
2. Yarn安装
3. NPM源配置
4. Yarn使用

Yarn简介

Yarn是FaceBook推出的一款基于nodejs的依赖管理工具，在npm基础上做了一些改进。Github上的star已经超过30k。

超快

Yarn caches every package it downloads so it never needs to download it again. It also parallelizes operations to maximize resource utilization so install times are faster than ever.

非常安全

Yarn uses checksums to verify the integrity of every installed package before its code is executed.

超可靠

Using a detailed, but concise, lockfile format, and a deterministic algorithm for installs, Yarn is able to guarantee that an install that worked on one system will work exactly the same way on any other system.

详细的优点可参看知乎的评价文章如何评价Facebook推出的JavaScript模块管理器yarn？

Yarn安装

这里列一下MacOS下的安装方法：

使用Homebrew进行安装，如果没有安装Node.js会自动进行安装

1

brew install yarn

如果已经使用nvm或者类似的工具安装过Node.js，可以选择忽略安装

1

brew install yarn --without-node

验证是否安装成功:

1

yarn --version

NPM源配置

有两种方法：

一、直接配置

1
2
3
4

// 配置registry
npm config set registry https://registry.npm.taobao.org/

npm config get registry

二、使用nrm切换npm源

1
2
3
4
5
6
7
8
9
10
11

// 安装nrm
npm i nrm -g

// 列出所有可用的registry
nrm ls

// 使用淘宝源
nrm use taobao

// 测试速度
nrm test

建议使用第二种方案

Yarn使用

列举一些常用的命令：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

// 新建一个项目
yarn init

// 添加依赖
yarn add [package]
yarn add [package]@[version]
yarn add [package]@[tag]

// 添加其他类型的依赖到项目中
// 其中dev是开发依赖；peer一般用于开发库；
// optional为可选依赖，安装过程中报错也可忽略
yarn add [package] --dev
yarn add [package] --peer
yarn add [package] --optional

// 升级依赖
yarn upgrade [package]
yarn upgrade [package]@[version]
yarn upgrade [package]@[tag]

// 移除依赖
yarn remove [package]

// 安装一个项目的所有依赖
yarn

// 或者
yarn install

本文翻译自Directly Upgrading From AngularJS 1.X To Angular Without Preparing The Existing Code Base

正文：

当我们从AngularJS 1.x升级到Angular(2/4/5)时，我们通常会先准备AngularJS 1.x的代码：

这个过程会引入像组件这类新的AngularJS 1.x技术。并且，引入TypeScript和像SystemJS或者Webpack之类的模块加载器是准备已有代码的进一步工作。这样做的目的是为了让代码更接近Angular便于更好的集成。

但是，在一些情况下，准备已有的代码成本很大。例如，试想一下这样的情形，当你不想修修改已有的AngularJS1.x的代码，并且想要写一些Angular的应用。当这样的情况在你的项目中发生，跳过准备阶段是一个好的主意。

这篇文章一步步展示如何完成这个过程。像官方的升级教程一样，包含准备代码的工作，这里也是升级流行的AngularJS 1.x 手机分类实例。

即使这个实例覆盖了AngularJS 1.5中引入的组件，这里展示的对使用控制器(controller)和指令(directive)的代码也适用。

整个实例代码可以在Github 仓库中找到。为了接下来每一步更容易，我针对每一步做了一个代码提交。

问题

通过Echarts展示多个系列的数据，并且每个系列的数据只有一条展示在坐标轴的某个值上。
比如，Y轴类别A上展示A系列，Y轴类别B上展示B系列数据，X轴共享，正常配置数据会导致Y轴
上显示1条数据，但是会有两条空白。

解决方案

通过系列数据中的barGap属性，设置柱间距离为”-100%”，使各个柱重叠显示。

实例

See the Pen Echarts Demo独立系列独立坐标轴 by Perry (@perry2008084) on CodePen.

技术类:
[ ] 《Linux: 鸟哥的私房菜》
[ ] 《正则表达式必知必会》
[ ] 《HTML5实战手册》
[ ] 《别闹了，费曼先生》
[ ] 《HTTP权威指南》
[ ] 《CSS禅意花园》
[ ] 《Web前端开发修炼之道》
[ ] 《锋利的jquery》
[ ] 《JavaScript权威指南》
[ ] 《重构》
[ ] 《精通正则表达式》

人文历史类:
[ ] 《传习录》
[ ] 《王阳明全集》
[ ] 《富兰克林传》
[ ] 《百年孤独》
[ ] 《十日谈》
[ ] 《异类》
[ ] 《人生的盛宴》
[ ] 《浮生若梦》

经济类:
[ ] 《国富论》
[ ] 《一本书读懂财报》
[ ] 《世界上最简单的会计书》

其他:
[ ] 《失控》
[ ] 《创业维艰》
[ ] 《可爱的诅咒：圣母型人格心理自助手册》
[ ] 《精益创业》
[ ] 《生命之书》
[ ] 《黑客与画家》
[ ] 《正念的奇迹》
[ ] 《只要会呼吸.就能做冥想》

增加2017年的未读书籍，并增加王阳明的两本书。–2018.1.1
初版，更新于2017年12月24号

缘来:

每一天的时间有限，做得越多，不重要的事也做得多，压力也大；因此，减少做的事情，做重要的事，提高效率。

总则：

1、简化事务(simplify)
2、专注事务(focus)

几个原则：

1、设置限制
2、选择必需的事务，让时间和效率最大化
3、简化，减少非必需的事务
4、专注，这是变得更加高效的最重要的工具
5、养成新的习惯来不断进步
6、通过小步提高来确保开始新的习惯

专注：

专注是决定你是否能完成一个目标或者坚持养成一个新习惯最重要的因素。保持你在模板和习惯上的专注。专注于当前和现在会让你受益良多。这样可以减少压力并帮助你享受充实的人生。只专注于手头上的任务和正能量的。关注负能量的想法并用正能力去代替。
单任务，同一时间只进行单任务。多任务的切换是耗费时间和精力的，会让你出错或者会
变得有压力。

习惯：

养成一个长久坚持习惯的方法是应用少的力量：专注于一个习惯，一个月一个。
选择一个新习惯，写下计划，公开你的目标并每天更新你的进度。
养成习惯的时候，庆祝你的新习惯。

ESLint在JavaScript静态代码检测中变得很流行了，主要有几个原因：第一，容易配置；第二，混合了JShint和JSCS；第三，大神Nicholas Zakas写的，写JavaScript红宝石的作者。

安装ESLint

安装ESLint之前，确保环境中已经安装Node.js和npm。

npm install -g eslint

可以选择全局安装，也可以选择安装在项目本地。

大纲：

设定目标的意义和常见的问题
使用SMART法则设定适当的目标
执行、检查和修正目标

设定目标的意义和常见的问题

目标犹如一座灯塔，设定了一个准确的目标，能够帮助我们达到我们想要的目的。

准确的设定目标，是目标能够达成的前提条件之一。而我们通常遇到的问题，比较严重的就是，没有
准确的设定目标，导致目标在执行过程中，出现以下的几类问题：
1、不知道如何评判是否达成目标
2、没有时间期限导致拖延
3、目标太模糊、太大，导致无法实现而放弃