没有接触过Chrome扩展的时候，觉得它一定很复杂。crx的后缀也让我猜不出是用什么语言编写的，现在才发现不过就是HTML+CSS+JavaScript……
这个扩展本身很简单，实际只有一行代码。Google提供了一个非常好的入门指导，过一遍基本上就可以编写简单的扩展了。这个扩展作用也就是通过去掉页面样式来检查页面结构（参考这篇文章），可以用来解决下面的问题：
使用这个扩展配合Chrome的检查工具可以快速的定位到出问题的元素。
Chrome商店的地址：
https://chrome.google.com/webstore/detail/ghostpage/hegpcollkgldlimbhkimijhhhoaicipp
附注：虽然扩展编写很简单，但为了交5美元的开发者认证费用却花了我一天时间。尝试了下面几种方式均失败了：
最后花了两倍多的价格在淘宝上买了一个虚拟信用卡，第二天中午扣款成功了。
应某出版社邀约，开始写一本关于Flask开发的书。全书主要由三部分组成：基础内容、项目实践、进阶应用。预计2018年初出版。
上次用Flask做了一个计时器，没有实现番茄时钟的功能，这次用JavaScript完成了。
Demo：https://greyli.github.io/pomodoro
源码：https://github.com/greyli/pomodoro
用JavaScript做了一个计算器，大部分时间都花在完善样式和交互上了，现在还想着再给它添加一个主题。我发现，我喜欢把一个东西从丑变美的过程，好看比好用更吸引我。这不是一个好习惯……
Demo：https://greyli.github.io/calculator/
源码：https://github.com/greyli/calculator
在这个计算器里，用到了一些处理技巧，可以让它看起来更真实和漂亮。
计算器边缘阴影
这里使用box-shadow的inset方法，也就是把阴影内嵌到元素里，让计算器看起来是有厚度的：
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), inset -1px -6px 12px 0.1px #89847e;
参考内容：https://css-tricks.com/snippets/css/css-box-shadow/
按钮按下效果
其实是设置按钮的box-shadow，按下时把box-shadow设为none，同时按钮向下移动
button {
box-shadow: 1px 2px #666;
}
button:active {
box-shadow: none;
transform: translateY(4px);
} 按钮上的字不可选择
双击按钮或是拖动按钮选择会出现蓝色背景色，设置user-select去掉这个特性
.un-selectable {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
} 去掉按钮被选中后的蓝色边线
button:focus {outline:0;} /* 设为none效果相同，或加上 !important */
一开始我学Python下面的GUI库tkinter的时候，尝试着做了一个记事本程序，然后就实现了100words。现在是100Words的1.1版。和之前相比，新版的100words增加了查单词，计时和字数统计功能，界面上也更加美观。
100words是一个英语写作练习软件，特点只有一个：如果想要保存，就得写满100个单词。
这个软件可以作为英语学习辅助使用。假如你正在学习英语，每天都有一定量的输入，比如说阅读或是听播客，那么你可以使用它来进行复习和回顾。每天一百个单词也许很少，但是通过长久的积累，同时搭配语法的学习和大量语料的输入，写作水平就会得到指数级的提高。
新版界面
100Words v1,1
旧版界面
100Words v1.0
使用微软翻译实现，可以翻译词语和句子。
目前还没有添加到统计数据里，比较鸡肋。只能用来测试自己的写作速度。未来的版本会把时间数据做成折线图。
参考了PythonCookbook里的计时器的实现方法。文本输入框上面的数字标签会实时显示当前的字数。
你可以在File-Analysis下看到你所有的写作数据（目前只有日记数量）
虽然目前功能上还不完善，最重要的拼写检查功能没有实现。但还是会有接下来的版本的：）
本来说要好好学习一下前端技术，可没过几天，又开始了堆积木式的创造：把各种JS库，CSS库搭配起来，最终用Python做胶水实现了一个网页相册生成器。顺便用Bootstrap的模板做了一个介绍页：翻相册（fanxiangce.com）。
故事还要从我上次做幻灯片讲起。用impress.js做了幻灯片不久，就想着用Python搭配impress.js做一个幻灯片生成器，最终实现的效果是：可以从一个文本文档里读取文本，每一行创建一张幻灯片，坐标可以固定（通过在每一行的结尾传入坐标参数），也可以随机（没解决遮盖问题）。做着做着，发现这并不实用。估计没人愿意用这种死板无聊的幻灯片。没过几天，又想用impress.js搭配csshke做一个记单词的网页程序，几天后因为能力不够被暂时搁置了。
接着，又有了新的想法，在原来的幻灯片生成器的基础上改了改，做成了一个照片墙生成器。原理很简单。就是通过获取图片的数量和文件名，生成足量的坐标，然后用Python生成相应的div，最后连接头尾组成一个完整的HTML文件。做成这样一个照片墙：
点击任一张图片可以拉近，点击相邻图片可以移动位置。
又过了几天，照片墙实现了tooltip功能，可以自动把文件名（没有格式后缀）设为tooltip内容。我想到的一个理想的应用场景是：集体制作照片墙，每个人上传自己的照片给某个人，以自己的名字作为文件名，收集照片的人只需要上传照片，设置标题，然后点击生成。打开后每张照片在鼠标掠过时都会用tooltip显示姓名。像这样：
tooltip的颜色可以自定义。
故事还没完。又过了几天，我买了fanxiangce.com，做了一个粗糙的介绍页。发现功能还太单调，和其他的在线相册相比没有什么吸引力。又实现了立体相册，像这样：
点击任意一张照片可以拉近
随机散落（仍然没有解决遮盖问题），像这样：
随机散落的照片，点击任一张可以拉近
标签云（使用svg3dtagcloud.js）：
基于文本的标签云
点击标签就会打开相应的图片：
使用remodal.js实现的弹窗
现在只是一个简单的demo，未来还会实现很多功能，比如把标签换成图片缩略图。可以参见TagCanvas。
上面的相册都有相应的demo，欢迎到翻相册上体验。也欢迎申请试用。虽然已经花了很多时间在上面，但是要做的事情还有很多。比如实现模拟翻页的相册，让图片更美观的排列，不是单一的对齐。等我暑假学习一下Flask和JS，把网站做出来，顺便把电脑端程序和在线程序做出来，就可以开放注册和在线自动生成相册了。
这是一个英语日记写作程序，可以作为英语学习辅助使用。假如你正在学习英语，每天都有一定量的输入，比如说阅读或是听播客，那么你可以使用它来进行复习和回顾。每天一百个单词也许很少，但是通过长久的积累，同时搭配语法的学习和大量语料的输入，写作水平就会得到指数级的提高。
100Words v1,1
1.自动创建 ‘C:UsersAdministratorMyDiary年月’ 目录树及文件。
2.以日为文件名创建txt文件，txt文件开头写入日期与时间。
3.每篇日记要求字数100。
4.查看以往日记点击File-Reflect。
5.查看以往日记不支持再编辑，点击保存会添加到当天内容。
6.数据统计。
1.点击这儿下载文件。
2.双击安装字体文件（Purisa.ttf）。
3.然后就可以打开程序（100 Words.exe）了。
Rule 1: You must write no less than 100 words. Rule 2: You can only use one emoji in one day. Rule 3: You can not change the previous diary.
1.根目录下的exe文件是用pyinstaller打包。
2.Diary.spec为打包后生成的配置文件。
3.代码中的音频调用使用了一个resource_path(relative_path)函数，在调用文件的地方使用这个函数包裹。 然后在.spec文件中指向具体的文件地址，打包后即可正常调用。 4.详情见注释。
1.图形界面；————√
2.拼写检查；
3.年底自动总结完成情况，包括每月完成量，生成折线图；
4.添加表情；
5.activity calendar。
6.图标问题。
7.反馈。————√